UWP - ListView 绑定不会显示在 C++/CX 中的 XAML 上答案

【问题标题】：UWP - ListView binding does not show on XAML in C++/CXUWP - ListView 绑定不会显示在 C++/CX 中的 XAML 上
【发布时间】：2018-02-07 23:26:45
【问题描述】：

我已经问过这个话题了，但是这个简单的绑定就是不想工作。首先是我的代码：

CItem.h

#pragma once

#include "pch.h"



namespace XamlApp
{

    public ref class CItem sealed
    {

    public:

       CItem(Platform::String^ Ho, Platform::String^ Ip, Platform::String^ Im);
        Platform::String^ getHo();
        Platform::String^ getIP();

        property Platform::String^ Ho {
            Platform::String^ get() { return this->ho; }
        }
        property Platform::String^ Ip {
            Platform::String^ get() { return this->ip; }
        }
        property Platform::String^ Im {
            Platform::String^ get() { return this->im; }
        }

    public:

    private:

        Platform::String^ ho;
        Platform::String^ ip;
        Platform::String^ im;

    private:

    };
}

CItem.cpp:

#include "pch.h"
#include "CItem.h"

CItem::CItem(Platform::String^ Ho, Platform::String^ Ip, Platform::String^ Im) : 
    ho{ Ho }, ip{ Ip }, im{ Im }
{

}

Platform::String^ CItem::getHo() {

    return this->ho;
}

Platform::String^ CItem::getIP() {

    return this->ip;
}

主页：

 Windows::UI::Xaml::Interop::IBindableVector^ test;
    test = ref new Platform::Collections::Vector<CItem^>();
    CItem^ dummy1 = ref new CItem(L"ho1",L"23323",L"Assets/ic_info.png");
    CItem^ dummy2 = ref new CItem("ho2", "23323", "Assets/ic_info.png");

    test->Append(dummy1);
    test->Append(dummy2);
    mainListView->ItemsSource = test;

MainPage.xaml：

 <ListView x:Name="mainListView"  HorizontalAlignment="Stretch" MaxWidth="500" VerticalAlignment="Center"  Margin="20,0,20,-38" >
            <ListView.ItemTemplate>
                <DataTemplate>
                    <StackPanel Orientation="Horizontal">
                        <Image Source="{Binding Im}"/>
                        <TextBlock Text="{Binding Ho}"
                           Margin="20,0,20,8"
                           FontSize="24" 
                           FontStyle="Italic" 
                           FontWeight="SemiBold"
                           Foreground="DarkBlue"
                                   />
                        <TextBlock Text="{Binding Ip}"
                           Margin="20,0,20,8"
                           FontSize="24" 
                           FontStyle="Italic" 
                           FontWeight="SemiBold"
                           Foreground="DarkBlue"
                                   />
                    </StackPanel>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>

我的问题是：这段代码有什么问题？我实际上得到了 2 个列表视图条目，但没有数据，它们只是空的。我已经尝试在 xaml 中将 ho 更改为 Ho，我已经从 microsoft-sample 中逐步复制了它。

【问题讨论】：

标签： c++ xaml listview data-binding uwp

【解决方案1】：

在您的初始实现中，您需要将 BindableAttribute 添加到您的 CItem 类中：

[Windows::UI::Xaml::Data::Bindable]
public ref class CItem sealed

来源：https://msdn.microsoft.com/en-us/magazine/dn166929.aspx

如果你这样做，你的向量的类型也不必是

Windows::UI::Xaml::Interop::IBindableVector^ test;

你可以简单地使用一个

Platform::Collections::Vector<CItem^>^ test;

至少这对我有用！

【讨论】：

【解决方案2】：

一段时间后，我发现它可以与this pattern 交替使用，所以我想分享我对这个问题的解决方案：

MainPage.xaml.c:

this->viewModel = ref new CItemViewModel();

MainPage.xaml.h：

public:

    property CItemViewModel^ ViewModel
        {
            CItemViewModel^ get() { return this->viewModel; };
        }

private:

     CItemViewModel^ viewModel;

MainPage.xaml：

<ListView x:Name="mainListView"    ItemsSource="{x:Bind ViewModel.CItems}" MaxHeight="230" Margin="20,0,20,-37" >
<ListView.ItemTemplate >
                <DataTemplate x:DataType="local:CItem" >
                    <StackPanel Orientation="Horizontal">
                        <Image Source="{x:Bind Im}" Margin="10,0,0,5" Height="30" Width="30"/>
                        <TextBlock Margin="20,0,0,5" FontSize="12"  >
                            <Run Text="{x:Bind Ho}" /><Run Text="{x:Bind Ip}"/>
                        </TextBlock>
                    </StackPanel>
                </DataTemplate>
            </ListView.ItemTemplate>
</ListView>

CItem 保持不变！

CItemViewModel.h：

public ref class CItemViewModel sealed {

    public:

        CItemViewModel();

        property Windows::Foundation::Collections::IObservableVector<CItem^>^ CItems
        {
            Windows::Foundation::Collections::IObservableVector<CItem^>^ get()
            {
                if (this->cItems == nullptr)
                {
                    this->cItems = ref new Platform::Collections::Vector<CItem^>();

                }
                return this->cItems;
            };
        }

    private:

        Windows::Foundation::Collections::IObservableVector<CItem^>^ cItems;

    };

希望对您有所帮助！

【讨论】：