We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Strange Behaviour on SelectedForeground


I'm currently experiencing a strange behaviour with the SfTabControl.
I have declared colors in my global Style Resources which I use for all my UI Elements:
        <Color x:Key="FGColor">#eaac2a</Color>
        <Color x:Key="DisabledFG">#666666</Color>
        <StaticResource x:Key="UIForeground" ResourceKey="FGColor"/>
        <StaticResource x:Key="DisabledForeground" ResourceKey="DisabledFG"/>

My TabControl is implemented this way:
<tab:SfTabControl x:Name="TabControl" SelectedIndex="{Binding SelectedTabIndex, Mode=TwoWay}" EnableSwipeGestures="True">
<tab:SfTabItem Header="Local" Foreground="{StaticResource DisabledForeground}" SelectedForeground="{StaticResource UIForeground}">
<tab:SfTabItem Header="Community" Foreground="{StaticResource DisabledForeground}" SelectedForeground="{StaticResource UIForeground}">

In my preview the StaticResource is used properly, however in runtime, the SelectedForeground is ignored (all other UIElements like the Page Header, the Navigation Pane etc. still uses the UIForeground, even the normal 'non-selected' Foreground Property is working with its static resource).
See the following image for visualization:

3 Replies

JP Jagadeesan Pichaimuthu Syncfusion Team May 20, 2019 12:28 PM UTC

Hi Alexander 
Thanks for contacting Syncfusion Support. 
We have checked your query ”Selection foreground is not updated while using static resource” and we are able to reproduce it from our side. In SfTabItem, SelectedForeground is the brush type property and you need to bind the brush type resource to update the selected foreground or you can use converter to convert color into brush. We have prepared the workaround to fix the reported behavior, In which we have used converter to convert color into brush and bind to the selected foreground property of the SfTabitem and now the selection foreground is working properly with static resource. Please find the code snippet and sample for same. 
Code Snippet: 
<tab:SfTabItem Header="Community" Foreground="{StaticResource DisabledForeground}" 
                       SelectedForeground="{Binding Source={StaticResource UIForeground}, Converter={StaticResource BrushConverter}}"> 
Please try this above solution and let us know if it is helpful. 

AL Alexander May 21, 2019 09:04 AM UTC


thank you for your answer, this worked.
However I'm a bit confused, that using the StaticResource on Foreground (which is inherited from Windows' Control and also a Brush) works, but not on SelectedForeground.
Does Control have an internal converter, so that Binding a Color to it is allowed?


JP Jagadeesan Pichaimuthu Syncfusion Team May 22, 2019 12:00 PM UTC

Hi Alexander,  
Thanks for your update.  
As stated earlier, Foreground is the framework property and it works as expected. But the SelectedForeground property is custom control property, for this you need to manually bind the brush type resource instead binding the color type resource. We could observe same behavior in other customer controls also. So please use suggested work around to overcome this behavior. 

Live Chat Icon For mobile
Up arrow icon