Xamarin形成MVVM Stacklayout内容绑定

我是Xamarin和Xamarin表格的新手,我需要一些帮助。

我有一个StackLayout,我想从我的ViewModel动态添加项目。 问题是我似乎无法将StackLayout的内容绑定到我的ViewModel的StackLayout。

这是我视图中的xaml代码

 

我想要类似的东西

  

我已经在我的ViewModel中设置了StackLayout,就像这样

 public StackLayout MainStackLayout; 

您必须编写UI组件。

 using Xamarin.Forms; using System.Collections.Specialized; using System.ComponentModel; class BindableStackLayout : StackLayout { public static readonly BindableProperty ItemsProperty = BindableProperty.Create(nameof(Items), typeof(ObservableCollection), typeof(BindableStackLayout), null, propertyChanged: (b, o, n) => { (n as ObservableCollection).CollectionChanged += (coll, arg) => { switch (arg.Action) { case NotifyCollectionChangedAction.Add: foreach (var v in arg.NewItems) (b as BindableStackLayout).Children.Add((View)v); break; case NotifyCollectionChangedAction.Remove: foreach (var v in arg.NewItems) (b as BindableStackLayout).Children.Remove((View)v); break; case NotifyCollectionChangedAction.Move: //Do your stuff break; case NotifyCollectionChangedAction.Replace: //Do your stuff break; } }; }); public ObservableCollection Items { get { return (ObservableCollection)GetValue(ItemsProperty); } set { SetValue(ItemsProperty, value); } } } 

想拥有不同大小的stacklayout的可绑定itemsource我自定义contentview将帮助你实现它:)

 using System; using System.Collections; using System.Collections.Generic; using System.Linq; using System.Text; using Xamarin.Forms; /* this class will help you to have bindable children with different sizes for the stacklayout with scrollview in you xaml add        */ namespace Shop.UI.Controls { [ContentProperty("ItemContent")] public class SAStackLayout : ContentView { private ScrollView _scrollview; private StackLayout _stacklayout { get; set; } public SAStackLayout() { _stacklayout = new StackLayout(); _scrollview = new ScrollView() { Content = _stacklayout }; Content = _scrollview; } public static readonly BindableProperty ItemContentProperty = BindableProperty.Create("ItemContent", typeof(DataTemplate), typeof(SAStackLayout), default(ElementTemplate)); public DataTemplate ItemContent { get { return (DataTemplate)GetValue(ItemContentProperty); } set { SetValue(ItemContentProperty, value); } } private ScrollOrientation _scrollOrientation; public ScrollOrientation Orientation { get { return _scrollOrientation; } set { _scrollOrientation = value; _stacklayout.Orientation = value == ScrollOrientation.Horizontal ? StackOrientation.Horizontal : StackOrientation.Vertical; _scrollview.Orientation = value; } } public static readonly BindableProperty ItemsSourceProperty = BindableProperty.Create("ItemsSource", typeof(IEnumerable), typeof(SAStackLayout), default(IEnumerable), propertyChanged: GetEnumerator); public IEnumerable ItemsSource { get { return (IEnumerable)GetValue(ItemsSourceProperty); } set { SetValue(ItemsSourceProperty, value); } } private static void GetEnumerator(BindableObject bindable, object oldValue, object newValue) { foreach (object child in (newValue as IEnumerable)) { View view = (View)(bindable as SAStackLayout).ItemContent.CreateContent(); view.BindingContext = child; (bindable as SAStackLayout)._stacklayout.Children.Add(view); } } } } 

从这里下载源代码