Xamarin.forms: [Erweiterung] Android: TabbedPage: Untere Tableiste

Verwandte #1400

Hallo, ich habe gerade eine Pull-Anfrage zu diesem Thema geöffnet. Ich habe ein paar Fragen zur Implementierung, aber es ist ein Ausgangspunkt.
Die Zuordnung war offensichtlich genug.

Ich freue mich wirklich darauf, dass diese Pull-Anforderung in Xamarin Forms zusammengeführt wird. Gibt es eine ETA oder so. Ich habe keine praktikable Lösung gefunden, um eine Seite mit Registerkarten unten auf Android zu haben.

@mikescandy ein Update dazu?

Schließlich suche ich so lange nach diesem Farword!
Ich danke dir sehr!

Wann wird diese Erweiterung eingeführt?

+1
kann ich es auf Nightly build bekommen? cc @PureWeen @davidortinau

Und wie funktioniert es? Können wir es auch im XAML unserer Forms-App festlegen (als Eigenschaft der TabbedPage)?

@netonjm Ich denke , es ist nur eine Stütze „UseBottomNavigation“ https://github.com/mikescandy/Xamarin.Forms/blob/27c6da20b0ade7f96c0fd889f00c96b7e4db1fcc/Xamarin.Forms.Platform.Android/AppCompat/TabbedPageRenderer.cs#L60

aber nicht wirklich sicher über die Details (Symbole und Farben).

Da ich bin :-)

Hoppla

@niels9001 Sie können alle Optionen zum Einrichten der Symbole usw. hier sehen

https://github.com/xamarin/Xamarin.Forms/blob/67d2be4cd224678a350f258b888c568ac8898a8f/Xamarin.Forms.Core/PlatformConfiguration/AndroidSpecific/TabbedPage.cs

Wenn Sie also "UseBottomNavigation" in XAML einstellen, wird die Tableiste unten auf Android und iOS angezeigt (wie es bereits für eine TabbedPage der Fall ist), oder?

Genial :D! Ist diese Erweiterung bereits Teil des neuesten NuGet-Vorabpakets? Und wenn nicht, gibt es dazu eine ETA?

@niels9001 und @PureWeen Ich habe xamarin Forms 3.1.0.506097 Upgrade für Version 2 installiert. Scheint jetzt zu funktionieren, aber denke ich richtig, dass dies dort noch nicht verfügbar ist?

Kann jemand den Prozess erklären, wann Karten (in der geschlossenen geschlossenen Spalte usw.) von hier https://github.com/xamarin/Xamarin.Forms/projects/2#card -8921124 in die Nacht zusammengeführt werden?

Und wie verhält sich dieses Board? https://github.com/xamarin/Xamarin.Forms/projects/6

Danke!

ok habe die Pull-Requests durchgegangen und dies am Ende getan, damit es auf xamarin.forms funktioniert

private Xamarin.Forms.TabbedPage __bottomBarPage;
        private INavigationService __navigationService;
        private Page __currentPage;

        public BottomTabBarPageBuilder(INavigationService navigationService)
        {
            __navigationService = navigationService;
            __bottomBarPage = new Xamarin.Forms.TabbedPage();
            __bottomBarPage.BarTextColor = (Color)App.Current.Resources["tile2"]; // Setting Color of selected Text and Icon
            __bottomBarPage.On<Xamarin.Forms.PlatformConfiguration.Android>().SetToolbarPlacement(ToolbarPlacement.Bottom);
            // You can only define the color for the active icon if you set the Bottombar to fixed mode
            //__bottomBarPage.Navigation..FixedMode = true;
        }|

Vergiss den Code, aber der Hauptteil ist __bottomBarPage.On<Xamarin.Forms.PlatformConfiguration.Android>().SetToolbarPlacement(ToolbarPlacement.Bottom); Ist das der richtige Weg?

Ja das ist der richtige Weg. Es ist eine plattformspezifische Sache, die Sie nur einstellen müssen, bevor das Steuerelement gerendert wird.

hey, unterstützt dies den festen Modus?! Ich finde keine Möglichkeit es einzustellen

@maherzaidoune noch nicht.
Ich hatte ein wenig nach der ersten Implementierung gesucht, aber beschlossen, es für die nächste Version zu belassen.

Nur um es klar zu sagen, du redest davon, oder?
https://stackoverflow.com/questions/41649494/how-to-remove-icon-animation-for-bottom-navigation-view-in-android

Ich bin ein bisschen verwirrt. Wo sollen wir die ToolBarPlacement setzen?

`Namespace Test.Mobile.Views
{
[XamlCompilation(XamlCompilationOptions.Compile)]
öffentliche Teilklasse TestPage : Xamarin.Forms.TabbedPage
{

    public Test()
    {
        InitializeComponent();

        On<Xamarin.Forms.PlatformConfiguration.Android>().SetToolbarPlacement(ToolbarPlacement.Bottom);

    }`

So was?

@PureWeen Wie funktioniert On<Android>().SetElevation(); ? Ich habe versucht, es mit einem Float-Wert zu setzen, aber ich sehe keinen Effekt. Ich wollte etwas Schatten werfen, um zwischen Seiteninhalt und der unteren Leiste zu unterscheiden.

@niels9001 ja

Funktioniert das bei dir in Ordnung?

@PureWeen Nein, ich erhalte diesen Fehler in MainPage.xaml.g.cs (das ist eine MasterDetail-Ansicht und die TabbedPage befindet sich im Detailteil davon)

Unbehandelte Ausnahme:
System.TypeLoadException: Typ konnte nicht mit Token 0100008e aufgelöst werden (von typeref, class/assembly Xamarin.Forms.PlatformConfiguration.AndroidSpecific.ToolbarPlacement, Xamarin.Forms.Core, Version=2.0.0.0, Culture=neutral, PublicKeyToken=null) aufgetreten

Ich bin erstaunt. Brillant. @PureWeen Vielen Dank dafür.

@PureWeen Bitte lass es mich wissen, wenn ich bei der Badge-Implementierung helfen kann.

@niels9001 Dieser Fehler bedeutet normalerweise, dass etwas nicht mit den Bibliotheken synchron ist. Können Sie alle Ihre obj/bin-Ordner löschen und sicherstellen, dass überall dieselbe Version von Xam Forms installiert ist?

https://forums.xamarin.com/discussion/83410/could-not-resolve-type-with-token-01000012

@PureWeen Danke, das hat funktioniert :)!

Wie legen wir die Hintergrundfarbe des gesamten Balkens fest? Oder einen Schlagschatten aktivieren?

Wenn die untergeordnete Seite (Tab) der unteren TabbedPage eine NavigationPage ist, wird sie und ihr Inhalt (ContentPage mit ScrollView) unter der Tab-Leiste gerendert. (3.1-vor3)

Gute Arbeit!
Aber warum sind 5 Kinder das Maximum? Es stürzt ab, wenn ich versuche, mehr hinzuzufügen.

5 ist in Android als maximale Elementanzahl festgelegt.
siehe https://android.googlesource.com/platform/frameworks/support.git/+/master/design/src/android/support/design/internal/BottomNavigationMenu.java

Ach ich verstehe. Dankeschön!
Das ist traurig :/

Ja, ich bin hin und her gegangen, um dem Benutzer dabei am besten zu helfen. Wenn Sie sehen, dass es einen GetMaxCount gibt, den Sie aufrufen können, der im Moment nur eine 5 für die unteren Registerkarten und ein max int für die oberen Registerkarten zurückgibt. Ich werde sehen, ob ich eine nützlichere Fehlermeldung verbreiten kann :-)

@bdgza

Vielen Dank für die Berichterstattung. Ich habe dafür ein Problem erstellt
https://github.com/xamarin/Xamarin.Forms/issues/2993

@PureWeen BarBackgroundColor scheint nicht zu funktionieren, um die Hintergrundfarbe der Leiste zu ändern, wenn sie auf Android unten platziert wird?

@niels9001 hast du zufällig eine reproduktion dafür?

Ich habe getestet und bei mir funktioniert es

Hey, ist es möglich, diese Animation beim Seitenwechsel zu deaktivieren? Ich meine keine Symbolanimation, sondern diese Übergangsanimation

Bearbeiten: Ich möchte auch fragen, ob ich die neuesten Änderungen davon verwenden möchte, sollte ich Nightly Builds oder Prereleases verwenden? weil es so aussieht, als ob pre4 neuer ist als der aktuelle nighty Build

@dstarec ein neuer Nightly für 3.2 ist auf myget

Derzeit gibt es keine, aber Sie fragen danach
https://github.com/xamarin/Xamarin.Forms/issues/2948
rechts?

@PureWeen
ja, es scheint so zu sein

@PureWeen
Wie deaktiviere ich hier den Shift-Modus?

Ich habe James' Code hier von hier eingezogen: https://montemagno.com/remove-shifting-bottomnavigationview-android/

Ein benutzerdefinierter Renderer für Android wurde hinzugefügt, aber ich kann ihn nicht so nennen, da ich die ID der unteren Navigationsansicht nicht kenne:

var bottomNavigation = FindViewById(Resource.Id.bottom_navigation);
bottomNavigation.SetShiftMode(false, false);

BEARBEITEN:
Die einzige Möglichkeit, die ich bisher habe, besteht darin, die Ansichten in ViewGroup rekursiv zu durchlaufen, um die BottomNavigationView zu finden.

Gibt es eine Lösung zum Entfernen des Schaltmodus?

@LynoDesu @amrkamal1993 wird in einer kommenden Veröffentlichung ansprechen
https://github.com/xamarin/Xamarin.Forms/issues/3083

@amrkamal1993 Ich habe es mit einem benutzerdefinierten Renderer

@amrkamal1993 @maherzaidoune
Siehe hier:
https://gist.github.com/LynoDesu/64904b6d143892cf14a60a32798a36bb

@LynoDesu Wie kann ich den Schaltmodus deaktivieren? Ich habe deinen Code verwendet, aber es hat sich nichts geändert

Wie haben Sie es umgesetzt? Mit meinem Code müssen Sie das benutzerdefinierte Steuerelement BottomNavTabPage anstelle von TabbedPage verwenden:

<?xml version="1.0" encoding="utf-8" ?> <controls:BottomNavTabPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" xmlns:views="clr-namespace:MyProject.App.Views;assembly=MyProjects.App" xmlns:controls="clr-namespace:MyProject.App.Controls;assembly=MyProjects.App" x:Class="MyProject.App.Views.MainTabPage" Title=""> <views:NewsFeed></views:NewsFeed> <views:Rewards></views:Rewards> <views:Nominations></views:Nominations> <views:Notifications></views:Notifications> </controls:BottomNavTabPage>

Wie kann ich Badge-Text in der unteren Registerkarte hinzufügen?

@LynoDesu thx es funktioniert endlich !! ^_^

@nhdanh https://github.com/xabre/xamarin-forms-tab-badge
das kann dir helfen :)

@amrkamal1993 : Danke, aber ich probiere dieses Plugin aus. Es wird kein Abzeichentext hinzugefügt, wenn ich die untere Leiste verwende.

Der @nhdanh- Tab ist immer noch derselbe wie der obere, er sollte mit der neuen Funktion funktionieren .. untere Tab-Platzierung

@amrkamal1993 wenn ich auf On setze().SetToolbarPlacement(ToolbarPlacement.Bottom). Es wird kein Badge-Text gerendert. Ich entferne diese Einstellung unten. Es wird Badge-Text angezeigt

noch etwas zum Abzeichentext?

@LynoDesu Genial ! Ihre Lösung hat gerade dazu beigetragen, meinen Tag zu verschönern! Vielen Dank!

Ich habe versucht, Xamarin.Forms auf die neueste Version zu aktualisieren, und erhalte diese Fehlermeldung, wenn ich versuche, die ToolbarPlacement in meiner TabbedPage-Klasse festzulegen:

Unbehandelte Ausnahme:

System.TypeLoadException: Typ konnte mit Token 01000029 nicht aufgelöst werden (von typeref, class/assembly Xamarin.Forms.PlatformConfiguration.AndroidSpecific.ToolbarPlacement, Xamarin.Forms.Core, Version=2.0.0.0, Culture=neutral, PublicKeyToken=null)

Ich weiß nicht, was ich falsch mache, ich denke, dieser Fehler hängt mit den Versionen der Nuget-Pakete zusammen. Was kann ich tun, um es zu lösen?

@aalbendin das passiert, wenn etwas veraltet ist oder einfach nicht die richtigen Bibliotheken erstellt. Ich würde empfehlen, alle Ihre bin/obj-Ordner zu löschen und dann Ihr Projekt neu zu erstellen, und das sollte es beheben.

Ein Benutzer weiter oben hatte das gleiche Problem und das hat es für ihn gelöst

https://github.com/xamarin/Xamarin.Forms/issues/1675#issuecomment -395211876

ist dies in der stabilen Version 3.1.0.583944 verfügbar? Ich habe das On hinzugefügt

Versucht noch jemand, die TabbedNavigationBar auszublenden? Ich habe ein Problem auf Android, wenn ich VisibiltyStates.Gone auf BottomNavigationView setze, wird die Ansicht nicht vollständig geschlossen:

@15mgm15 dieses Problem hängt teilweise damit zusammen
https://github.com/xamarin/Xamarin.Forms/issues/3055

Der ViewPager, der den Inhalt anzeigt, berücksichtigt die Höhe der unteren Navigationsleiste, damit der Inhalt nicht dahinter versteckt wird. Damit dieser Inhalt wieder aufgenommen werden kann, muss der Viewpager neu gestaltet werden, aber im Moment gibt es nichts, das auf diese Sichtbarkeit und Änderung achtet

Was ist Ihr Anwendungsfall? Könnten Sie stattdessen eine modale Seite auf den Stapel verschieben, sodass sie nur den gesamten Bildschirm überlagert, anstatt zu versuchen, die untere Navigationsleiste auszublenden?

@PureWeen Danke für die Antwort! Leider unterbricht die Verwendung von modalen Seiten das Client-Design, sodass ich eine Lösung finden muss.

@15mgm15 Wenn Sie eine obere

@PureWeen Eigentlich ist das ein guter Punkt, lass es mich überprüfen und dich wissen lassen.

@PureWeen Mit der normalen Tav-Leiste funktioniert alles wie erwartet, die TabLayout der TabbedPageRenderer Belieben ausgeblendet oder angezeigt. Aber ich habe versucht, die Höhe in den Layoutparametern auf 0 zu setzen, und es hat tatsächlich funktioniert!

BottomNavigationView _bottomBar;
...
if (_extendedTabbedPage.BottomTabBarHidden) { _layoutParams.Height = 0; _bottomBar.LayoutParameters = _layoutParams; } else { _layoutParams.Height = _bottomBarHeight; _bottomBar.LayoutParameters = _layoutParams; }

Hey das ist gut zu hören!! Sobald https://github.com/xamarin/Xamarin.Forms/issues/3055 behoben ist, hoffe ich, dass dies einige der groben Teile ein wenig glätten wird

@cassionandi hast du immer noch

Wenn Sie keine Beschriftung und nur das Symbol festlegen, werden die Symbole nicht vertikal mittig ausgerichtet. Es sieht komisch aus, als ob ein Etikett fehlt.

Ist das erwartetes Verhalten? Wäre schön, wenn die Icons in der Mitte wären (wie die Outlook-App auf Android).

Ich glaube, mir fehlt etwas. Ich habe Xamarin Forms auf Version 3.1.0.583944 aktualisiert, aber ich erhalte zwei Fehler in der Zeile On<Xamarin.Forms.PlatformConfiguration.Android>().SetToolbarPlacement(ToolbarPlacement.Bottom);

Der Name ToolbarPlacement' existiert im aktuellen Kontext nicht

und

Fehler CS1061: 'IPtformElementConfiguration' enthält keine Definition für 'SetToolbarPlacement' und keine Erweiterungsmethode 'SetToolbarPlacement', die ein erstes Argument vom Typ 'IPlatformElementConfiguration . akzeptiert' konnte gefunden werden

irgendwelche Vorschläge?

@bverp

using Xamarin.Forms.PlatformConfiguration.AndroidSpecific

?

Wenn jemand das OnTabReselected- Ereignis Badges hinzufügen oder die BottomNavigationView ausblenden möchte , ist hier ein Beispiel:

https://gist.github.com/15mgm15/76914bf623e33676252864ac1898e7f9

@bverp Schließen Sie VS, löschen Sie den Ordner obj und bin und starten Sie das Projekt neu. Das sollte funktionieren, zumindest hat es bei mir geklappt.

@niels9001 das hat bei mir nicht funktioniert. @bverp hast du es zum
https://github.com/15mgm15/XamarinFormsBottomTabbedPage

Ich mache mich ein bisschen verrückt - hat jemand Zeit zu helfen?
Ich habe eine Reihe von Dingen ausprobiert, um untere Registerkarten in Android zu erhalten, einschließlich beider Optionen in diesem Link. Was auch immer ich tue, meine Lösung erkennt das Update nicht.
https://developer.xamarin.com/releases/xamarin-forms/xamarin-forms-3.1/3.1.0/
Ich habe Formulare Version 3.1.0.637273 (und habe auch die letzten 5 Releases/Prereleases ausprobiert).
Ich habe die bin/obj-Verzeichnisse gereinigt, erstellt, neu erstellt, gelöscht - ich kann dieses Update überhaupt nicht sehen, egal was ich tue.

Dies ist zum Beispiel mein aktuelles XAML

<TabbedPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:ProjName"
             x:Class="ProjName.MainPage"
    xmlns:android="clr-namespace:Xamarin.Forms.PlatformConfiguration.AndroidSpecific;assembly=Xamarin.Forms.Core"
            android:TabbedPage.ToolbarPlacement="Bottom"
            android:TabbedPage.BarItemColor="Black"
            android:TabbedPage.BarSelectedItemColor="Red">
    <local:LoginPage Title="Favorites" Icon="ic_favorites.png" />
    <local:LoginPage Title="Friends" Icon="ic_friends.png" />
    <local:LoginPage Title="Nearby" Icon="ic_nearby.png" />
    <local:LoginPage Title="Recents" Icon="ic_recents.png" />
    <local:RegistrationPage Title="Restaurants" Icon="ic_restaurants.png" />
</TabbedPage>

und das Ergebnis ist

Keine Eigenschaft, bindbare Eigenschaft oder Ereignis für "ToolbarPlacement" gefunden oder der Typ zwischen Wert und Eigenschaft stimmt nicht überein.

Ähnliches Problem programmgesteuert - es erkennt dieses Update einfach nicht.

Ich verwende Windows VS, verwende 8.1 Android zum Testen und es handelt sich um ein freigegebenes und nicht um ein .net-Projekt. Wenn mir jemand sagen kann, was ich vermisse, würde mich das sehr freuen.

@pureween?

@taramasalata bestätigt, dass alle Ihre Projekte die neueste Version von 3.1.0 verwenden. Etwas passt nicht zusammen.

Sie können mein Beispielprojekt auch hier überprüfen: https://github.com/davidortinau/TheLittleThingsPlayground

Ich habe auch bestätigt, dass ich die unteren Registerkarten eines freigegebenen Projekts ohne Fehler ausführen kann. Projekt:
App25.zip

@davidortinau Vielen Dank für

Ihre app25 wird nicht mit Fehler erstellt: Keine Eigenschaft, bindbare Eigenschaft oder Ereignis für "ToolbarPlacement" gefunden, oder der Typ zwischen Wert und Eigenschaft stimmt nicht überein.

Sind Sie auf Windows oder Mac?

Ich werde jetzt eine komplette Neuinstallation von VS versuchen, ich kann mir wirklich nicht vorstellen, was ich noch versuchen soll

Nö. Keine Freude mit der Neuinstallation mit App25. Das ist so frustrierend.
Fehler: Position 6:13. Keine Eigenschaft, bindbare Eigenschaft oder Ereignis für "ToolbarPlacement" gefunden oder der Typ zwischen Wert und Eigenschaft stimmt nicht überein.

Gibt es neben Xamarin.Forms noch Pakete, die ich dafür benötige?

Hmm irgendwas in deiner Build-Toolkette stimmt einfach nicht ganz @taramasalata
Vielleicht die Build-Ausgabe auf ausführlich setzen, um Nachrichten zu sehen? Überprüfen Sie Ihr Android-SDK, um sicherzustellen, dass Sie über die neuesten Build-Tools verfügen? Installieren Sie 4.7.1 sdk, um zu sehen, ob das behoben wird? Löschen Sie alle zwischengespeicherten Xamarin.forms-Nugets
c: Benutzer.nuget

Verwenden Sie etwas wie ILSpy oder dotpeek, um sich die DLLs in Ihrem Debug-Verzeichnis anzusehen und die Version zu überprüfen oder zu sehen, ob Sie diese Werte dort finden können?

Versuchen Sie es mit einem Codebasis-Ansatz anstelle von XAML?

Danke @pureween. Ich habe sowohl codebasiert als auch xaml ausprobiert. Ich habe auch versucht, VS neu zu installieren und auch die "Vorschau"-Version ausprobiert. Es ist wahrscheinlich, dass meine Deinstallation / Neuinstallation die .nuget-Dateien jedoch nicht gelöscht hat. Ich werde jetzt alle deine Vorschläge ausprobieren.

Nachdem ich alles Android neu installiert habe, funktioniert es jetzt. Vielen Dank an alle!

Kurze Frage: Liege ich richtig mit der Annahme, dass dies nur unter Android 8.1 läuft?

Hallo @taramasalata. Ich hatte ein ähnliches Problem und es wurde mit den folgenden Schritten behoben:

• Alle "bin" und "obj" Ordner meiner App löschen
• Klicken Sie auf "Saubere Lösung"
• Visual Studio neu starten
• Klicken Sie auf "Lösung neu erstellen".

@taramasalata YAY!!!! Es sollte auf jedem Gerät mit mindestens API 15 laufen

Beim Bauen habe ich gegen API 15, 19, 23, 27 getestet

Es hat wirklich Spaß gemacht, die Tönungsfarben an 19 und 15 zu arbeiten

@taramasalata ja, ich habe es zum using Xamarin.Forms.PlatformConfiguration.AndroidSpecific hinzugefügt und VS neu gestartet und die Lösung gereinigt habe.

Bei Verwendung auf Top funktioniert es mit 6 Kindern. Wann ist unten, nur 5.
Die App stürzt mit der Meldung "Java.Lang.IllegalArgumentException:"

@marcelinhovt ja, das ist eine Android-Einschränkung.

Die BottomNavBar in Android unterstützt nur 5 Elemente und wir können dies sowieso nicht umgehen

@PureWeen oh ... ich wusste es nicht. Danke ... Ich werde versuchen, etwas Rendering zu schreiben, um es zu erweitern

@marcelinhovt Ich meine also, dass die BottomNavigationBar in Android nativ nicht mehr als 5 Elemente unterstützt. Das ist keine Einschränkung durch unser Design

Gibt es eine Möglichkeit, die Höhe in der unteren Registerkartenleiste einzustellen?

Ich habe ein neues Problem in der Android-Beschränkung, obwohl ich nur 5 Tabs habe. App stürzt ab

@amrkamal1993 Wenn Sie ein Repro und eine neue Ausgabe erstellen könnten, können wir das Problem hoffentlich

@PureWeen danke PureWeen, die Ausnahme passiert, wenn ich ein Titelsymbol in der Symbolleiste hinzufüge, ich habe eine untere Registerkarte und eine Symbolleiste, ist das ein Problem, das nicht behandelt wird?

@amrkamal1993 der gesamte

Können Sie ein Repro oder einen Code posten, den ich testen kann, um zu sehen, ob ich den Absturz reproduzieren kann?