Xamarin Forms Collection 视图 ItemsSource Binding 未更新 UI
Xamarin Forms Collection view ItemsSource Binding not updating the UI
Xamarin.Forms 如果我在后面的代码中设置绑定,4.0 集合视图 ItemsSource 绑定无法按预期工作。这些项目基于源集合的初始值显示,但是 UI 在更新源集合时不会更新。如果我在 xaml.
中设置绑定,同样有效
后面的代码:
public MainPage()
{
this.InitializeComponent();
this.BindingContext = this.mainViewModel = new MainViewModel();
CollectionView courseCollectionView = new CollectionView
{
ItemSizingStrategy = ItemSizingStrategy.MeasureFirstItem,
ItemTemplate = new DataTemplate(typeof(ItemView))
};
courseCollectionView.SetBinding(CollectionView.ItemsSourceProperty,
new Binding() { Source = this.mainViewModel.CountryNames, Mode =
BindingMode.TwoWay });
courseCollectionView.ItemsLayout = new GridItemsLayout(4,
ItemsLayoutOrientation.Vertical);
this.CoursesStack.Children.Clear();
this.CoursesStack.Children.Add(courseCollectionView);
}
用于 ItemsSource 绑定的视图模型 属性:
ObservableCollection<Country> countryNames;
public ObservableCollection<Country> CountryNames
{
get => this.countryNames;
set
{
this.countryNames = value;
RaisePropertyChanged("CountryNames");
}
}
预期:应根据对绑定到 ItemsSource 属性.
的 ObsevableCollection(add/delete 个集合中的项目)所做的更改更新视图
实际:视图未随 ObservableCollection 的更改而更新。
在这种情况下,尝试从 INotifyPropertyChanged 扩展 MainPage 而不是 RaisePropertyChanged("CountryNames") in set 属性,使用 OnPropertyChanged()
我认为您的绑定有误。尝试:
courseCollectionView.SetBinding(CollectionView.ItemsSourceProperty, nameof(mainViewModel.CountryNames));
您需要指定 Path
(mainViewModel.CountryNames
) 而不是 Source
关于在使用 CollectionView 时更新 UI,我做了一个示例,您可以看一下:
public partial class MainPage : ContentPage
{
public mainvidemodel viewmodel { get; set; }
public MainPage()
{
InitializeComponent();
viewmodel = new mainvidemodel();
this.BindingContext = viewmodel;
CollectionView collectionView = new CollectionView();
collectionView.SetBinding(ItemsView.ItemsSourceProperty, "countries");
collectionView.ItemTemplate = new DataTemplate(() =>
{
StackLayout stacklayout = new StackLayout();
Label label1 = new Label();
label1.SetBinding(Label.TextProperty,"Id");
Label label2 = new Label();
label2.SetBinding(Label.TextProperty, "Name");
Label label3 = new Label();
label3.SetBinding(Label.TextProperty, "caption");
stacklayout.Children.Add(label1);
stacklayout.Children.Add(label2);
stacklayout.Children.Add(label3);
return stacklayout;
});
Button btn = new Button() { Text = "btn", WidthRequest = 200, HeightRequest = 50 };
btn.Clicked += Btn_Clicked;
stacklayout1.Children.Add(collectionView);
stacklayout1.Children.Add(btn);
}
private void Btn_Clicked(object sender, EventArgs e)
{
viewmodel.countries.Add(new Country() { Id = 8, Name = "country8", caption = "caption 8" });
}
}
public class mainvidemodel
{
public ObservableCollection<Country> countries { get; set; }
public mainvidemodel()
{
countries = new ObservableCollection<Country>()
{
new Country(){Id=1,Name="country1",caption="caption 1"},
new Country(){Id=2,Name="country2",caption="caption 2"},
new Country(){Id=3,Name="country3",caption="caption 3"},
new Country(){Id=4,Name="country4",caption="caption 4"},
new Country(){Id=5,Name="country5",caption="caption 5"},
new Country(){Id=6,Name="country6",caption="caption 6"},
new Country(){Id=7,Name="country7",caption="caption 7"},
};
}
}
public class Country
{
public int Id { get; set; }
public string Name { get; set; }
public string caption { get; set; }
}
Xamarin.Forms 如果我在后面的代码中设置绑定,4.0 集合视图 ItemsSource 绑定无法按预期工作。这些项目基于源集合的初始值显示,但是 UI 在更新源集合时不会更新。如果我在 xaml.
中设置绑定,同样有效后面的代码:
public MainPage()
{
this.InitializeComponent();
this.BindingContext = this.mainViewModel = new MainViewModel();
CollectionView courseCollectionView = new CollectionView
{
ItemSizingStrategy = ItemSizingStrategy.MeasureFirstItem,
ItemTemplate = new DataTemplate(typeof(ItemView))
};
courseCollectionView.SetBinding(CollectionView.ItemsSourceProperty,
new Binding() { Source = this.mainViewModel.CountryNames, Mode =
BindingMode.TwoWay });
courseCollectionView.ItemsLayout = new GridItemsLayout(4,
ItemsLayoutOrientation.Vertical);
this.CoursesStack.Children.Clear();
this.CoursesStack.Children.Add(courseCollectionView);
}
用于 ItemsSource 绑定的视图模型 属性:
ObservableCollection<Country> countryNames;
public ObservableCollection<Country> CountryNames
{
get => this.countryNames;
set
{
this.countryNames = value;
RaisePropertyChanged("CountryNames");
}
}
预期:应根据对绑定到 ItemsSource 属性.
的 ObsevableCollection(add/delete 个集合中的项目)所做的更改更新视图实际:视图未随 ObservableCollection 的更改而更新。
在这种情况下,尝试从 INotifyPropertyChanged 扩展 MainPage 而不是 RaisePropertyChanged("CountryNames") in set 属性,使用 OnPropertyChanged()
我认为您的绑定有误。尝试:
courseCollectionView.SetBinding(CollectionView.ItemsSourceProperty, nameof(mainViewModel.CountryNames));
您需要指定 Path
(mainViewModel.CountryNames
) 而不是 Source
关于在使用 CollectionView 时更新 UI,我做了一个示例,您可以看一下:
public partial class MainPage : ContentPage
{
public mainvidemodel viewmodel { get; set; }
public MainPage()
{
InitializeComponent();
viewmodel = new mainvidemodel();
this.BindingContext = viewmodel;
CollectionView collectionView = new CollectionView();
collectionView.SetBinding(ItemsView.ItemsSourceProperty, "countries");
collectionView.ItemTemplate = new DataTemplate(() =>
{
StackLayout stacklayout = new StackLayout();
Label label1 = new Label();
label1.SetBinding(Label.TextProperty,"Id");
Label label2 = new Label();
label2.SetBinding(Label.TextProperty, "Name");
Label label3 = new Label();
label3.SetBinding(Label.TextProperty, "caption");
stacklayout.Children.Add(label1);
stacklayout.Children.Add(label2);
stacklayout.Children.Add(label3);
return stacklayout;
});
Button btn = new Button() { Text = "btn", WidthRequest = 200, HeightRequest = 50 };
btn.Clicked += Btn_Clicked;
stacklayout1.Children.Add(collectionView);
stacklayout1.Children.Add(btn);
}
private void Btn_Clicked(object sender, EventArgs e)
{
viewmodel.countries.Add(new Country() { Id = 8, Name = "country8", caption = "caption 8" });
}
}
public class mainvidemodel
{
public ObservableCollection<Country> countries { get; set; }
public mainvidemodel()
{
countries = new ObservableCollection<Country>()
{
new Country(){Id=1,Name="country1",caption="caption 1"},
new Country(){Id=2,Name="country2",caption="caption 2"},
new Country(){Id=3,Name="country3",caption="caption 3"},
new Country(){Id=4,Name="country4",caption="caption 4"},
new Country(){Id=5,Name="country5",caption="caption 5"},
new Country(){Id=6,Name="country6",caption="caption 6"},
new Country(){Id=7,Name="country7",caption="caption 7"},
};
}
}
public class Country
{
public int Id { get; set; }
public string Name { get; set; }
public string caption { get; set; }
}