question

PhilipBorchert-6754 avatar image
0 Votes"
PhilipBorchert-6754 asked HuiLiu-MSFT edited

Using xaml to Bind A List Nested In a List to ListViews

I have a UserControl that contains two ListViews. The ListView on the left is PLC's the ListView on the Right is the Tags For that PLC. I want to bind in the xaml if all possible. If not binding in the code behind will work.

 **PLC Class**

 public class PLC
 {
  public string Name { get; set; }
  public ObservableCollection<Tag> Tags { get; set; }
  public PLC(string name)
  {
  Name = name;
  Tags = new ObservableCollection<Tag>();
  }
  public override string ToString()
  {
  return Name;
  }
 }

Tag Class

 public class Tag
 {
  public Tag(string name, int value)
  {
  Name = name;
  Value = value;
  }
  public string Name { get; set; }
  public int Value { get; set; }
 }

Relevant Xaml

 <UserControl x:Class="Test.UserControls.RuntimeControl"
              xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
              xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
              xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
              xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
              mc:Ignorable="d" 
              d:DesignHeight="450" d:DesignWidth="800">
     <Grid>
         <Grid.RowDefinitions>
             <RowDefinition Height="20"></RowDefinition>
             <RowDefinition Height="*"></RowDefinition>
         </Grid.RowDefinitions>
         <Grid Grid.Row="0">
             <TextBlock Foreground="Red" Margin="10,0,0,0" >Runtime</TextBlock>
         </Grid>
         <Grid Grid.Row="1">
             <Grid.ColumnDefinitions>
                 <ColumnDefinition Width="*"></ColumnDefinition>
                 <ColumnDefinition Width="*"></ColumnDefinition>
             </Grid.ColumnDefinitions>
             <ListView x:Name="PLCLV" Grid.Column="0" Margin="10" FontSize="25" SelectionMode="Single" ScrollViewer.VerticalScrollBarVisibility="Visible"
                       BorderThickness="0" ItemsSource="{Binding PLCs}">
                 <ListView.ItemTemplate>
                     <DataTemplate>
                         <TextBlock Text="{Binding Name}" Foreground="{Binding ForegroundColor}"></TextBlock>
                     </DataTemplate>
                 </ListView.ItemTemplate>
             </ListView>
             <ListView Grid.Column="1" Margin="10" FontSize="25" AlternationCount="2" ScrollViewer.VerticalScrollBarVisibility="Visible"
                       BorderThickness="0 " **ItemsSource=**Can't Figure This Out**">
                 <ListView.ItemContainerStyle>
                     <Style TargetType="ListViewItem">
                         <Setter Property="Focusable" Value="false"/>
                     </Style>
                 </ListView.ItemContainerStyle>
                 <ListView.ItemTemplate>
                     <DataTemplate>
                         <TextBlock>
                             <Run Text = "Name: "/>
                             <Run Text =**Can't Figure this out**
                             <Run Text ="Value: "/>
                             <Run Text =**Can't Figure this out**
                         </TextBlock>
                     </DataTemplate>
                 </ListView.ItemTemplate>
             </ListView>
         </Grid>
     </Grid>
 </UserControl>

Thank you for your help. I put Can't Figure this out where I need help. The UserControl is getting the DataContext from the parent. So it works but, in the designer with Resharper it complains.

dotnet-csharpwindows-wpfdotnet-wpf-xaml
5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

1 Answer

HuiLiu-MSFT avatar image
0 Votes"
HuiLiu-MSFT answered HuiLiu-MSFT edited

Hi, @PhilipBorchert-6754.


If you want to bind two separate ListViews, you could set two Collections.

   <ListView x:Name="PLCLV" Grid.Column="0" Grid.Row="2" Margin="10" FontSize="25" SelectionMode="Single" ScrollViewer.VerticalScrollBarVisibility="Visible"
                        BorderThickness="0" ItemsSource="{Binding PLCs}">
                 <ListView.ItemTemplate>
                     <DataTemplate>
                         <TextBlock Text="{Binding Name}" Foreground="DarkGreen"></TextBlock>
                     </DataTemplate>
                 </ListView.ItemTemplate>
             </ListView>
             <ListView Grid.Column="1" Margin="10" FontSize="25" AlternationCount="2" ScrollViewer.VerticalScrollBarVisibility="Visible"
                        BorderThickness="0 " ItemsSource="{Binding Tags}" >
                 <ListView.ItemContainerStyle>
                     <Style TargetType="ListViewItem">
                         <Setter Property="Focusable" Value="false"/>
                     </Style>
                 </ListView.ItemContainerStyle>
                 <ListView.ItemTemplate>
                     <DataTemplate>
                         <TextBlock>
                              <Run Text = "Name: "/>
                              <Run Text ="{Binding Name}"/>
                              <Run Text ="Value: "/>
                              <Run Text = "{Binding Value}"/>
                         </TextBlock>
                      </DataTemplate>
                  </ListView.ItemTemplate>
              </ListView>

Codebehind:
241271-new-text-document-5.txt


The result:

241199-image.png

For Nested Collection, it is generally bound in the following way.

UserControl:

     <UserControl x:Class="ListViewShowData.UserControls.RuntimeControl"
                    
                  xmlns:local="clr-namespace:ListBoxNotShowData.UserControls"
                  xmlns:mw="clr-namespace:ListBoxNotShowData"
               >
         <UserControl.DataContext>
             <mw:ViewModel/>
         </UserControl.DataContext>
         <Grid>
             <Grid.RowDefinitions>
                 <RowDefinition Height="20"></RowDefinition>
                 <RowDefinition Height="*"></RowDefinition>
             </Grid.RowDefinitions>
             <Grid Grid.Row="0">
                 <TextBlock Foreground="Red" Margin="10,0,0,0" >Runtime</TextBlock>
             </Grid>
             <Grid Grid.Row="1">
                 <Grid.ColumnDefinitions>
                     <ColumnDefinition Width="*"></ColumnDefinition>
                     <ColumnDefinition Width="*"></ColumnDefinition>
                 </Grid.ColumnDefinitions>
                 <ListView x:Name="PLCLV" Grid.Column="0" Margin="10" FontSize="25" SelectionMode="Single" ScrollViewer.VerticalScrollBarVisibility="Visible"
                            BorderThickness="0" ItemsSource="{Binding PLCs}">
                     <ListView.ItemTemplate>
                         <DataTemplate>
                             <Grid>
                                 <Grid.ColumnDefinitions>
                                     <ColumnDefinition/>
                                     <ColumnDefinition/>
                                 </Grid.ColumnDefinitions>
                                 <TextBlock Text="{Binding Name}" Foreground="DarkBlue"></TextBlock>
                                 <ListView Grid.Column="1" Margin="10" FontSize="25" AlternationCount="2" ScrollViewer.VerticalScrollBarVisibility="Visible"
                            BorderThickness="0 " ItemsSource="{Binding Tags}">
                                     <ListView.ItemContainerStyle>
                                         <Style TargetType="ListViewItem">
                                             <Setter Property="Focusable" Value="false"/>
                                         </Style>
                                     </ListView.ItemContainerStyle>
                                     <ListView.ItemTemplate>
                                         <DataTemplate>
                                             <StackPanel Orientation="Horizontal">
                                                 <TextBlock Margin="5">
                                                             <Run Text = "Name: "/>
                                                             <Run Text = "{Binding Name}"/>
                                                 </TextBlock>
                                                 <TextBlock Margin="5">
                                                             <Run Text = "Value: "/>
                                                             <Run Text="{Binding Value}"/>
                                                 </TextBlock>
        
                                             </StackPanel>
                                         </DataTemplate>
                                     </ListView.ItemTemplate>
                                 </ListView>
                             </Grid>
                         </DataTemplate>
                     </ListView.ItemTemplate>
                 </ListView>
                 <ListView x:Name="PLCLV1" Grid.Column="1" Margin="10" FontSize="25" SelectionMode="Single" ScrollViewer.VerticalScrollBarVisibility="Visible"
                            BorderThickness="0" ItemsSource="{Binding PLCs}">
                     <ListView.View>
                         <GridView>
                             <GridViewColumn Header="Name" DisplayMemberBinding="{Binding Name}"/>
                             <GridViewColumn Header="Tags">
                                 <GridViewColumn.CellTemplate>
                                     <DataTemplate>
                                         <ListView Grid.Column="1" Margin="10" FontSize="25" AlternationCount="2" ScrollViewer.VerticalScrollBarVisibility="Visible"
                            BorderThickness="0 " ItemsSource="{Binding Tags}">
                                             <ListView.ItemContainerStyle>
                                                 <Style TargetType="ListViewItem">
                                                     <Setter Property="Focusable" Value="false"/>
                                                 </Style>
                                             </ListView.ItemContainerStyle>
                                             <ListView.ItemTemplate>
                                                 <DataTemplate>
                                                     <StackPanel Orientation="Horizontal">
                                                         <TextBlock Margin="5">
                                                             <Run Text = "Name: "/>
                                                             <Run Text = "{Binding Name}"/>
                                                         </TextBlock>
                                                         <TextBlock Margin="5">
                                                             <Run Text = "Value: "/>
                                                             <Run Text="{Binding Value}"/>
                                                         </TextBlock>
                                                           
                                                     </StackPanel>
                                                 </DataTemplate>
                                             </ListView.ItemTemplate>
                                         </ListView>
                                     </DataTemplate>
                                 </GridViewColumn.CellTemplate>
                             </GridViewColumn>
                         </GridView>
                     </ListView.View>
                      
                 </ListView>
        
             </Grid>
         </Grid>
     </UserControl>
    
 MainWindow.xaml:
    
     <Window x:Class="ListViewShowData.MainWindow"
        
             xmlns:local="clr-namespace:ListBoxNotShowData"
             xmlns:uc="clr-namespace:ListBoxNotShowData.UserControls"
             mc:Ignorable="d"
             Title="MainWindow" Height="450" Width="800">
         <Grid>
             <uc:RuntimeControl />
         </Grid>
     </Window>
    
 MainWindow.xaml.cs:
    
     using System.Collections.ObjectModel;
     using System.Windows;
        
     namespace ListViewShowData
     {
         public partial class MainWindow : Window
         {
             public MainWindow()
             {
                 InitializeComponent();
             }
               
         }
         public class ViewModel
         {
             public ObservableCollection<PLC> PLCs { get; set; } = new ObservableCollection<PLC>();
             public ViewModel()
             {
                 PLCs.Add(new PLC() { Name = "plc1", Tags = new ObservableCollection<Tag>() { new Tag("name1", 1),new Tag("name2", 2) } } );
                 PLCs.Add(new PLC() { Name = "plc2", Tags = new ObservableCollection<Tag>() { new Tag("name3", 3),new Tag("name4", 4) } } );
             }
         }
         public class PLC
         {
             public string Name { get; set; }
             public ObservableCollection<Tag> Tags { get; set; }
             public PLC() { }
             public PLC(string name)
             {
                 Name = name;
                 Tags = new ObservableCollection<Tag>();
             }
         }
         public class Tag
         {
            public Tag()
            {
            }
             public Tag(string name, int value)
             {
                 Name = name;
                 Value = value;
             }
             public string Name { get; set; }
             public int Value { get; set; }
         }
     }


If the response is helpful, please click "Accept Answer" and upvote it.
Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.


[3]: /answers/storage/attachments/241292-highlight-multiple-days-on-calendar.txt




· 1
5 |1600 characters needed characters left characters exceeded

Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

Hi, @PhilipBorchert-6754 . Is there any update to the question? Did the answer below solve your problem? If so, you could accept it as the answer. It's helpful for community members with related questions.

0 Votes 0 ·