绑定 ScrollView 内容答案

【问题标题】：Binding ScrollView Content绑定 ScrollView 内容
【发布时间】：2018-09-03 11:33:50
【问题描述】：

我想动态绑定 ViewModel 类的 ScrollView 内容。

我有 xaml 代码：

<ScrollView
   Grid.Column="1"
   Content="{Binding UserGrid}"
   HorizontalScrollBarVisibility="Never"
   IsEnabled="False"
   Orientation="Horizontal">
</ScrollView>

和 ViewModel 代码

class ViewModel : BaseViewModel{
    private Grid _userGrid { get; set; }
    public Grid UserGrid
    {
        get { return _userGrid; }
        set        
        {
            _userGrid = value;
            OnPropertyChanged();

        }
    }
    public override async Task InitAsync()
    {
        await Task.Factory.StartNew(() =>
        {
            _userGrid = new Grid
            {
                ColumnSpacing = 1,
                HorizontalOptions = LayoutOptions.FillAndExpand,
                VerticalOptions = LayoutOptions.FillAndExpand
            };
            _userGrid.RowDefinitions.Add(new RowDefinition { Height = new GridLength(GridHeightSize * 4) });
// and adding some content to This grid
         }
     }

当然，我已经在 View 类中初始化了 Binding 上下文

我的问题是是否可以使用此内容绑定动态绑定此内容。目前，我收到一个错误：

,, 未找到“内容”的属性、可绑定属性或事件，或者值和属性之间的类型不匹配”

如果它不是动态视图绑定的正确方式，那是什么？

【问题讨论】：

我觉得内容一定是Xamarin.Forms.View见：docs.microsoft.com/en-us/dotnet/api/…
我已将其更改为 Xamarin.Forms.View。仍然遇到同样的错误
噢，嗯……嗯，通常方法有点不同。您到底想在滚动视图中显示什么？
为什么不在ScrollView xaml 中创建一个嵌套的Grid 然后直接引用它？
@Stefan。它是更复杂视图的一部分：i.imgur.com/4t5LXDP.jpg。我已经在 xaml 和 cs 代码中创建了它，它应该根据用户或时间等参数动态创建。我想将它转换为 MVVM 只是为了知道如何去做。这就是为什么我要绑定这个视图，因为它的所有依赖项都应该从服务中获取或在 ViewModel 中计算

标签： c# xamarin xamarin.forms

【解决方案1】：

数据绑定的整个想法是将 UI 与数据分离。因此，数据模型不应包含任何 UI 元素。

你可以做什么：

创建一个新模型类，其中包含您要在该滚动视图中显示的所有数据，为了进一步参考，我将其称为“CardViewModel”。
将 List CardViewData 的属性添加到您的 ViewModel
从您的 ViewModel 中删除 InitAsync 任务
确保两个视图模型都实现了 INotifyPropertyChanged 接口

现在在使用您的 ViewModel 的视图中，重载构造函数以接受您的视图模型作为参数。在构造函数中，您遍历 CardViewModel 列表中的项目并为每个项目创建一个 Grid。

public TimeTableView(ViewModel model)
{
    foreach (CardViewModel cardModel in CardViewData)
    {
        CardView view = new CardView(cardModel);
        Container.Children.Add(view);
    }
}

请注意，“Container”是包含卡片视图的元素的占位符。

实际上，我建议您实现一个自定义视图，其中包含所有元素，以便显示 CardViewModel 的数据，以便您可以将自定义视图的绑定上下文设置为您的 cardview 模型：

public class CardView : Grid
{
    public CardView(CardViewModel model)
    {
        BindingContext = model;
    }
}

另外一个 ScrollView 只能包含一个元素，所以你不能简单地将一堆元素扔进去。您可能需要在其中放置一个网格，然后将 CardViews 添加到该网格中。

【讨论】：