shuhelohelo’s blog

Xamarin.Forms多めです.

Xamarin.FormsのShellでページごとにNavigationBarやTabBarの色を変える.

f:id:shuhelohelo:20200624021119g:plain

全部↓の公式のサンプルを見たら良かった.

github.com

以下のようにShellContent毎にStyleを指定している.

    <FlyoutItem Route="animals"
                Title="Animals"
                FlyoutDisplayOptions="AsMultipleItems">
        <Tab Title="Domestic"
             Route="domestic"
             Icon="paw.png">
            <ShellContent Route="cats"
                          Style="{StaticResource DomesticShell}"
                          Title="Cats"
                          Icon="cat.png"
                          ContentTemplate="{DataTemplate views:CatsPage}" />
            <ShellContent Route="dogs"
                          Style="{StaticResource DomesticShell}"
                          Title="Dogs"
                          Icon="dog.png"
                          ContentTemplate="{DataTemplate views:DogsPage}" />
        </Tab>

そのスタイルの中身はこんな感じ.

        <Style x:Key="DomesticShell"
               TargetType="Element"
               BasedOn="{StaticResource BaseStyle}">
            <Setter Property="Shell.BackgroundColor"
                    Value="#039BE6" />
        </Style>

これで色が変わる.

Xamlだけで簡潔するのは素晴らしい.