How can I bind this Icon's Color to this Label Color? - xaml

Question

As you can see below, the FlyoutItem has an Icon and a Title.
<FlyoutItem Title="About" >
<FlyoutItem.Icon>
<FontImageSource FontFamily="MaterialDesignIconFont"
Glyph="{StaticResource InformationOutlineGlyph}"
Color="Green" />
</FlyoutItem.Icon>
<ShellContent Route="AboutPage" ContentTemplate="{DataTemplate local:AboutPage}" />
</FlyoutItem>
The Title Color changes automatically because of this Style:
<Style Class="FlyoutItemLayoutStyle" TargetType="Layout" ApplyToDerivedTypes="True">
<Setter Property="BackgroundColor" Value="LightBlue"></Setter>
<Setter Property="VisualStateManager.VisualStateGroups">
<VisualStateGroupList>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal">
<VisualState.Setters>
<Setter Property="BackgroundColor" Value="White" />
<Setter TargetName="FlyoutItemLabel" Property="Label.TextColor" Value="{StaticResource PrimaryColor}" />
</VisualState.Setters>
</VisualState>
<VisualState x:Name="Selected">
<VisualState.Setters>
<Setter Property="BackgroundColor" Value="{StaticResource PrimaryColor}" />
</VisualState.Setters>
</VisualState>
</VisualStateGroup>
</VisualStateGroupList>
</Setter>
</Style>
So the Label that is the Title changes color automatically when the FlyoutItem is selected. I need the Icon to do the same thing. I could use a trigger to set the FontImageSource but that comes with its own problems.
Given the TargetName "FlyoutItemLabel" from the above Style, is it possible to create a binding from the FontImageSource.Color to each FlyoutItem's "FlyoutItemLabel".Color? It would have to bind upward to the FlyoutItem ancestor, then downward to the <Label x:Name="FlyoutItemLabel" />, wouldn't it?

Answer 1

You could set the [ItemTemplate][1] of FlyoutItem as you want
<Shell.ItemTemplate>
<DataTemplate >
<Grid Style="{StaticResource FloutItemStyle}">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="0.2*" />
<ColumnDefinition Width="0.8*" />
</Grid.ColumnDefinitions>
<Image Source="{Binding xxx}"
Margin="5"
BackgroundColor="{Binding Source={x:Reference label} ,Path=BackgroundColor}"
HeightRequest="45" />
<Label Grid.Column="1"
x:Name="label"
BackgroundColor="Red"
Text="{Binding Title}"
FontAttributes="Italic"
VerticalTextAlignment="Center" />
</Grid>
</DataTemplate>
</Shell.ItemTemplate>