首页 文章

将ViewModel内容绑定到Stacklayout

提问于
浏览
1

我试图将我的viewmodel中的内容绑定到我的视图 .

我正在使用一个代码片段来创建一个自定义StackLayout,我们可以在其中绑定项目 .

但是,我没有做这项工作,我看到我的用户界面没有更新 . 我不确定究竟要绑定到“项目” . 我目前正在使用按钮绑定一个observablecollection,但它没有显示 .

这是自定义stacklayout:

using Xamarin.Forms;

using System.Collections.Specialized;
using System.ComponentModel;

class CustomStackLayout : StackLayout
{
    public static readonly BindableProperty ItemsProperty =
        BindableProperty.Create(nameof(Items), typeof(ObservableCollection<View>), typeof(CustomStackLayout), null,
            propertyChanged: (b, o, n) =>
            {
                (n as ObservableCollection<View>).CollectionChanged += (coll, arg) =>
                {
                    switch (arg.Action)
                    {
                        case NotifyCollectionChangedAction.Add:
                            foreach (var v in arg.NewItems)
                                (b as CustomStackLayout).Children.Add((View)v);
                            break;
                        case NotifyCollectionChangedAction.Remove:
                            foreach (var v in arg.NewItems)
                                (b as CustomStackLayout).Children.Remove((View)v);
                            break;
                        case NotifyCollectionChangedAction.Move:
                            //Do your stuff
                            break;
                        case NotifyCollectionChangedAction.Replace:
                            //Do your stuff
                            break;
                    }
                };
            });


    public ObservableCollection<View> Items
    {
        get { return (ObservableCollection<View>)GetValue(ItemsProperty); }
        set { SetValue(ItemsProperty, value); }
    }
}

这就是我收集内容的方式 .

public MainPageViewModel()
    {
       CategoryName = new ObservableCollection<Button>();
    }

    ObservableCollection<Button> _categoryName;
    public ObservableCollection<Button> CategoryName
    {
        get
        {
            return this._categoryName;
        }
        set
        {
            if (_categoryName != value)
            {
                this._categoryName = value;
                RaisePropertyChanged("CategoryName");
            }
        }
    }

    public event PropertyChangedEventHandler PropertyChanged;

    public void RaisePropertyChanged(string propName)
    {
        if (PropertyChanged != null)
        {
            PropertyChanged(this, new PropertyChangedEventArgs(propName));
        }
    }

然后我在虚空中收集新数据:

private async void LoadCategories()
    {

        var GetCategories = await Data.Categories();
        CategoryName = new ObservableCollection<Button>();

        foreach (var Category in GetCategories["results"])
        {
            var CategoryButton = new Button();
            CategoryButton.Text = Category["CategoryName"].ToString().ToUpper();
            CategoryName.Add(CategoryButton);
        }
    }

xaml:

<ContentPage x:Name="ParentView">

     <ScrollView x:Name = "CategoriesScrollView">
          <controls:CustomStackLayout Orientation="Horizontal" Spacing="20" Items = "{Binding BindingContext.CategoryName, Source={x:Reference ParentView}}" />
     </ScrollView>

视图:

public MainPage()
{
    InitializeComponent();
    BindingContext = new MainPageViewModel();
}

1 回答

  • 1

    一些事情,

    这堂课应该公开......

    class BindableStackLayout : StackLayout
    {..
    

    public class BindableStackLayout : StackLayout
    {..
    

    <ScrollView x:Name = "CategoriesScrollView">
          <controls:CustomStackLayout Orientation="Horizontal" Spacing="20" Items = "{Binding BindingContext.CategoryName, Source={x:Reference ParentView}}" />
     </ScrollView>
    

    <ScrollView x:Name = "CategoriesScrollView">
          <controls:BindableStackLayout  Orientation="Horizontal" Spacing="20" Items = "{Binding CategoryName}" />
     </ScrollView>
    

    您将类定义为BindableStacklayout,并在Xaml上引用CustomStackLayout .

    您不需要添加x:refe,因为页面的bindingcontext设置为您想要的viewModel .

    希望能解决这个问题吗?

相关问题