0

一个非常简单的绑定如何用于 ListView 中的 Label?

我似乎已经花了几个小时,但无法弄清楚。

标签的数据绑定有什么问题?

因为显示了三行,这意味着 Observable 集合View Model已被绑定。

我是否过度使用 x:DataType 是否真的需要简单的网格绑定?

在此处输入图像描述

XAML 文件

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage
    x:Class="Poc.ListViewGrouping.Views.LvDemo"
    xmlns="http://xamarin.com/schemas/2014/forms"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:local="clr-namespace:Poc.ListViewGrouping.ViewModels"
    xmlns:model="clr-namespace:Poc.ListViewGrouping.Models">
    <ContentPage.Content>
        <StackLayout>
            <Label
                HorizontalOptions="CenterAndExpand"
                Text="Welcome to Abhijeet's Page Of List View!"
                VerticalOptions="CenterAndExpand" />
        </StackLayout>
    </ContentPage.Content>
    <ContentPage.ToolbarItems>
        <ToolbarItem Command="{Binding AddItemCommand}" Text="Add Milestone" />
    </ContentPage.ToolbarItems>
    <RefreshView x:DataType="local:Lv1Vm">
        <StackLayout BackgroundColor="Orange">
            <ListView
                x:Name="lv1"
                BackgroundColor="Green"
                ItemsSource="{Binding DS}">
                <ListView.ItemTemplate>
                    <DataTemplate x:DataType="local:Lv1Vm">
                        <ViewCell>
                            <Frame BackgroundColor="Navy">
                                <StackLayout
                                    Padding="10"
                                    x:DataType="model:LvModel"
                                    BackgroundColor="Yellow"
                                    HeightRequest="30">
                                    <!--  Does not bind at all  -->
                                    <Label BackgroundColor="Red"
                                           Text="{Binding Name}" />
                                </StackLayout>
                            </Frame>
                        </ViewCell>
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>
        </StackLayout>
    </RefreshView>
</ContentPage>

代码隐藏文件

using Poc.ListViewGrouping.ViewModels;
using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

using Xamarin.Forms;
using Xamarin.Forms.Markup;
using Xamarin.Forms.Xaml;
namespace Poc.ListViewGrouping.Views
{
    [XamlCompilation(XamlCompilationOptions.Compile)]
    public partial class LvDemo : ContentPage
    {
        public Lv1Vm _viewModel;

        public LvDemo()
        {
            BindingContext = _viewModel = new Lv1Vm();

            InitializeComponent();
        }
    }
}

查看模型

using Poc.ListViewGrouping.Models;
using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.Text;

namespace Poc.ListViewGrouping.ViewModels
{
    public class Lv1Vm : BaseViewModel
    {
        public ObservableCollection<LvModel> DS => new ObservableCollection<LvModel>()
        {
            new LvModel{Id = 1, Name = "Hello" },
            new LvModel{Id = 2, Name="Hi"},
            new LvModel{Id = 3, Name="Good Going"},
        };

        public Lv1Vm()
        {
            Title = "Lv1";
        }
    }
}

模型

public class LvModel
{
    public string Name { get; set; }
    public int Id { get; set; }

}
4

2 回答 2

1

实际上,您的绑定是正确的,它没有显示的原因是因为 ListView 中的所有行默认具有相同的高度。它不再计算您的子项的高度。

你可以尝试设置HasUnevenRows="True"

<ListView
            HasUnevenRows="True"
            x:Name="lv1"
            BackgroundColor="Green"
            ItemsSource="{Binding DS}">
       <ListView.ItemTemplate>
              <DataTemplate x:DataType="local:Lv1Vm">
                  <ViewCell>
                      <Frame BackgroundColor="Navy">
                          <StackLayout
                                Padding="10"
                                x:DataType="model:LvModel"
                                BackgroundColor="Yellow"
                                HeightRequest="30">
                                <!--  Does not bind at all  -->
                              <Label BackgroundColor="Red"
                                       Text="{Binding Name}" />
                          </StackLayout>
                      </Frame>
                  </ViewCell>
            </DataTemplate>
      </ListView.ItemTemplate>
</ListView>

或设置RowHeight

<ListView
            HasUnevenRows="False"
            RowHeight="80"
            x:Name="lv1"
            BackgroundColor="Green"
            ItemsSource="{Binding DS}">
            <ListView.ItemTemplate>
                <DataTemplate x:DataType="local:Lv1Vm">
                    <ViewCell>
                        <Frame BackgroundColor="Navy">
                            <StackLayout
                                Padding="10"
                                x:DataType="model:LvModel"
                                BackgroundColor="Yellow"
                                HeightRequest="30">
                                <!--  Does not bind at all  -->
                                <Label BackgroundColor="Red"
                                       Text="{Binding Name}" />
                            </StackLayout>
                        </Frame>
                    </ViewCell>
                </DataTemplate>
            </ListView.ItemTemplate>
</ListView>
于 2020-10-08T02:44:18.500 回答
0

我从来没有遇到过这个问题StackLayout,但是我遇到了BoxView. 容器上的HeightRequest看起来太小了。根据这个答案,Android 是 64 个单位到厘米,这将使该容器大约半厘米。尝试更改 HeightRequest 值。

于 2020-10-07T16:24:51.870 回答