WinUI 3 ListView Linked To Observablecollection contains Canvases

Question

I am developing a WinUI 3 application which contains a ListView linked to an Observablecollection which contains canvases , the listview displays the names of the canvases via a DataTemplate but the names are not displayed

<StackPanel Grid.Row="1" Orientation="Vertical">
    <ListView x:FieldModifier="public" x:Name="listViewCanvases" Background="SeaGreen" >
        <ListView.ItemTemplate>
            <DataTemplate>
                <StackPanel>
                    <TextBlock Text="{Binding Path=Canvas.Name}" />
                 </StackPanel>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>
</StackPanel>

ObservableCollection<Canvas> ocCanvases = new ObservableCollection<Canvas>();
                         
ocCanvases.Add(new Canvas(){Name="AAA"});
             
ocCanvases.Add(new Canvas() { Name = "BBB" });
          
ocCanvases.Add(new Canvas() { Name = "CCC" });
          
listViewCanvases.ItemsSource = ocCanvases;

score 0 · Accepted Answer · answered Feb 22 '23 at 02:39

0

This should work:

<StackPanel
    Grid.Row="1"
    Orientation="Vertical">
    <ListView
        x:Name="listViewCanvases"
        x:FieldModifier="public"
        Background="SeaGreen">
        <ListView.ItemTemplate>
            <DataTemplate x:DataType="Canvas">
                <StackPanel>
                    <TextBlock Text="{x:Bind Name, Mode=OneWay}" />
                </StackPanel>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>
</StackPanel>

answered Feb 22 '23 at 02:39

Andrew KeepCoding

7,040
2
14
21

Yes, it works but as @mm8 mentioned, you should consider using ``DataTemplate`` for this. – Andrew KeepCoding Feb 22 '23 at 23:46
I want to create an application like photoshop main canvas which groups layer canvases, a listview which displays the name of the layers and a visibility button via a datatemplate I created the class layer derived from the class convas public class Layer : Canvas { public string Name { get; set; } public bool IsVisible { get; set; } publicLayer() { Name = "New Layer"; IsVisible = true; } } with his work but with Layer does not work @mm8 – mustapha chaibi Feb 23 '23 at 08:41

score 0 · Answer 2 · answered Feb 22 '23 at 16:07

You should not add UIElement derived types like Canvas to source collections.

Add data objects (or plain strings in this case) instead and then create the Canvas elements in the DataTemplate in the view:

ObservableCollection<string> oc = new ObservableCollection<string>();
oc.Add("AAA");
oc.Add("BBB");
oc.Add("CCC");
listViewCanvases.ItemsSource = oc;

XAML:

<StackPanel Grid.Row="1" Orientation="Vertical">
    <ListView x:FieldModifier="public" x:Name="listViewCanvases" Background="SeaGreen" >
        <ListView.ItemTemplate>
            <DataTemplate x:DataType="x:String">
                <StackPanel>
                    <Canvas>
                        <TextBlock Text="{x:Bind Mode=OneWay}" />
                    </Canvas>
                </StackPanel>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>
</StackPanel>

WinUI 3 ListView Linked To Observablecollection contains Canvases

2 Answers2