dotnet/maui

Font Icons in Shell Tabs not showing in iOS

ReamsIT-Darren opened this issue · 5 comments

Description

Font Icons are not showing in iOS builds in Shell Tabs but they are working in Android - this is the same issue as reported in #4774

Steps to Reproduce

Create MAUI app
Add relevant icon ttf file to app
Create shell, add icons to tabs via tabbar
Run on iOS local device

Link to public reproduction project repository

No response

Version with bug

8.0.3 GA

Is this a regression from previous behavior?

Yes, this used to work in Xamarin.Forms

Last version that worked well

6.0

Affected platforms

iOS

Affected platform versions

No response

Did you find any workaround?

Setting the FontImageSource Colour works but then it would need updating on selection to have selected and unselected different colours

Relevant log output

No response

I think this is a duplicate of #12250 and there's a workaround for this issue on #12250 (comment)

The workaround on #12250 does not seem to work when using Tabs on a Flyout on shell.

Verified this issue with Visual Studio 17.10.0 Preview 1. Can repro on .NET 8.0 iOS platform.

This issue seems to be fixed - tested on iOS with 8.0.20-nightly.10316 and the following code:

<Shell.Resources>
		<ResourceDictionary>
			<Style x:Key="BaseStyle" TargetType="Element">
				<Setter Property="Shell.BackgroundColor" Value="{StaticResource PrimaryColor}" />
				<Setter Property="Shell.ForegroundColor" Value="Yellow" />
				<Setter Property="Shell.TitleColor" Value="Black" />
				<Setter Property="Shell.DisabledColor" Value="Pink" />
				<Setter Property="Shell.UnselectedColor" Value="Purple" />
				<Setter Property="Shell.TabBarBackgroundColor" Value="{StaticResource PrimaryColor}" />
				<Setter Property="Shell.TabBarForegroundColor" Value="Blue"/>
				<Setter Property="Shell.TabBarUnselectedColor" Value="Green"/>
				<Setter Property="Shell.TabBarTitleColor" Value="Red"/>
			</Style>
		</ResourceDictionary>
	</Shell.Resources>
	
	<TabBar>
		<ShellContent Title="About" ContentTemplate="{DataTemplate local:MainPage}">
			<ShellContent.Icon>
                <FontImageSource FontFamily="FA" 
                                 Glyph="&#xe922;"
				 Color="Blue"
                                 Size="25"/>
            </ShellContent.Icon>

		</ShellContent>
		<ShellContent Title="Items"  ContentTemplate="{DataTemplate local:MainPage}">
			<ShellContent.Icon>
                <FontImageSource FontFamily="FA"
				 Color="red"
                                 Glyph="&#xe922;" 
                                 Size="25"/>
            </ShellContent.Icon>
		</ShellContent>
	</TabBar>

I have tested it now with the latest version and the issue seems to be fixed. Thanks