Home > Blockchain >  Using icons instead of PNG in Xamarin Forms Tabs
Using icons instead of PNG in Xamarin Forms Tabs

Time:04-15

How do I use icons e.g. Material Icons instead of PNG iamges in my tabs in a Xamarin Forms app with Shell?

The following is how I defined tabs for home screen in my Xamarin Forms app:

<FlyoutItem Title="Home">
   <FlyoutItem.Icon>
      <FontImageSource
         FontFamily="MISHRP"
         Glyph="{StaticResource HomeIcon}"
         Color="White" />
   </FlyoutItem.Icon>
   <Tab Title="Dashboard" Icon="icon_dashboard.png">
      <ShellContent Route="Dashboard" ContentTemplate="{DataTemplate views:Dashboard}" />
   </Tab>
   <Tab Title="My Feed" Icon="{StaticResource Feed}">
      <ShellContent Route="MyFeed" ContentTemplate="{DataTemplate views:MyFeed}"/>
   </Tab>
</FlyoutItem>

As you can see in above code, in the first tab item (Dashboard), I use a PNG image and that displays fine in my app.

In the second TAB item (My Feed), I tried using an icon I defined in my App.xaml page but that doesn't show at all.

How do I use icons in tabs in a Shell Xamarin Forms app?

CodePudding user response:

I think you use something like this , from the MyCoffeeApp

https://github.com/jamesmontemagno/MyCoffeeApp/blob/master/MyCoffeeApp/MyCoffeeApp/AppShell.xaml

  <Tab.Icon>
            <FontImageSource FontFamily="FAS"
                         Color="{AppThemeBinding 
                                Dark=White, 
                                Light={StaticResource SystemGray5Dark}}"
                         Glyph="{StaticResource IconCoffee}"/>
        </Tab.Icon>
  • Related