[Enhancement] FontImageSource defaults and style

[ChaseFlorell]

Summary

FontImageSource is amazing! Well done team for the implementation.

Now that we're in it and using it, I'd like to propose that there be the ability to set the FontFamily and Color defaults and also make it styleable.

note: i do recognize that making it styleable might negate the need for the default statics, but I thought it might be nice akin to Color.SetAccent(Color accent);

API Changes

public class FontImageSource : ImageSource, IStyleElement
{
    public static readonly BindableProperty StyleProperty = BindableProperty.Create(nameof (Style), typeof (Style), typeof (FontImageSource), (object) null, BindingMode.OneWay, (BindableProperty.ValidateValueDelegate) null, (BindableProperty.BindingPropertyChangedDelegate) ((bindable, oldvalue, newvalue) => ((FontImageSource) bindable)._mergedStyle.Style = (IStyle) newvalue), (BindableProperty.BindingPropertyChangingDelegate) null, (BindableProperty.CoerceValueDelegate) null, (BindableProperty.CreateDefaultValueDelegate) null);

    /// <summary>Gets or sets the Style to apply to the FontImageSource.</summary>
    /// <value>To be added.</value>
    /// <remarks>To be added.</remarks>
    public Style Style
    {
      get => (Style) this.GetValue(FontImageSource.StyleProperty);
      set => this.SetValue(FontImageSource.StyleProperty, (object) value);
    }

    public static void SetDefaultFontFamily(string fontFamily)
    {
        DefaultFontFamily = fontFamily;
    }

    public static void SetDefaultColor(Color color)
    {
        DefaultColor = color;
    }
}

Intended Use Case

Styling would make it far simpler to make reusable font images without having to define them one for each style.

Static default methods will make it so that we only have to define FontFamily or (less important) Color once at startup and we can use that FontFamily as the default throughout the app.

[SkyeHoefling]

I love this! I am finding myself using the same fonts over and over again making my markup verbose. Creating a default font would be very useful.

Could we add the following properties to be defaults as well?

• FontFamily (already called out)
• Size
• Color

If we make everything have a default except Glyph and you are using the Markup Extension referenced your markup could be simplified to this:

<ImageButton Source="{FontImage Glyph={StaticResource SmileFace}}" />

or even easier

<ImageButton Source="{FontImage {StaticResource SmileFace}}" />

[ChaseFlorell]

absolutely, we use statics for our glyphs, so it would look like this.

<ImageButton Source="{FontImage {x:Static xaml:Icons.SmileFace}}" />

I'd love to see both of these approved. I'm happy to contribute.

[koddek]

Would also be nice to be able to use the StyleClass property on FontImageSource.

<FontImageSource StyleClass="TrashIcon" />

[JohnGalt1717]

Right now this is really bad because I have to do this on every single fonticonsource:

That's highly not fun.

[aherrick]

why can't we add a style to FontImageSource in 2021? 😭

[CannoliSquid]

Do we know if this will eventually be released? I know MAUI is coming soon and there's likely a lot of higher priority features and fixes being worked on, but being able to globally address FontImageSource Style would really make my life easier for something I'm working on.

[acaliaro]

why can't we add a style to FontImageSource in 2021? 😭

almost 2022

[AdamMarciniec]

Just ran into this shortcoming. So our app has 2 accent colors used here and there throughout the app. I have to allow customers to pick 2 light mode and 2 dark mode accent colors. Since they are dynamic I can't use AppThemeBinding and instead have to create a light Style and a dark Style for every element in our app that uses accent colors. Not ideal but ok. We have a bunch of icons that use the accent colors. Just images with a FontImageSource but I can't use my Style trick to set the color of the icon on the FontImageSource which is just ducky. In case it helps anyone, the way I'm getting around this is to do a sort of dummy converter.

<Image.Source> <FontImageSource FontFamily="{StaticResource faFontFamily}" Glyph="{Binding TypeGlyph}" Color="{Binding TypeGlyph, Converter={StaticResource Accent1Converter}}" Size="38"/> </Image.Source>

public class Accent1Converter : IValueConverter
	{
		public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
		{
			OSAppTheme currentTheme = Application.Current.RequestedTheme;
			if (currentTheme == OSAppTheme.Dark)
			{
				return App.AccentColor1Dark;
			}
			else
			{
				return App.AccentColor1Light;
			}
		}

		public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
		{
			return value;
		}
	}

[StepKie]

We are still waiting for this in MAUI. I've tried searching the dotnet/maui repo for this enhancement, but did not find anything. Should this issue be duplicated/reproduced in dotnet/maui to bring this back on the radar?

[jfversluis]

We are still waiting for this in MAUI. I've tried searching the dotnet/maui repo for this enhancement, but did not find anything. Should this issue be duplicated/reproduced in dotnet/maui to bring this back on the radar?

Yes please!

[jfversluis]

Thanks for this suggestion! As Xamarin.Forms is now in maintenance mode, this will not happen anymore for Xamarin.Forms. We're only adding bugfixes and stability fixes.

If this is still important to you, make sure to check the .NET MAUI repo and see if it's already on the roadmap. If not, feel free to open a discussion to discuss a change first or open an issue with a detailed feature request. Thanks!

[StepKie]

We are still waiting for this in MAUI. I've tried searching the dotnet/maui repo for this enhancement, but did not find anything. Should this issue be duplicated/reproduced in dotnet/maui to bring this back on the radar?

Yes please!

dotnet/maui#13474

[KannanKrish]

I would like to set the FontImageSource color, font family in global control styling in resource dictionary.

<Style TargetType="FontImageSource">
    <Setter Property="Color" Value="{StaticResource SecondaryTextColor}" />
    <Setter Property="FontFamily" Value="{StaticResource FontSolid}" />
</Style>

But not working.

[freezersharp]

I would like to set the FontImageSource color, font family in global control styling in resource dictionary.

<Style TargetType="FontImageSource">
    <Setter Property="Color" Value="{StaticResource SecondaryTextColor}" />
    <Setter Property="FontFamily" Value="{StaticResource FontSolid}" />
</Style>

But not working.

Me too.