如何在 Xamarin Forms 的 ListView 中绑定一个简单的标签？

Question

How a very simple binding would work for Label inside ListView?

我好像在这上面花了好几个小时，但还是想不通。

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

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

Am I over using x:DataType is it really needed for simple grid binding?

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; }

}

Answer 1

我从来没有运行使用 StackLayout 解决过这个问题，但我使用 BoxView 解决过这个问题。容器上的 HeightRequest 看起来太小了。根据，Android 是 64 个单位厘米，这将使该容器大约半厘米。尝试更改 HeightRequest 值。

Answer 2

事实上，您的绑定是正确的，它没有显示的原因是因为 ListView 中的所有行都具有相同的高度 default.It 没有计算您的子项的高度没有了。

您可以尝试设置 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>

如何在 Xamarin Forms 的 ListView 中绑定一个简单的标签？

How to bind a simple Label inside ListView for Xamarin Forms?

c#

xaml

xamarin.forms

xamarin-forms-4