How do I display the values of a List<int> in a ListView using XAML binding?

Question

I am using the Microsoft.Toolkit.Mvvm library as an MVVM library. My C# code is the following:

class SampleViewModel : ObservableObject
{ 
    private List<int> _sampleList;
    public List<int> sampleList
    {
        get => _sampleList;
        set
        {
            SetProperty(ref _sampleList, value);
        }
    }
}

The XAML code I am attempting to use to display all the values of the List<int> is:

<ListView x:Name="mylistview" ItemsSource="{x:Bind ViewModel.sampleList, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}">
    <ListView.ItemTemplate>
        <DataTemplate>
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition/>
                    <RowDefinition/>
                </Grid.RowDefinitions>
                <ItemsControl ItemsSource="{Binding}">
                    <ItemsControl.ItemTemplate>
                        <DataTemplate x:DataType="x:Int32">
                            <TextBlock Text="{x:Bind}" />
                        </DataTemplate>
                    </ItemsControl.ItemTemplate>
                </ItemsControl>
            </Grid>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

When the list is updated, the elements are created, but the value of the int is not displayed, only an empty row is present. If I use the following, I can display the value:

<TextBlock Text="{x:Bind ViewModel.sampleList[0], Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"/>

How should I change the ListView, so that it displays the values as well?

Answer 1

i think you have over complicated what you want to do

<ListView x:Name="mylistview" ItemsSource="{x:Bind ViewModel.sampleList, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}">
    <ListView.ItemTemplate>
        <DataTemplate x:DataType="x:Int32">
            <TextBlock Text="{x:Bind}" />
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

should do the trick

this reads as create an text box for every item in the sampleList if this doesn't work then the issue is most likely that your datacontext hasn't been set and the binding can't trace the relative address

also you should try using an Observable collection

ie

public ObservableCollection<int> sampleList { get ;} = new ObservableCollection<int>();

this is because you should be changing the content of the list not the list itself so you need to INotifyCollectionChanged Event to inform the binding the content has changed

Answer 2

1. Try to use ObservableCollection<int> instead of List<int>
2. Your binding in XAML is very compicated. Try the following:

    <ListView x:Name="mylistview" ItemsSource="{x:Bind ViewModel.sampleList, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}">
        <ListView.ItemTemplate>
            <DataTemplate>
                <Label Content="{x:Bind}" />
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>