Xamarin.forms: [Bug] Color of FontImageSource dynamic resource is useless

Created on 28 Jul 2019 · 12Comments · Source: xamarin/Xamarin.Forms

app.cs:

<Color x:Key="fontImageSourceDarkColorx">#8C8C8C</Color>
<Color x:Key="fontImageSourceLightColorx">#747474</Color>

somepage.cs:

<Image BackgroundColor="{DynamicResource fontImageSourceColorx}">
                        <Image.Source>
                            <FontImageSource Color="{DynamicResource fontImageSourceColorx}" Glyph="&#xf004;" FontFamily="{OnPlatform iOS=Font Awesome 5 Free,Android=Font-Awesome/5.9.0/Font Awesome 5 Free-Regular-400.otf#Font Awesome 5 Free}" Size="44" />
                        </Image.Source>
                    </Image>

change command:

        private void TestSwitch()
        {            
            if (Application.Current.Resources.Keys.Contains("fontImageSourceColorx") == false)
            {
                Application.Current.Resources["fontImageSourceColorx"] = Application.Current.Resources["fontImageSourceLightColorx"];
            }
            else if (Application.Current.Resources["fontImageSourceColorx"] == Application.Current.Resources["fontImageSourceLightColorx"])
            {
                Application.Current.Resources["fontImageSourceColorx"] = Application.Current.Resources["fontImageSourceDarkColorx"];
            }
            else if (Application.Current.Resources["fontImageSourceColorx"] == Application.Current.Resources["fontImageSourceDarkColorx"])
            {
                Application.Current.Resources["fontImageSourceColorx"] = Application.Current.Resources["fontImageSourceLightColorx"];
            }
        }

result:
backgroundcolor of image is fine;
color of FontImageSource is no luck;

current solution is use binding.

5 in-progress bug

Source

jingliancui

👍7

Most helpful comment

@jingliancui This should be resolved in 4.4.0. The first prerelease version should be available in about two weeks. Thanks!

samhouts on 21 Oct 2019

👍2

All 12 comments

@jingliancui Can you please attach a small project that demonstrates this issue? Thanks!

samhouts on 30 Jul 2019

FontSample.zip
@samhouts Sample had been uploaded.

1.run code

Repeated click the button for check the image's background color and the font image's color.
3.background color of image will be changed
4.color of font image will not be changed

jingliancui on 30 Jul 2019

I have a similar issue where the FontImageSource Color property won't respond to dynamic resource change.

Doesn't change

             <Image
                Grid.Column="2"
                HeightRequest="44"
                HorizontalOptions="Center"
                VerticalOptions="Center"
                WidthRequest="44">
                <Image.Source>
                    <FontImageSource
                        FontFamily="{StaticResource MaterialFontFamily}"
                        Glyph="{x:Static fonticons:IconFont.Car}"
                        **Color="{DynamicResource onPrimarySurfaceColor}"**
                        Size="44" />
                </Image.Source>
            </Image>

Changes Properly

            <Label
                FontFamily="{DynamicResource MaterialFontFamily}"
                Text="{x:Static fonticons:IconFont.Car}"
                TextColor="{DynamicResource onPrimarySurfaceColor}"/>

Theme Switcher

        public static void ChangeTheme(int themeId) {
            var mergedDictionaries = Application.Current.Resources.MergedDictionaries;
            if (mergedDictionaries != null) {
                mergedDictionaries.Clear();

                switch (themeId)
                {
                    case 0:
                        mergedDictionaries.Add(new Theme.LightTheme());
                        break;
                    case 1:
                        mergedDictionaries.Add(new Theme.DarkTheme());
                        break;
                    default:
                        mergedDictionaries.Add(new Theme.LightTheme());
                        break;
                }
            }
        }

chris-ux on 31 Jul 2019

I have a similar behaviour and an additional problem.

Using the markup extension in 3 diffent ways, the first one works like expected, but does not change the color of the Font icon. The second one, does work like expected to, but as it uses a StaticResource, it does not change the color once I replace the Applications theme and colors.

The third one is giving me this error:

_"error : Position 95:13. No property, bindable property, or event found for 'FontFamily', or mismatching type between value and property."_

This may be caused by that both are markup extensions - either DynamicResource and FontImageSource.

xaml:

x:Name="TestFontImageSourceToolbarItem"
Order="Primary"
Priority="5"
Text="FontIcon">

FontFamily = "{x:DynamicResource IconFontFamily}"
Glyph="{x:Static styles:MaterialIcons.ic_3d_rotation}"
Size="{x:DynamicResource H3FontSize}"
Color="{x:DynamicResource navigationTextColor}" />

x:Name="TestFontImageSourceToolbarItem2"
IconImageSource="{FontImage FontFamily={StaticResource IconFontFamily},
Glyph={x:Static styles:MaterialIcons.ic_3d_rotation},
Color={StaticResource primaryTextColor},
Size=24}"
Order="Primary"
Priority="5"
Text="FontIcon" />

x:Name="TestFontImageSourceToolbarItem3"
IconImageSource="{FontImage FontFamily={x:DynamicResource IconFontFamily},
Glyph={x:Static styles:MaterialIcons.ic_3d_rotation},
Color={x:DynamicResource primaryTextColor},
Size=24}"
Order="Primary"
Priority="5"
Text="FontIcon" />

MichaelStgt on 5 Sep 2019

@samhouts hi,samhouts,can you tell me about which version will fix this issue?
Now I have to use binding and pub/sub to control the global color of the fountimagesource

jingliancui on 15 Oct 2019

ImageSource isn't properly Parented