问题描述
我在BindableLayout中有一个产品列表。 当我单击某些产品时，我想更改“活动”字段的值并“重新加载”列表print1。 有什么方法可以从xaml更改列表的值？ 最好的方法是什么？
MainPage.xaml.cs
public partial class MainPage : ContentPage
{
public List<ProductStatus> ProductList => getProducts();
public MainPage()
{
InitializeComponent();
this.BindingContext = this;
}
public List<ProductStatus> getProducts()
{
return new List<ProductStatus>
{
new ProductStatus { Id="P13",Name = "Product X",Active = false },new ProductStatus { Id="P17",Name = "Product Y",new ProductStatus { Id="P21",Name = "Product Z",Active = true },};
}
}
public class ProductStatus
{
public string Id { get; set; }
public string Name { get; set; }
public bool Active { get; set; }
}
}
MainPage.xaml
<StackLayout HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">
<StackLayout BindableLayout.ItemsSource="{Binding ProductList}">
<BindableLayout.ItemTemplate>
<DataTemplate>
<StackLayout Orientation="Horizontal" Spacing="1" Padding="20">
<StackLayout.Style>
<Style targettype="StackLayout">
<Style.Triggers>
<DataTrigger Binding="{Binding Active}" Value="true" targettype="StackLayout">
<Setter Property="BackgroundColor" Value="#f0f0f0"/>
</DataTrigger>
<DataTrigger Binding="{Binding Active}" Value="false" targettype="StackLayout">
<Setter Property="BackgroundColor" Value="Transparent"/>
</DataTrigger>
</Style.Triggers>
</Style>
</StackLayout.Style>
<Label Text="{Binding Name}"/>
<Label HorizontalOptions="EndAndExpand">
<Label.Style>
<Style targettype="Label">
<Style.Triggers>
<DataTrigger Binding="{Binding Active}" Value="true" targettype="Label">
<Setter Property="TextColor" Value="Green"/>
<Setter Property="Text" Value="A"/>
</DataTrigger>
<DataTrigger Binding="{Binding Active}" Value="false" targettype="Label">
<Setter Property="TextColor" Value="Red"/>
<Setter Property="Text" Value="I"/>
</DataTrigger>
</Style.Triggers>
</Style>
</Label.Style>
</Label>
</StackLayout>
</DataTemplate>
</BindableLayout.ItemTemplate>
</StackLayout>
<Button Text="Save"/>
</StackLayout>
解决方法
首先，如果要显示列表，最好使用ListView或CollectionView，这样会更方便。
如果您仍然想在此处使用BindableLayout，则可以在StackLayout中添加TapGestureRecognizer。然后让您的ProductStatus实现INotifyPropertyChanged接口（用于重新加载数据）
public partial class MainPage: ContentPage
{
public List<ProductStatus> ProductList => getProducts();
public ICommand TapCommand { get; set; }
public MainPage()
{
InitializeComponent();
TapCommand = new Command<ProductStatus>(OnTapCommand);
this.BindingContext = this;
}
private void OnTapCommand(ProductStatus obj)
{
var product = obj;
product.Active = !obj.Active;
}
public List<ProductStatus> getProducts()
{
return new List<ProductStatus>
{
new ProductStatus { Id="P13",Name = "Product X",Active = false },new ProductStatus { Id="P17",Name = "Product Y",new ProductStatus { Id="P21",Name = "Product Z",Active = true },};
}
}
public class ProductStatus :INotifyPropertyChanged
{
public string Id { get; set; }
public string Name { get; set; }
private bool active;
public bool Active {
set
{
active = value;
OnPropertyChanged("Active");
}
get
{
return active;
}
}
public event PropertyChangedEventHandler PropertyChanged;
protected void OnPropertyChanged([CallerMemberName] string propertyName = null)
{
PropertyChanged?.Invoke(this,new PropertyChangedEventArgs(propertyName));
}
}
在您的xaml中（将x:Name设置到您的内容页面，然后绑定其命令）：
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:d="http://xamarin.com/schemas/2014/forms/design"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
x:Name="root"
x:Class="EntryCa.MainPage">
<ContentPage.Content>
<StackLayout HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">
<StackLayout BindableLayout.ItemsSource="{Binding ProductList}">
<BindableLayout.ItemTemplate>
<DataTemplate>
<StackLayout Orientation="Horizontal" Spacing="1" Padding="20">
<StackLayout.GestureRecognizers>
<TapGestureRecognizer Command="{Binding Path=BindingContext.TapCommand,Source ={x:Reference root} }"
CommandParameter="{Binding .}"></TapGestureRecognizer>
</StackLayout.GestureRecognizers>
<StackLayout.Style>
<Style TargetType="StackLayout">
<Style.Triggers>
<DataTrigger Binding="{Binding Active}" Value="true" TargetType="StackLayout">
<Setter Property="BackgroundColor" Value="#f0f0f0"/>
</DataTrigger>
<DataTrigger Binding="{Binding Active}" Value="false" TargetType="StackLayout">
<Setter Property="BackgroundColor" Value="Transparent"/>
</DataTrigger>
</Style.Triggers>
</Style>
</StackLayout.Style>
<Label Text="{Binding Name}"/>
<Label HorizontalOptions="EndAndExpand">
<Label.Style>
<Style TargetType="Label">
<Style.Triggers>
<DataTrigger Binding="{Binding Active}" Value="true" TargetType="Label">
<Setter Property="TextColor" Value="Green"/>
<Setter Property="Text" Value="A"/>
</DataTrigger>
<DataTrigger Binding="{Binding Active}" Value="false" TargetType="Label">
<Setter Property="TextColor" Value="Red"/>
<Setter Property="Text" Value="I"/>
</DataTrigger>
</Style.Triggers>
</Style>
</Label.Style>
</Label>
</StackLayout>
</DataTemplate>
</BindableLayout.ItemTemplate>
</StackLayout>
<Button Text="Save"/>
</StackLayout>
</ContentPage.Content>
</ContentPage>
效果如下：
