Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Bind Collection to StackPanel

I want to take a collection of objects and bind it to a StackPanel so basically if the collection has 4 elements, inside the stack panel that should produce 4 buttons lets say.

I tried this...But I dont think its the correct approach anyway. I used DataTemplated to do this type of idea in the past.. please correct me if I am wrong.

Here is my fake model

public class MockModel {    public ObservableCollection<MockNode> Nodes;     public MockModel()    {       Nodes = new ObservableCollection<MockNode>();    } }  public class MockNode {    public MockNode()    {    }     private string itemname;    public string ItemName    {       get { return this.itemname; }       set { this.itemname = value; }    } } 

In code I set the DataContext like this...

// Init Model MockModel myModel = new MockModel();  for (int i = 0; i < 4; i++) {    MockNode mn = new MockNode();    mn.ItemName = String.Format("Node {0}", i);    myModel.Nodes.Add(mn); } // Set DataContext for StackPanel Stack.DataContext = myModel.Nodes; 

And the xaml

<StackPanel x:Name="tStack">    <ItemsControl ItemsSource="{Binding Nodes}">       <ItemsControl.Template>          <ControlTemplate>             <Button Content="{Binding ItemName}"/>          </ControlTemplate>       </ItemsControl.Template>    </ItemsControl> </StackPanel> 

IT does bind but instead of 4 buttons I only get one button....

Ideas?

like image 780
Gabe Avatar asked Jul 28 '10 19:07

Gabe


1 Answers

Alright I have figured it out... Using an ItemsControl solved the problem...

<ItemsControl x:Name="tStack" Grid.Column="0">    <ItemsControl.ItemsPanel>       <ItemsPanelTemplate>          <StackPanel Orientation="Horizontal"/>       </ItemsPanelTemplate>    </ItemsControl.ItemsPanel>    <ItemsControl.ItemTemplate>       <DataTemplate>          <Button Content="{Binding ItemName}"/>       </DataTemplate>    </ItemsControl.ItemTemplate> </ItemsControl> 
like image 156
Gabe Avatar answered Oct 09 '22 02:10

Gabe