UWP - ListView binding in C++/CX

Question

This topic seems to be very easy in c# but I need to handle it in c++/cx. I want to populate a listview with a list/vector of 'CItem'. So I've tried this:

MainPage XAML:

<ListView x:Name="mainListView" HorizontalAlignment="Stretch" VerticalAlignment="Center"  Margin="20,0,20,6" >
            <ListView.ItemTemplate>
                <DataTemplate>
                    <Grid Height="40" Margin="5">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="Auto"></ColumnDefinition>
                        </Grid.ColumnDefinitions>
                        <Border Background ="Gray"  Width="50" Height="50" >
                            <Image Source="{Binding Image}" Stretch="UniformToFill" ></Image>
                        </Border>
                        <StackPanel>
                            <TextBlock Text="{Binding Hostname}" TextWrapping="NoWrap"/>
                        </StackPanel>

                    </Grid>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>

MainPage Class:

Windows::UI::Xaml::Interop::IBindableVector^ test;
CItem^ item = ref new 
CItem("name", "Assets/ic_help");
test->Append(item);
mainListView->ItemsSource = test;

CItem.h:

#pragma once

#include "pch.h"


    ref class CItem sealed
    {

    private:
        Platform::String^ name;
        Platform::String^ image;


    public:

        CItem(Platform::String^ name, Platform::String^ image) :
            name {name}, image {image} {}

        property Platform::String^ Name
        {
            Platform::String^ get() { return this->name;}
        }

        property Platform::String^ Image
        {
            Platform::String^ get() { return this->image;}
        }


    };

My Problem with this code is that I get a nullpointer on the IBindableVector^ because I do not know how to initialize it. I've tried to use a normal string-list/ vector, but it does not work in c++. So dou you have a template for me or a tip how I can easily solve this problem. I just simply want to a have a container of my custom items and each time i get new data I want to set the ItemSource of the listview once again. The reason why I want to use ->ItemSource for binding rather then the viewcontroller pattern is that I want to pass the listview later to a thread which generates the data and which would update the list (like I already did in C# and it was working).

Answer 1

My Problem with this code is that I get a nullpointer on the IBindableVector^ because I do not know how to initialize it.

IBindableVector represents a writeable vector collection of objects that is bindable. You need to initialize the IBindableVector as a vector collection, for example, initialize the IBindableVector as follows and you will find binding works:

Windows::UI::Xaml::Interop::IBindableVector^ test;
test=ref new Platform::Collections::Vector<CItem^>();

More details please reference XamlBind official sample.

Answer 2

In your initial implementation you need to add the BindableAttribute to your CItem class:

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

Source

If you do this, the type of your vector does not have to be

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

You could simply use a

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

At least this worked for me!