Как показать изображение, когда пользователь нажимает на представление коллекции

Question

У меня есть вид коллекции с меткой и изображением. Я хочу, чтобы при нажатии на элементы была отмечена галочка (вместо поведения по умолчанию, которое заключается в изменении цвета фона).

С помощью приведенного ниже кода, когда пользователь нажимает на строку, цвет фона меняется на серый. Однако изображение с галочкой не отображается, хотя я определил установщик для изображения.

    <ContentPage.Resources>
            <ResourceDictionary>
                <Style TargetType="Grid">
                    <Setter Property="VisualStateManager.VisualStateGroups">
                        <VisualStateGroupList>
                            <VisualStateGroup x:Name="CommonStates">
                                <VisualState x:Name="Normal" />
                                <VisualState x:Name="Selected">
                                    <VisualState.Setters>
                                        <Setter Property="BackgroundColor" Value="LightGray" />
                                        <Setter x:DataType="Image" Property="Image.Source" Value="icon_check.png" />
                                    </VisualState.Setters>
                                </VisualState>
                            </VisualStateGroup>
                        </VisualStateGroupList>
                    </Setter>
                </Style>            
            </ResourceDictionary>
        </ContentPage.Resources>


    //

    <CollectionView 
                                    x:Name="collectionview_cadastronotificacao_tipoocorrencia"
                                    ItemsSource="{Binding TipoOcorrencia}" 

                                    SelectionMode="Multiple" 
                                    BackgroundColor="White" 
                                    HorizontalOptions="Center" 
                                    VerticalOptions="Center"
                                    SelectionChanged="CollectionView_SelectionChanged" >

                        <CollectionView.ItemTemplate>
                            <DataTemplate>
                                <Grid Padding="10" >

                                    <Grid.RowDefinitions>
                                        <RowDefinition Height="*" />                                    
                                    </Grid.RowDefinitions>

                                    <Grid.ColumnDefinitions>
                                        <ColumnDefinition Width="Auto" />
                                        <ColumnDefinition Width="Auto" />                                    
                                    </Grid.ColumnDefinitions>

                                    <Image 
                                       Grid.RowSpan="1"
                                       Grid.Column="2" />

                                    <Label Grid.Column="0"
                                           Text="{Binding Descricao}"
                                           FontAttributes="Bold" FontSize="Small"/>

                                </Grid>
                            </DataTemplate>
                        </CollectionView.ItemTemplate>
                    </CollectionView>
    ```

If I change `<Setter x:DataType="Image" Property="Image.Source"` to `<Setter x:DataType="Image" Property="Source"`, an `InvalidCastException` is thrown.

Answer 1

Вы можете сослаться на ответ, предоставленный моим коллегой:

создать CustomView :

public partial class CustomView : ContentView
 {
   public CustomView()
    {
    InitializeComponent();
    }

public string CustomImageSource
{
    set => SetValue(CustomImageSourceProperty, value);
    get => (string)GetValue(CustomImageSourceProperty);
}
public readonly static BindableProperty CustomImageSourceProperty = BindableProperty.Create(nameof(CustomImageSource), 
                                                                                        typeof(string), 
                                                                                        typeof(CustomView), 
                                                                                        defaultValue: string.Empty,
                                                                                        propertyChanged: (bindableObject, oldValue, newValue) =>
                                                                                        {
                                                                                            ((CustomView)bindableObject).MyImage.Source = ImageSource.FromFile((string)newValue);
                                                                                        });
}

int CustonView.xaml :

<ContentView.Content>
  <Grid Padding="10" >
    <Grid.RowDefinitions>
        <RowDefinition Height="*" />
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto" />
        <ColumnDefinition Width="Auto" />
    </Grid.ColumnDefinitions>

    <Image x:Name="MyImage" Grid.RowSpan="1" Grid.Column="2" />
    <Label Grid.Column="0" Text="{Binding Descricao}" FontAttributes="Bold" FontSize="Small"/>
  </Grid>
</ContentView.Content>

наконец измените ваш page.xaml:

<ContentPage.Resources>
 <ResourceDictionary>
    <Style TargetType="local:CustomView">
        <Setter Property="VisualStateManager.VisualStateGroups">
            <VisualStateGroupList>
                <VisualStateGroup x:Name="CommonStates">
                    <VisualState x:Name="Normal" />
                    <VisualState x:Name="Selected">
                        <VisualState.Setters>
                            <Setter Property="BackgroundColor" Value="LightGray" />
                            <Setter Property="CustomImageSource" Value="leftcircle.png" />
                        </VisualState.Setters>
                    </VisualState>
                </VisualStateGroup>
            </VisualStateGroupList>
        </Setter>
    </Style>
</ResourceDictionary>
</ContentPage.Resources>
<StackLayout>
<CollectionView x:Name="collectionview_cadastronotificacao_tipoocorrencia" 
                ItemsSource="{Binding TipoOcorrencia}"  
                SelectionMode="Multiple"  
                BackgroundColor="White"  
                HorizontalOptions="Center"  
                VerticalOptions="Center" 
                SelectionChanged="CollectionView_SelectionChanged" >

    <CollectionView.ItemTemplate>
        <DataTemplate>
            <local:CustomView/>
        </DataTemplate>
    </CollectionView.ItemTemplate>
</CollectionView>
</StackLayout>

и другой способ, как сказал zpouip, позволяет Image привязывать IsVisible свойство, вы должны добавить boolвведите свойство в вашу модель данных, когда вы выбираете, вы должны изменить значение добавленного свойства, тогда изображение будет отображаться