dotnet / dotnet/maui

Unable to bind `Glyph` property in `FontImageSource` of `ToolbarItem`

Open
#10,186 27 comments 3 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

area-fonts area-xaml delighter platform/android s/triaged s/verified t/bug
Dominant language
C#
Stars
23.3k
Forks
2k
Avg merge
1d 14h
Merged PRs (30d)
296

Description

Description

Original discussion: https://forums.xamarin.com/discussion/180852/why-glyph-property-in-fontimagesource-doesnt-bind
Xamarin issue: https://github.com/xamarin/Xamarin.Forms/issues/12700

This code doesn't produce any errors, but Glyph is always empty:

<ContentPage.ToolbarItems>
    <ToolbarItem IconImageSource="{FontImageSource Glyph={Binding MyIcon}, FontFamily=MaterialDesignIcons}" />
</ContentPage.ToolbarItems>

Static binding works fine. Code above also works if it's added via Hot Reload (but after proper app reload icon is gone again)

image

Steps to Reproduce
  1. Add ToolbarItem to your page
  2. SpecifyIconImageSource to it as FontImageSource with binded Glyph
Link to public reproduction project repository

Remove the converter and start the app:
https://github.com/maxkoshevoi/NureTimetable/blob/5f67cadbb78bc3c37df4985adf8c4ce3a936b4a0/NureTimetable/UI/Views/Timetable/TimetablePage.xaml#L20

Version with bug

6.0.486 (current)

Last version that worked well

Unknown/Other

Affected platforms

Android

Affected platform versions

All (tested on 13)

Did you find any workaround?

Thanks Saskia.

<ToolbarItem IconImageSource="{Binding MyIcon, Converter={converters:ToolbarIconValueConverter}}" />
public class ToolbarIconValueConverter : IValueConverter, IMarkupExtension
{
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
        return new FontImageSource
        {
            FontFamily = (OnPlatform<string>)Application.Current.Resources["MaterialFontFamily"],
            Glyph = (string)value
        };
    }

    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
    {
        throw new NotImplementedException();
    }

    public object ProvideValue(IServiceProvider serviceProvider)
    {
        return this;
    }
}
Relevant log output

No response

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the linked reproduction project and the ToolbarItem declaration in TimetablePage.xaml around line 20. Run the Android app after removing the converter, then compare the direct FontImageSource binding with the converter workaround. Done means the bound Glyph displays after a normal app reload without the converter.

Written by the indexing model from the issue text.

Assessment

Tech stack
android, csharp
Domain
mobile
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.