question

LucaPanella-6103 avatar image
0 Votes"
LucaPanella-6103 asked WenyanZhang-MSFT commented

AppShell TabBarTitleColor changes the title color but it doesn't change the icon color (Android only, works fine on iOS)

Hello,

I'm having trouble with the icon color of the AppShell TabBar on Android platform (it works fine on iOS).

I defined the following styles:

<Style TargetType="TabBar">
<Setter Property="Shell.TabBarBackgroundColor" Value="White" />
<Setter Property="Shell.TabBarForegroundColor" Value="Black"/>
<Setter Property="Shell.TabBarUnselectedColor" Value="Gray"/>
<Setter Property="Shell.TabBarTitleColor" Value="Red"/>
</Style>

The styles work on iOS but on Android only the title changes to red when the tab is selected but the icon remains gray. If I change the unselected color to Green, all the icons become green, including the one on the selected tab, while the title is still red. It seems that the Shell.TabBarTitleColor applies only to the text title but it should apply to the icon color too. The icons are simple png with alpha channel. The same icons work fine on iOS.

I'm using VS Mac 8.10.6 with Xamarin.Forms 5.0.0.2010. Any help will be appreciated.

Thanks.

dotnet-xamarin
· 1
5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

Usually, Xamarin.Forms Shell tabs can be styled by TabBarTitleColor. I can't reproduce your issue with the code you provided whatever I use the picture with alpha or not. Would you mind sharing the project to test?
In addition, Maybe you can have a try to use this demo to check if this issue still exists. You can also uninstall the app and clean the build to try again.


115382-image.png

115340-image.png

115346-image.png



1 Vote 1 ·
image.png (227.4 KiB)
image.png (225.0 KiB)
image.png (209.6 KiB)
LucaPanella-6103 avatar image
0 Votes"
LucaPanella-6103 answered WenyanZhang-MSFT commented

Hello,

I figure out what the problem is! It is caused by the Xam.Shell.Badge component that I'm using in the project. Removing the component solves the problem (https://github.com/galadril/Xam.Shell.Badge/issues/16)

Thanks again for the support.

· 1
5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

You are welcome. I’m so glad you solved the problem.

0 Votes 0 ·
LucaPanella-6103 avatar image
0 Votes"
LucaPanella-6103 answered

Hello,

I will check the demo project. I was thinking that the problem may be due to the icons I am using, some problem in the format of the images or something else. I'll let you know if I can figure out what the problem is.

Thanks.

5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.