In my dotnet maui page, I have a property that will not display, unless I change the binding while the app is running. Here's how my xaml looks:
<CollectionView ItemsSource="{Binding ListInViewModel}" SelectionMode="None" Margin="0, 10">
<CollectionView.ItemsLayout>
<LinearItemsLayout Orientation="Vertical" />
</CollectionView.ItemsLayout>
<CollectionView.ItemTemplate>
<DataTemplate>
<VerticalStackLayout>
<Label Text="{Binding PropertyThatDisplaysCorrectly}" VerticalOptions="Center" />
<CollectionView Grid.Row="1" SelectionMode="Single" SelectedItem="{Binding SelectedString}" ItemsSource="{Binding StringListFromObjectInList}">
<CollectionView.ItemsLayout>
<LinearItemsLayout Orientation="Horizontal" ItemSpacing="10"/>
</CollectionView.ItemsLayout>
<CollectionView.ItemTemplate>
<DataTemplate x:DataType="x:String">
<Border Stroke="DarkGray" Padding="10">
<Border.StrokeShape>
<RoundRectangle CornerRadius="20"/>
</Border.StrokeShape>
<Label Text="{Binding}" VerticalOptions="Center" HorizontalOptions="Center" />
</Border>
</DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>
</VerticalStackLayout>
</DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>
In this example, the label inside the second CollectionView does not display in the app, unless I go change the binding while the app is running and hot reload the app. The changed binding does not work if I restart the app.
The same problem arrises for a picker in the same situation, where the display on child elements of the binded object of the base collectionview does not work. Is therer any way to fix this issue?
Here is the code that is binded to:
public class MyViewModel
{
private List<MyObject> _listInViewModel { get; set; }
public MyViewModel()
{
}
public List<MyObject> ListInViewModel
{
get => _listInViewModel;
set
{
_listInViewModel = value;
OnPropertyChanged(nameof(ListInViewModel));
}
}
}
public class MyObject
{
public List<string> StringListFromObjectInList { get; set; }
}
I created a new project to test your code. And I deleted the SelectedItem="{Binding SelectedString}"
and Text="{Binding PropertyThatDisplaysCorrectly}"
due to I didn't see where did you declare the two properties.
In addition, the second CollectionView's parent control is not a Grid. So I delete the Grid.Row="1"
.
The ViewModel:
public class MyViewModel : INotifyPropertyChanged
{
private List<MyObject> _listInViewModel { get; set; }
public MyViewModel()
{
}
public List<MyObject> ListInViewModel
{
get => _listInViewModel;
set
{
_listInViewModel = value;
OnPropertyChanged(nameof(ListInViewModel));
}
}
public event PropertyChangedEventHandler? PropertyChanged;
public void OnPropertyChanged([CallerMemberName] string name = "") =>
PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(name));
}
The xaml:
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="TestCollectionView.MainPage">
<CollectionView ItemsSource="{Binding ListInViewModel}" SelectionMode="None" Margin="0, 10">
<CollectionView.ItemsLayout>
<LinearItemsLayout Orientation="Vertical" />
</CollectionView.ItemsLayout>
<CollectionView.ItemTemplate>
<DataTemplate>
<VerticalStackLayout>
<Label Text="TEST" VerticalOptions="Center" />
<CollectionView SelectionMode="Single" ItemsSource="{Binding StringListFromObjectInList}">
<CollectionView.ItemsLayout>
<LinearItemsLayout Orientation="Horizontal" ItemSpacing="10"/>
</CollectionView.ItemsLayout>
<CollectionView.ItemTemplate>
<DataTemplate x:DataType="x:String">
<Border Stroke="DarkGray" Padding="10">
<Border.StrokeShape>
<RoundRectangle CornerRadius="20"/>
</Border.StrokeShape>
<Label Text="{Binding}" VerticalOptions="Center" HorizontalOptions="Center" />
</Border>
</DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>
</VerticalStackLayout>
</DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>
</ContentPage>
Initialize the data:
public MainPage()
{
InitializeComponent();
var vm = new MyViewModel();
BindingContext = vm;
vm.ListInViewModel = new List<MyObject>();
vm.ListInViewModel.Add(new MyObject() { StringListFromObjectInList = new List<string>() { "111", "222", "333" } });
vm.ListInViewModel.Add(new MyObject() { StringListFromObjectInList = new List<string>() { "111", "222", "333" } });
vm.ListInViewModel.Add(new MyObject() { StringListFromObjectInList = new List<string>() { "111", "222", "333" } });
}
And the result: