Forum Xamarin.Forms

Announcement:

The Xamarin Forums have officially moved to the new Microsoft Q&A experience. Microsoft Q&A is the home for technical questions and answers at across all products at Microsoft now including Xamarin!

To create new threads and ask questions head over to Microsoft Q&A for .NET and get involved today.

How to add font awesome icon in toolbar items?

sagarsagar Member ✭✭✭
edited April 2019 in Xamarin.Forms

Hi, I am working on xamarin forms where I am trying to add font awesome icon in ToolbarItem

  <ContentPage.ToolbarItems>
        <ToolbarItem Text="&#xf03d;" Clicked="Logout_Clicked" />
        <OnPlatform x:TypeArguments="x:String"
                                Android="fa-solid-900.ttf#fa-solid" 
                                iOS="Font Awesome 5 Free" />
    </ContentPage.ToolbarItems>

It is throwing following error
System.ArrayTypeMismatchException: Attempted to access an element as a type incompatible with the array

Instead of in ToolbarItem if I use in inside page icon is binding without any problem. What could be the issue? If this is not a proper way then please help me out how to add icons?

Best Answer

  • LandLuLandLu Member, Xamarin Team Xamurai
    Accepted Answer

    You have to implement it on each platform for changing the toolbar item's font, refer to this: https://forums.xamarin.com/discussion/79463/how-to-change-font-size-for-toolbaritem
    I also recommend you to use TitleView to show the navigation bar item:

    <NavigationPage.TitleView>
        <StackLayout Orientation="Horizontal">
            <Button HorizontalOptions="EndAndExpand" Text="&#xf03d;">
                <Button.FontFamily>
                    <OnPlatform x:TypeArguments="x:String">
                        <On Platform="iOS" Value="Font Awesome 5 Free" />
                        <On Platform="Android" Value="fa-solid-900.ttf#fa-solid" />
                    </OnPlatform>
                </Button.FontFamily>
            </Button>
        </StackLayout>
    </NavigationPage.TitleView>
    

Answers

  • LandLuLandLu Member, Xamarin Team Xamurai
    Accepted Answer

    You have to implement it on each platform for changing the toolbar item's font, refer to this: https://forums.xamarin.com/discussion/79463/how-to-change-font-size-for-toolbaritem
    I also recommend you to use TitleView to show the navigation bar item:

    <NavigationPage.TitleView>
        <StackLayout Orientation="Horizontal">
            <Button HorizontalOptions="EndAndExpand" Text="&#xf03d;">
                <Button.FontFamily>
                    <OnPlatform x:TypeArguments="x:String">
                        <On Platform="iOS" Value="Font Awesome 5 Free" />
                        <On Platform="Android" Value="fa-solid-900.ttf#fa-solid" />
                    </OnPlatform>
                </Button.FontFamily>
            </Button>
        </StackLayout>
    </NavigationPage.TitleView>
    
Sign In or Register to comment.