Xamarin ContentPage.ToolbarItems移到页面底部

Question

下面是我的代码，我想要做的是将工具栏移动到网格之后的页面底部

<ContentPage.ToolbarItems>
    <ToolbarItem Icon="heart.png" Command="{Binding GotoWishlistCommand}"/>
    <ToolbarItem Icon="shoppingcart.png"
                 Command="{Binding GotoCartCommand}"/>
</ContentPage.ToolbarItems>
<ContentPage.Resources>
    <ResourceDictionary>
        <converter:SelectedToColorConverter x:Key="cnvInvert"/>
    </ResourceDictionary>
</ContentPage.Resources>

Answer 1

不幸的是，默认情况下，ToolbarItem被设计在页面顶部。

如果想把ToolbarItem移动到页面的底部，这可以通过自定义的view.You来完成，它可以创建一个StackLayout，并且它包含了像ToolbarItem这样的按钮在it.In的基础上添加，StackLayout可以设置在GridLayout下面.Then这看起来像是页面底部的一个ToolbarItem。

示例代码如下：

<StackLayout>
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="20" />
                <RowDefinition Height="20" />
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*" />
                <ColumnDefinition Width="*" />
            </Grid.ColumnDefinitions>
            <Label Text="Top Left" Grid.Row="0" Grid.Column="0" />
            <Label Text="Top Right" Grid.Row="0" Grid.Column="1" />
            <Label Text="Bottom Left" Grid.Row="1" Grid.Column="0" />
            <Label Text="Bottom Right" Grid.Row="1" Grid.Column="1" />
        </Grid>

        <StackLayout BackgroundColor="BlueViolet" x:Name="CustomToolBarItem" Orientation="Horizontal" HorizontalOptions="EndAndExpand" WidthRequest="1000">
            <ImageButton Source="heart.png" Command="{Binding GotoWishlistCommand}" HorizontalOptions="End" VerticalOptions="Center"/>
            <ImageButton Source="shoppingcart.png" Command="{Binding GotoCartCommand}" HorizontalOptions="End" VerticalOptions="Center"/>
        </StackLayout>
</StackLayout>

​

​

Answer 2

如果你想把android放在最下面，就加上TabbedPage this这一行。对于iOS，这是默认设置。

xmlns:android="clr-namespace:Xamarin.Forms.PlatformConfiguration.AndroidSpecific;assembly=Xamarin.Forms.Core"
android:TabbedPage.ToolbarPlacement="Bottom"

最后，您的页面将如下所示：

<?xml version="1.0" encoding="utf-8" ?>
<TabbedPage
  x:Class="SampleApp.MainPage"
  xmlns="http://xamarin.com/schemas/2014/forms"
  xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
  xmlns:android="clr-namespace:Xamarin.Forms.PlatformConfiguration.AndroidSpecific;assembly=Xamarin.Forms.Core"
  xmlns:views="clr-namespace:SampleApp"
  android:TabbedPage.ToolbarPlacement="Bottom">
  <TabbedPage.Children>
    <NavigationPage
      Title="Browse"
      BackgroundColor="White"
      Icon="tab_feed.png">
      <x:Arguments>
        <views:ItemsPage />
      </x:Arguments>
    </NavigationPage>
    <NavigationPage
      Title="About"
      BackgroundColor="White"
      Icon="tab_about.png">
      <x:Arguments>
        <views:AboutPage />
      </x:Arguments>
    </NavigationPage>
  </TabbedPage.Children>
</TabbedPage>