选择项目后,如何在数据模板中切换组件?

我的页面上有一个CollectionView,其中显示项目。我需要切换视觉指示器(复选标记),该项目已选中。复选标记应样式化,但是我还没有完成,我只尝试了BoxView。似乎没有什么可行的方法。

如果选择了项,然后尝试重新加载集合,我尝试在模型中设置一个标志,但这是一种非常糟糕的方法,它还会消耗大量资源。我只需要一个切换,该切换将出现在项目单击中,而消失在第二个项目中。

<Label Text="{Binding price,Converter={StaticResource Price}}" Style="{StaticResource PriceLabel}" Grid.Row="0" Grid.ColumnSpan="2"/>
<Label Text="{Binding name}" Style="{StaticResource CommonLabel}" VerticalTextAlignment="Center" Grid.Row="1" Grid.ColumnSpan="2"/>
<!-- Somehow change this-->
 <BoxView BackgroundColor="Blue" Grid.Row="0" Grid.Column="1"/>

不良结果应类似于this,但这是故事的另一部分

xuyihao 回答:选择项目后,如何在数据模板中切换组件?

我的理解

您正在尝试在选中某个项目时在其上显示一个指示器,并且一次只能选择一个项目

因此您需要在CollectionView中将SelectionMode设置为Single,以便一次只能选择一项

然后您可以使用OnCollectionViewSelectionChanged在所选项目上显示指标,并将其隐藏在上一个项目上

您可以在这里Xamarin-Collectionview-Selection

中找到更多详细信息 ,

根据您的描述,如果要让BoxView显示Collectionview项目的选中或未选中状态,建议您使用一个属性绑定BoxView IsVisible,我做一个示例,您可以看一下:

型号:

public class Model:ViewModelBase
{
    private string _DisplayName;

    public string DisplayName
    {
        get { return _DisplayName; }
        set
        {
            _DisplayName = value;
            RaisePropertyChanged("DisplayName");
        }
    }
    private bool _selected;

    public bool Selected
    {
        get { return _selected; }
        set
        {
            _selected = value;
            RaisePropertyChanged("Selected");
        }
    }

}

ViewModel:

public class collectionviewmodel:ViewModelBase
{
    public ObservableCollection<Model> Items { get; set; }


    public collectionviewmodel()
    {
        Items = new ObservableCollection<Model>();
        Items.Add(new Model() { DisplayName = "AAA",Selected = false });
        Items.Add(new Model() { DisplayName = "BBB",Selected = false });
        Items.Add(new Model() { DisplayName = "CCC",Selected = false });
        Items.Add(new Model() { DisplayName = "DDD",Selected = false });
        Items.Add(new Model() { DisplayName = "EEE",Selected = false });


    }       
}

ContentPage:

  <CollectionView
            x:Name="list1"
            ItemsLayout="VerticalList"
            ItemsSource="{Binding Items}"
            SelectionChanged="List1_SelectionChanged"
            SelectionMode="Single">

            <CollectionView.ItemTemplate>
                <DataTemplate>
                    <StackLayout Orientation="Horizontal">

                        <Label
                            HorizontalOptions="StartAndExpand"
                            Text="{Binding DisplayName}"
                            TextColor="Fuchsia" />
                        <BoxView
                            HorizontalOptions="End"
                            IsVisible="{Binding Selected}"
                            Color="Fuchsia" />
                    </StackLayout>

                </DataTemplate>
            </CollectionView.ItemTemplate>
        </CollectionView>

public Page23 ()
    {
        InitializeComponent ();
        this.BindingContext = new collectionviewmodel();
    }

这样的屏幕截图:

enter image description here

本文链接:https://www.f2er.com/3151424.html

大家都在问