2017-02-13 4 views
0

Ich möchte ein Logo in der Mitte der Navigationsleiste wie folgt hinzuzufügen:Logo in der Mitte der Navigationsleiste hinzufügen?

<ContentPage.ToolbarItems> 
    <ToolbarItem Icon="logo.png" Activated="RefButtonClicked"></ToolbarItem> 
</ContentPage.ToolbarItems> 

Ich habe auch versucht dies:

var cancelItem = new ToolbarItem 
{ 
    Text = "Cancel", 
    Icon = "tabalilogo.png", 
    Order = ToolbarItemOrder.Secondary 
}; 

Alles, was ich auf der rechten Seite des Navigations das Logo versucht positioniert Bar. Wie kann ich es zentrieren?

+0

Ich denke, Ihre Frage für Android. Es scheint nicht möglich zu sein, es sei denn, Sie deaktivieren die Symbolleiste und erstellen eine benutzerdefinierte. Ich hatte ähnliche Anforderung und ich endete damit benutzerdefinierte Symbolleiste – batmaci

+0

@batmaci können Sie mir die Anweisung oder Referenz geben, weil ich nie eine benutzerdefinierte Render zuvor gemacht habe? –

+1

Ich meine nicht benutzerdefinierten Renderer, sondern benutzerdefinierte Symbolleiste. Ich gebe dir eine Antwort. – batmaci

Antwort

1

Ich bin mir nicht sicher, ob dies mit der vorhandenen Symbolleiste implementiert werden kann, aber ich hatte ähnliche Anforderungen und ich konnte nicht herausfinden, wie Sie die Symbolleiste xamarin forms auf einer Navigationsseite verwenden. Daher entschied ich mich, eine modale Seite zu verwenden, und ich deaktivierte die Navigationsseite im Code dahinter mit der unten stehenden Codezeile.

NavigationPage.SetHasNavigationBar(this, false); 

Ich bin mit XAML und ich erstellt ein benutzerdefiniertes Navigationssystem mit absolutelayout wie unten

<AbsoluteLayout x:Name="slToolbar" Grid.Row="0" > 
     <Button x:Name="Cancel" BackgroundColor="#ADD8E6" Image="cancel.png" Command="{Binding CancelClick}" AbsoluteLayout.LayoutFlags="PositionProportional"> 
      <AbsoluteLayout.LayoutBounds> 
      <OnPlatform x:TypeArguments="Rectangle" iOS="0, .5, 36, 36" Android="0, .5, 36, 36" WinPhone="0, .5, 50, 50" /> 
      </AbsoluteLayout.LayoutBounds> 
     </Button> 


     <StackLayout Orientation="Horizontal" AbsoluteLayout.LayoutFlags="PositionProportional"> 
      <AbsoluteLayout.LayoutBounds> 
      <OnPlatform x:TypeArguments="Rectangle" iOS="1,.5,110,50" Android="1,.5,50,36" WinPhone="1,.5,110,50" /> 
      </AbsoluteLayout.LayoutBounds> 


      <ContentView > 
      <OnPlatform x:TypeArguments="View"> 
       <OnPlatform.iOS> 
       <Button x:Name="NewIOS" BackgroundColor="#ADD8E6" Image="ic_add.png" Command="{Binding AddNew}" ></Button> 
       </OnPlatform.iOS> 
       <OnPlatform.WinPhone> 
       <Button x:Name="NewWP" BackgroundColor="#ADD8E6" Command="{Binding AddNew}" Image="ic_add.png"/> 
       </OnPlatform.WinPhone> 
      </OnPlatform> 
      </ContentView> 


      <Button x:Name="btnSave" BackgroundColor="#ADD8E6" Image="check.png" Command="{Binding SaveClick}" HorizontalOptions="End" ></Button> 
     </StackLayout> 
     </AbsoluteLayout> 

diesen Code wird so etwas wie unten produzieren. Ich habe die Symbole in den Ecken, aber sicherlich können sie überall platziert werden. Ich habe das Symbol "Abbrechen" anstelle der Schaltfläche "Zurück" verwendet. Natürlich müssen Sie in diesem Fall den Zurück-Button (Abbrechen-Button) selbst anklicken. screenshot unten ist von uwp application, aber auf android und ios bekomme ich ähnliche ergebnisse.

enter image description here

+0

ich habe herausgefunden, was Sie meinen, ich werde es versuchen –

+1

Erwarten Sie, wie dies geht funktioniert mit Tabbedpage? –

+0

@AhmedSayed Onn mein Android-Projekt, ich bevorzuge Seitenmenü, aber auf UWP verwende ich Tabbed-Seite und es sieht gut aus für mich. Ich denke nicht, dass dies anders als XF Standard-Symbolleiste ist. Stellen Sie sich anstelle von X-Taste auf der linken Seite, Sie haben Zurück-Taste als Pfeil. – batmaci

Verwandte Themen