none
How do I populate listview in 2 columns from 2 arrays in WPF VB.net?

    Question

  • I am using Visual Studio 2010 (WPF). I have a few texts stored on 2 arrays. I want to populate first column with 1st array and 2nd column with 2nd array. But I can barely use this list view control. Its easy in windows forms. But I want it in WPF form.

    Suppose, 1st array is "Company" and 2nd array is "LTP".

    The two column headers of the list view control will be "Company" and "Value"

    Tell me the code for creating these 2 columns and then populate these with the 2 arrays. Plus, I will also have 2 text boxes in which I want the selected items texts. First box will contain the selected text in 1st column and second box will contain the selected text of 2nd column.

    P.S. If list view control is not suitable for this then forget it and mention the name of the most suitable control with codes.

    • Moved by Liliane Teng Friday, August 06, 2010 5:37 AM a problem related to WPF (From:Visual Basic General)
    Thursday, August 05, 2010 2:06 PM

Answers

  • Hi sparrow10,

    WPF ItemsControl can only get one ItemsSource, so we cannot set two arrays for one ItemsControl. But we can create a class that contains two properties map the these two arrays value. And then bind the collection of this class to the ListView:

    Imports System.Collections.ObjectModel
    
    Class MainWindow
    
     Public Sub New()
    
      ' This call is required by the designer.
      InitializeComponent()
    
      ' Add any initialization after the InitializeComponent() call.
      Dim companys As String()
      Dim values As Integer()
      companys = {"MS", "IBM", "Apple"}
      values = {100, 99, 98}
    
      Dim Items As ObservableCollection(Of Item) = New ObservableCollection(Of Item)()
      For Each company As String In companys
       Items.Add(New Item() With {.Company = company})
      Next
      For Index As Integer = 0 To Items.Count - 1
       Items(Index).Value = values(Index)
      Next
      listview.ItemsSource = Items
    
     End Sub
    End Class
    
    Public Class Item
     Public Property Company As String
     Public Property Value As Integer
    End Class
    
    

     

    XAML:

    <Grid>
      <ListView x:Name="listview">
       <ListView.View>
        <GridView>
         <GridView.Columns>
          <GridViewColumn Header="Company" DisplayMemberBinding="{Binding Company}"/>
          <GridViewColumn Header="Value" DisplayMemberBinding="{Binding Value}"/>
         </GridView.Columns>
        </GridView>
       </ListView.View>
      </ListView>
     </Grid>
    

    It is not recommend to set several different arrays/lists to an ItemsControl, since we can not assure the length of all arrays/lists are the same.

    Sincerely,

    Bob Bao


    Please remember to mark the replies as answers if they help and unmark them if they provide no help.
    Monday, August 09, 2010 10:51 AM
    Moderator
  • Hi Alam,

    Well, if you have set a databinding for the ListView and bound a List data on it. Then you could bind the TextBlock.Text property to the ListView.SelectedItem (here the SelectedITem is a instance of the List value):

     <StackPanel>
      <ListView x:Name="listview" Height="100">
       <ListView.View>
        <GridView>
         <GridView.Columns>
          <GridViewColumn Header="Company" DisplayMemberBinding="{Binding Company}"/>
          <GridViewColumn Header="Value" DisplayMemberBinding="{Binding Value}"/>
         </GridView.Columns>
        </GridView>
       </ListView.View>
      </ListView>
      <StackPanel Orientation="Horizontal">
       <TextBlock Text="Text 1: "/>
       <TextBlock Text="{Binding ElementName=listview, Path=SelectedItem.Company}"/>
      </StackPanel>
      <StackPanel Orientation="Horizontal">
       <TextBlock Text="Text 2: "/>
       <TextBlock Text="{Binding ElementName=listview, Path=SelectedItem.Value}"/>
      </StackPanel>
     </StackPanel>
    

    The first TextBlock.Text is bound to the SelectedItem.Company, and other is bound the second property of the Item class. It is coded without behind-code. If you want to set them by VB.Net code, please use below code:

    XAML:

      <StackPanel Orientation="Horizontal">
       <TextBlock Text="Text 1: "/>
       <TextBlock x:Name="txtCompany"/>
      </StackPanel>
      <StackPanel Orientation="Horizontal">
       <TextBlock Text="Text 2: "/>
       <TextBlock x:Name="txtValue"/>
      </StackPanel>
    

    VB.Net

     Public Sub New()
    
      ' This call is required by the designer.
      InitializeComponent()
    
      ' Add any initialization after the InitializeComponent() call.
      ......
    
      Dim firstBinding As New Binding("SelectedItem.Company") With {.ElementName = "listview"}
      BindingOperations.SetBinding(txtCompany, TextBlock.TextProperty, firstBinding)
    
      Dim secondBinding As New Binding("SelectedItem.Value") With {.ElementName = "listview"}
      BindingOperations.SetBinding(txtValue, TextBlock.TextProperty, secondBinding)
     End Sub
    

    Sincerely,

    Bob Bao


    Please remember to mark the replies as answers if they help and unmark them if they provide no help.
    • Marked as answer by Alam Kanak Monday, August 16, 2010 7:08 PM
    Friday, August 13, 2010 2:09 AM
    Moderator

All replies

  • Hi,

    You can try something like this:

    With ListView1
     ' Loop through name array1
     For i = 0 To UBound(NameArray)
      .ListItems.Add i, ,nameArray1(i)
     Next
     ' Loop through name array2
     For i = 0 To UBound(SurnameArray)
      .ListItems(i).ListSubItems.Add i, , nameArray2(i)
     Next
     End With 
    Thursday, August 05, 2010 2:12 PM
  • Hello Alam,

    Thanks for your post.

    I have moved your thread to WPF forum where you may get more better and quicker support because more WPF experts live there. Thanks for your understanding.

    Best regards,
    Liliane
    MSDN Subscriber Support in Forum
    If you have any feedback on our support, please contact msdnmg@microsoft.com


    Please mark the replies as answers if they help and unmark them if they provide no help. Welcome to the All-In-One Code Framework! If you have any feedback, please tell us. Thanks
    Friday, August 06, 2010 5:41 AM
  • I am using Visual Studio 2010 (WPF). I have a few texts stored on 2 arrays. I want to populate first column with 1st array and 2nd column with 2nd array. But I can barely use this list view control. Its easy in windows forms. But I want it in WPF form.

    Suppose, 1st array is "Company" and 2nd array is "LTP".

    The two column headers of the list view control will be "Company" and "Value"

    Tell me the code for creating these 2 columns and then populate these with the 2 arrays. Plus, I will also have 2 text boxes in which I want the selected items texts. First box will contain the selected text in 1st column and second box will contain the selected text of 2nd column.

    P.S. If list view control is not suitable for this then forget it and mention the name of the most suitable control with codes.

    Sunday, August 08, 2010 3:19 PM
  • Hi sparrow10,

    WPF ItemsControl can only get one ItemsSource, so we cannot set two arrays for one ItemsControl. But we can create a class that contains two properties map the these two arrays value. And then bind the collection of this class to the ListView:

    Imports System.Collections.ObjectModel
    
    Class MainWindow
    
     Public Sub New()
    
      ' This call is required by the designer.
      InitializeComponent()
    
      ' Add any initialization after the InitializeComponent() call.
      Dim companys As String()
      Dim values As Integer()
      companys = {"MS", "IBM", "Apple"}
      values = {100, 99, 98}
    
      Dim Items As ObservableCollection(Of Item) = New ObservableCollection(Of Item)()
      For Each company As String In companys
       Items.Add(New Item() With {.Company = company})
      Next
      For Index As Integer = 0 To Items.Count - 1
       Items(Index).Value = values(Index)
      Next
      listview.ItemsSource = Items
    
     End Sub
    End Class
    
    Public Class Item
     Public Property Company As String
     Public Property Value As Integer
    End Class
    
    

     

    XAML:

    <Grid>
      <ListView x:Name="listview">
       <ListView.View>
        <GridView>
         <GridView.Columns>
          <GridViewColumn Header="Company" DisplayMemberBinding="{Binding Company}"/>
          <GridViewColumn Header="Value" DisplayMemberBinding="{Binding Value}"/>
         </GridView.Columns>
        </GridView>
       </ListView.View>
      </ListView>
     </Grid>
    

    It is not recommend to set several different arrays/lists to an ItemsControl, since we can not assure the length of all arrays/lists are the same.

    Sincerely,

    Bob Bao


    Please remember to mark the replies as answers if they help and unmark them if they provide no help.
    Monday, August 09, 2010 10:51 AM
    Moderator
  • Thanks. It works great.

    But still, there's one thing left. I have a 2 textblocks. I want the selected items in listview control to be on those textblocks. The item selected from the 1st column will be on textblock1 and the 2nd column will be on textblock2. Please give me the language in VB.net WPF.

    Thursday, August 12, 2010 5:04 PM
  • Hi Alam,

    Well, if you have set a databinding for the ListView and bound a List data on it. Then you could bind the TextBlock.Text property to the ListView.SelectedItem (here the SelectedITem is a instance of the List value):

     <StackPanel>
      <ListView x:Name="listview" Height="100">
       <ListView.View>
        <GridView>
         <GridView.Columns>
          <GridViewColumn Header="Company" DisplayMemberBinding="{Binding Company}"/>
          <GridViewColumn Header="Value" DisplayMemberBinding="{Binding Value}"/>
         </GridView.Columns>
        </GridView>
       </ListView.View>
      </ListView>
      <StackPanel Orientation="Horizontal">
       <TextBlock Text="Text 1: "/>
       <TextBlock Text="{Binding ElementName=listview, Path=SelectedItem.Company}"/>
      </StackPanel>
      <StackPanel Orientation="Horizontal">
       <TextBlock Text="Text 2: "/>
       <TextBlock Text="{Binding ElementName=listview, Path=SelectedItem.Value}"/>
      </StackPanel>
     </StackPanel>
    

    The first TextBlock.Text is bound to the SelectedItem.Company, and other is bound the second property of the Item class. It is coded without behind-code. If you want to set them by VB.Net code, please use below code:

    XAML:

      <StackPanel Orientation="Horizontal">
       <TextBlock Text="Text 1: "/>
       <TextBlock x:Name="txtCompany"/>
      </StackPanel>
      <StackPanel Orientation="Horizontal">
       <TextBlock Text="Text 2: "/>
       <TextBlock x:Name="txtValue"/>
      </StackPanel>
    

    VB.Net

     Public Sub New()
    
      ' This call is required by the designer.
      InitializeComponent()
    
      ' Add any initialization after the InitializeComponent() call.
      ......
    
      Dim firstBinding As New Binding("SelectedItem.Company") With {.ElementName = "listview"}
      BindingOperations.SetBinding(txtCompany, TextBlock.TextProperty, firstBinding)
    
      Dim secondBinding As New Binding("SelectedItem.Value") With {.ElementName = "listview"}
      BindingOperations.SetBinding(txtValue, TextBlock.TextProperty, secondBinding)
     End Sub
    

    Sincerely,

    Bob Bao


    Please remember to mark the replies as answers if they help and unmark them if they provide no help.
    • Marked as answer by Alam Kanak Monday, August 16, 2010 7:08 PM
    Friday, August 13, 2010 2:09 AM
    Moderator
  • Hey Bob Bao,

    Thanks a lot. Your code works like a magic every time.


    Monday, August 16, 2010 7:10 PM