[Gallery][Wasm/Skia.Gtk/iOS/Android]TabBar- Home Icon is missing and for Android/iOS displaying incorrectly.

[sakshi173]

Current behavior

Expected behavior

Home Icon should be present.

How to reproduce it (as minimally and precisely as possible)

1. Open Uno Gallery APP
2. Click Burger Menu on the left top right.
3. Click "TabBar" from the "Toolkit" list.
4. Observe that Home Icon is missing and for iOS displaying incorrectly.

Workaround

No response

Works on UWP/WinUI

None

Environment

No response

NuGet package version(s)

No response

Affected platforms

WebAssembly, iOS, Skia (GTK on Linux/macOS/Windows)

IDE

No response

IDE version

No response

Relevant plugins

No response

Anything else we need to know?

No response

[sakshi173]

@kazo0, This issue is still present on all platform for the canaries build, please look into this issue.

[rajamatt]

Hi @agneszitte @kazo0, I can only repro this issue on the Uno.Gallery app. The Uno.Toolkit sample app uses a SymbolIcon, whereas the Uno.Gallery app uses a FontIcon to display the Home icon.

Uno.Gallery (this one doesn't appear):

<utu:TabBarItem Content="HOME">
    <utu:TabBarItem.Icon>
        <FontIcon Glyph="&#xE80F;" />
         </utu:TabBarItem.Icon>
</utu:TabBarItem>           

Uno.Toolkit (this one appears):

<utu:TabBarItem Content="HOME">
    <utu:TabBarItem.Icon>
        <SymbolIcon Symbol="Home" />
    </utu:TabBarItem.Icon>
</utu:TabBarItem>           

When I change the Glyph reference for the Home icon (E80F) to a different icon (ex: the support icon E8F2), it appears on all platforms. I found this related issue which contains other issues concerning the Home icon more specifically : Support for Segoe fonts #3011 Any ideas for a proposed fix? Should I change the FontIcon to a SymbolIcon in the Uno.Gallery repo so it's consistent with the Toolkit? What do you think?

[kazo0]

@rajamatt

I believe this is because we are still using the uno-fluentui-assets.ttf file instead of the symbol fonts coming from https://github.com/unoplatform/uno.fonts in Gallery. We should migrate over to use the Uno.Fonts.Fluent nuget package instead of this

See here for instructions on updating to the fonts package, let me know if you have questions

GitHub

GitHub - unoplatform/uno.fonts: Uno Platform Fonts

Uno Platform Fonts. Contribute to unoplatform/uno.fonts development by creating an account on GitHub.

[kazo0]

@rajamatt i added and assigned to you a new issue for this here: https://github.com/unoplatform/Uno.Gallery/issues/729

As a separate issue, we should also be moving to use the same Fonts package for Roboto: https://github.com/unoplatform/Uno.Gallery/issues/728

[rajamatt]

@kazo0 I updated all the heads with the latest stable uno-fluentui-assets.ttf and Fonts.css like in the instructions. Do I have to change something else or is updating the files enough? After cleaning the build and rebuilding, this home icon issue still persists.

Should I commit my code and test all platforms anyways for https://github.com/unoplatform/Uno.Gallery/issues/729 to be able to have it reviewed and closed?

[kazo0]

@rajamatt

Ah I just re-read the usage instructions and I realize I pointed to the wrong thing :) what I wanted to do was actually delete all of the custom uno-fluentui-assets.ttf and Fonts.css stuff from the Gallery app and just use the new Uno.Fonts.Fluent nuget package instead, it should do all the work for us now and we should no longer need those .ttf files nor the contents of Font.css that deal with the uno fluent ui asset fonts

I would have thought what you did would have worked too, but either way we should update to the latest way of doing Fluent Assets fonts using the new NuGet package. If the issues still persists after this then it means we are missing that font glyph in our Uno.Fonts.Fluent package.

[rajamatt]

@kazo0 I removed all the fluentui-assets.ttf files, then installed Uno.Fonts.Fluent for all heads except UWP. Cleaned the app, rebuilded and the Home icon still doesn't display correctly for the platforms.

[kazo0]

@NVLudwig are we perhaps missing the home icon font glyph in the ttf file maybe?

[NVLudwig]

What's the Unicode you are missing? @kazo0 @rajamatt

[rajamatt]

@NVLudwig it seems to be &#xE80F (Home icon)

[NVLudwig]

Try using: E10F

[rajamatt]

@NVLudwig thanks! That's the one, using E10F makes the Home icon appear on all platforms now.

[rajamatt]

@kazo0 Are you able to transfer this issue to the Uno.Gallery repo so I can reference it in my PR?

[kazo0]

@rajamatt you should be able to just copy the URL to this issue and reference it in your PR and it should link properly