Share via

Customize ToolbarItem style in Xamarin.Forms

Alessio Camaroto 81 Reputation points
2021-12-16T21:56:20.543+00:00

I want to customize ToolbarItem style in my Xamarin.Forms app. In particular, I want to change background and text color in floating menù window, this is my ContentPage.ToolbarItems.

<ContentPage.ToolbarItems>
<ToolbarItem Text="...." Command="{Binding StartCommand}" CommandParameter="{Binding .}" Order="Secondary"/>
<ToolbarItem Text="...." Command="{Binding StopCommand}" CommandParameter="{Binding .}" Order="Secondary"/>
<ContentPage.ToolbarItems>

Is there a simply way to do it ? I found some solutions but they don't work for me (maybe I do something wrong).

Thanks
Alessio

Developer technologies | .NET | Xamarin
0 comments

Answer accepted by question author

Anonymous
2021-12-17T03:15:42.897+00:00

Hello,​

Welcome to our Microsoft Q&A platform!

Please open your the styles.xml file in the values folder. Change your MainTheme style like following code. I change the text color and background color for ToolbarItem. 

   <?xml version="1.0" encoding="utf-8" ?>  
   <resources>  
     
     <style name="MainTheme" parent="MainTheme.Base">  
       <!-- As of Xamarin.Forms 4.6 the theme has moved into the Forms binary -->  
       <!-- If you want to override anything you can do that here. -->  
       <!-- Underneath are a couple of entries to get you started. -->  
     
       <!-- Set theme colors from https://aka.ms/material-colors -->  
       <!-- colorPrimary is used for the default action bar background -->  
       <!--<item name="colorPrimary">#2196F3</item>-->  
       <!-- colorPrimaryDark is used for the status bar -->  
       <!--<item name="colorPrimaryDark">#1976D2</item>-->  
       <!-- colorAccent is used as the default value for colorControlActivated  
            which is used to tint widgets -->  
       <!--<item name="colorAccent">#FF4081</item>-->  
     
     
     <!--textcolor-->  
   <item name="android:itemTextAppearance">@style/myCustomMenuTextAppearance</item>  
     
     <!--background color-->  
     <item name="android:itemBackground">#0011ff</item>  
     </style>  
   <style name="myCustomMenuTextAppearance" parent="@android:style/TextAppearance.Widget.IconMenu.Item">  
   <item name="android:textColor">#ff0080</item>  
   </style>  
   </resources>

Best Regards,

Leon Lu

If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

Was this answer helpful?

0 additional answers

Sort by: Most helpful
Most helpful Newest Oldest

Your answer

Answers can be marked as 'Accepted' by the question author and 'Recommended' by moderators, which helps users know the answer solved the author's problem.