XAML .NET MAUI. Binding Image Source в зависимости от темы устройства
Есть CollectionView который выводит массив однотипных блоков на разметку. При изменение темы устройства необходимо изменять Image Source.
<Image x:Name="left_icon" Grid.Column="0" Source="{AppThemeBinding Light={Binding IconPrimaryDark}, Dark={Binding IconPrimary}}" WidthRequest="30" HeightRequest="30" />
Если вручную написать название файла изображения, то работает.
<Image x:Name="right_icon" Grid.Column="2" Source="{AppThemeBinding Light=right_arrow_primary_dark.svg, Dark=right_arrow_primary.svg}" WidthRequest="30" HeightRequest="30" />
XAML:
<CollectionView ItemsSource="{Binding UserProfileMenuValuesList}" SelectionMode="Single"
SelectionChangedCommand="{Binding NavigateToPageCommand}" SelectedItem="{Binding SelectedUserProfileMenu}">
<CollectionView.ItemsLayout>
<GridItemsLayout Span="1" Orientation="Vertical" />
</CollectionView.ItemsLayout>
<CollectionView.ItemTemplate>
<DataTemplate>
<Border BackgroundColor="Transparent" Stroke="{StaticResource PrimaryDark}" StrokeThickness="2" Margin="5" Padding="5">
<Border.StrokeShape >
<RoundRectangle CornerRadius="15" />
</Border.StrokeShape>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup Name="CommonStates">
<VisualState Name="Normal" />
<VisualState Name="Selected">
<VisualState.Setters>
<Setter Property="BackgroundColor" Value="{StaticResource PrimaryDark}" />
<Setter Property="Stroke" Value="{StaticResource PrimaryDark}" />
<Setter TargetName="left_icon" Property="Image.Source" Value="{Binding IconPrimary}" />
<Setter TargetName="text_label" Property="Span.TextColor" Value="{StaticResource Primary}" />
<Setter TargetName="right_icon" Property="Image.Source" Value="right_arrow_primary.svg" />
</VisualState.Setters>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Grid ColumnDefinitions="Auto,*,Auto" ColumnSpacing="5">
<Image x:Name="left_icon" Grid.Column="0" Source="{AppThemeBinding Light={Binding IconPrimaryDark}, Dark={Binding IconPrimary}}" WidthRequest="30" HeightRequest="30" />
<Label x:Name="text_label" Grid.Column="1" Text="{Binding Text}" TextColor="{StaticResource PrimaryDark}"
FontSize="20" FontFamily="MontserratBold" HorizontalTextAlignment="Start" VerticalOptions="Center" />
<Image x:Name="right_icon" Grid.Column="2" Source="{AppThemeBinding Light=right_arrow_primary_dark.svg, Dark=right_arrow_primary.svg}" WidthRequest="30" HeightRequest="30" />
</Grid>
</Border>
</DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>
C#:
public class UserProfileMenu
{
[JsonPropertyName("text")]
public string Text { get; set; } = string.Empty;
[JsonPropertyName("iconPrimaryDark")]
public string IconPrimaryDark { get; set; } = string.Empty;
[JsonPropertyName("iconPrimary")]
public string IconPrimary { get; set; } = string.Empty;
[JsonPropertyName("pageName")]
public string PageName { get; set; } = string.Empty;
}