2013-07-25 17 views
2

我將一個項目控件綁定到數據源並使用網格作爲我的項目主機。我希望將這些物品放入網格中的正確單元格中(我可以這樣做),並且將它們堆疊起來,這樣它們就不會彼此重疊(我無法弄清楚如何將物品插入到堆疊面板或網格中的其他面板)。wpf使用網格作爲itemshost自動堆疊單個「單元格」中的多個項目

這裏是兩個階級的cs文件:

public class listofdata 
    { 
     public List<data> stuff { get; set; } 
     public listofdata() 
     { 
      stuff = new List<data>(); 
      stuff.Add(new data(0, 0, "zeroa")); 
      stuff.Add(new data(0, 0, "zerob")); 
      stuff.Add(new data(1, 0, "onea")); 
      stuff.Add(new data(1, 0, "oneb")); 
      stuff.Add(new data(1, 1, "twoa")); 
      stuff.Add(new data(1, 1, "twob")); 
     } 
    } 

    public class data 
    { 
     public int x { set; get; } 
     public int y { set; get; } 
     public string text { get; set; } 
     public data(int x, int y, string text) 
     { 
      this.x = x; 
      this.y = y; 
      this.text = text; 
     } 
    } 
} 

這是我的XAML

<Window x:Class="GridTester.MainWindow" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 

    xmlns:src="clr-namespace:GridTester" 
    xmlns:sys="clr-namespace:System;assembly=mscorlib" 

    Title="MainWindow" > 
<Window.Resources> 
    <DataTemplate DataType="{x:Type src:data}"> 
     <Button Content="{Binding text}"/> 
    </DataTemplate> 
    <src:listofdata x:Key="MyDataSource"> </src:listofdata> 


</Window.Resources> 
<ListBox Name="Main" ItemsSource="{Binding Source={StaticResource MyDataSource},Path=stuff}"> 
    <ListBox.ItemsPanel> 
     <ItemsPanelTemplate> 
      <Grid Name="MyGrid"> 
       <Grid.ColumnDefinitions> 
        <ColumnDefinition/> 

        <ColumnDefinition/> 
       </Grid.ColumnDefinitions> 
       <Grid.RowDefinitions> 
        <RowDefinition /> 
        <RowDefinition /> 
       </Grid.RowDefinitions> 
      </Grid> 
     </ItemsPanelTemplate> 
    </ListBox.ItemsPanel> 

    <ListBox.ItemContainerStyle> 
     <Style> 
      <Setter Property="Grid.Column" Value="{Binding x}"/> 
      <Setter Property="Grid.Row" Value="{Binding y}"/> 
     </Style> 
    </ListBox.ItemContainerStyle> 

</ListBox> 


</Window> 

我的問題是,所有與結束按鈕「A」正在結束按鈕在b。 我不能看到如何使用XAML插入項目到動態創建的StackPanel

我試圖創建網格派生的類,想着攔截除了孩子們的加入stackpanels自己,然後將孩子從網格到堆疊面板,但試圖操縱項目主機中的子項會引發異常。

最終,我只是想讓我的數據源中的項目能夠綁定到網格中的「單元格」,並且如果多個項目綁定到同一個單元格,我希望它們堆疊。

+0

你贏了」不能以目前的方式做到這一點。您需要在集合內部創建一個嵌套集合(爲此創建一個ViewModel),其中每個「x,y」項目都有一個子集合集,並且網格中的每個可視項目都有一個帶有「StackPanel」的ItemsControl並綁定到子集採集。 –

回答

1

您可以在HighCore建議的數據級別執行此操作,但由於當前的數據結構已經包含必要的信息,因此ItemsControl應該可以處理它。考慮在列表框的項目集合中添加group description,並使用,其Panel是一個StackPanel。

+0

好的解決方案。我沒有想到它。 +1 –

1

以下是使用nmclean提示的解決方案(非常感謝) 本節將建立將用於在網格周圍分佈元素的分組。

<CollectionViewSource Source="{Binding Source={StaticResource MyDataSource}}" x:Key="cvs"> 


     <CollectionViewSource.GroupDescriptions> 
      <PropertyGroupDescription PropertyName="ordinal"/> 


     </CollectionViewSource.GroupDescriptions> 

    </CollectionViewSource> 

此部分是綁定到collectionviewsource的數據的主列表框,該containerstyle包含綁定把groupitem成在網格中的正確的細胞。網格是在groupstyle.panel

<ListBox ItemsSource ="{Binding Source={StaticResource cvs}}" > 
    <ListBox.GroupStyle> 
     <GroupStyle> 
      <GroupStyle.ContainerStyle> 
       <Style TargetType="{x:Type GroupItem}"> 
        <Setter Property="Grid.Row" Value="{Binding Items[0].y,diag:PresentationTraceSources.TraceLevel=High}" /> 
        <Setter Property="Grid.Column" Value="{Binding Items[0].x,diag:PresentationTraceSources.TraceLevel=High}" /> 


       </Style> 
      </GroupStyle.ContainerStyle> 
      <GroupStyle.Panel> 
       <ItemsPanelTemplate> 
        <Grid> 
         <Grid.RowDefinitions> 
          <RowDefinition></RowDefinition> 
          <RowDefinition></RowDefinition> 
          <RowDefinition></RowDefinition> 
         </Grid.RowDefinitions> 
         <Grid.ColumnDefinitions> 
          <ColumnDefinition></ColumnDefinition> 
          <ColumnDefinition></ColumnDefinition> 
          <ColumnDefinition></ColumnDefinition> 
         </Grid.ColumnDefinitions> 
        </Grid> 
       </ItemsPanelTemplate> 
      </GroupStyle.Panel> 
     </GroupStyle> 
    </ListBox.GroupStyle> 

下面是情況下,整體解決方案,你需要它:

<Window x:Class="GridTester.Window1" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     xmlns:diag="clr-namespace:System.Diagnostics;assembly=WindowsBase" 
     xmlns:src="clr-namespace:GridTester" 
     xmlns:sys="clr-namespace:System;assembly=mscorlib" 

     Title="Window1" Height="300" Width="300" Name="TOPWindow"> 
    <Window.Resources> 

     <DataTemplate DataType="{x:Type src:data}"> 
      <Button Content="{Binding text}"/> 
     </DataTemplate> 
     <src:listofdata x:Key="MyDataSource"></src:listofdata> 
     <CollectionViewSource Source="{Binding Source={StaticResource MyDataSource}}" x:Key="cvs"> 


      <CollectionViewSource.GroupDescriptions> 
       <PropertyGroupDescription PropertyName="ordinal"/> 


      </CollectionViewSource.GroupDescriptions> 

     </CollectionViewSource> 


    </Window.Resources> 



    <ListBox ItemsSource ="{Binding Source={StaticResource cvs}}" > 
     <ListBox.GroupStyle> 
      <GroupStyle> 
       <GroupStyle.ContainerStyle> 
        <Style TargetType="{x:Type GroupItem}"> 
         <Setter Property="Grid.Row" Value="{Binding Items[0].y,diag:PresentationTraceSources.TraceLevel=High}" /> 
         <Setter Property="Grid.Column" Value="{Binding Items[0].x,diag:PresentationTraceSources.TraceLevel=High}" /> 


        </Style> 
       </GroupStyle.ContainerStyle> 
       <GroupStyle.Panel> 
        <ItemsPanelTemplate> 
         <Grid> 
          <Grid.RowDefinitions> 
           <RowDefinition></RowDefinition> 
           <RowDefinition></RowDefinition> 
           <RowDefinition></RowDefinition> 
          </Grid.RowDefinitions> 
          <Grid.ColumnDefinitions> 
           <ColumnDefinition></ColumnDefinition> 
           <ColumnDefinition></ColumnDefinition> 
           <ColumnDefinition></ColumnDefinition> 
          </Grid.ColumnDefinitions> 
         </Grid> 
        </ItemsPanelTemplate> 
       </GroupStyle.Panel> 
      </GroupStyle> 
     </ListBox.GroupStyle> 


    </ListBox> 



</Window> 

的代碼文件看起來像現在這樣:

public class listofdata : List<data> 
{ 

    public listofdata() 
    { 

     Add(new data(0, 0, "zeroa")); 
     Add(new data(0, 0, "zerob")); 
     Add(new data(1, 0, "onea")); 
     Add(new data(1, 0, "oneb")); 
     Add(new data(1, 1, "twoa")); 
     Add(new data(1, 1, "twob")); 


    } 

} 

public class data 
{ 
    public int x { set; get; } 
    public int y { set; get; } 
    public int ordinal { get { return x * 1000 + y; } } 
    public string text { get; set; } 
    public data(int x, int y, string text) 
    { 
     this.x = x; 
     this.y = y; 
     this.text = text; 
    } 

} 
相關問題