2012-12-11 283 views
6

我有一個我希望綁定到WPF網格的集合。帶有動態列的wpf網格

我面臨的問題是列的數量是動態的並且依賴於集合。這裏是一個簡單的模擬:

public interface IRows 
{ 
    string Message{get;} 
    IColumns[] Columns{get;} 
} 

public interface IColumns 
{ 
    string Header {get;} 
    AcknowledgementState AcknowledgementState{get;} 
} 

public interface IViewModel 
{ 
    ObservableCollection<IRows> Rows {get;} 
} 

我想我的視圖綁定到行集合,其中包含一個列的集合。

My Columns集合包含應該由圖像表示的枚舉(3個可能性中的1個)。它還包含一個Message屬性,它應該只顯示在一列中(靜態的,只是一些文本信息)。它還包含一個Header字符串,該字符串應顯示爲該列的標題。

The link to what I want to show

注意,列的數目是可變的(在目前的頭被設定爲確認但是這將改變以表示動態數據)。

更新:這是瑞秋

<ItemsControl 
ItemsSource="{Binding Items, Converter={StaticResource PresentationConverter}}"> 
    <ItemsControl.ItemsPanel> 
    <ItemsPanelTemplate> 
     <Grid ShowGridLines="true" 
     local:GridHelpers.RowCount="{Binding RowCount}" 
     local:GridHelpers.ColumnCount="{Binding ColumnCount}" /> 
    </ItemsPanelTemplate> 
    </ItemsControl.ItemsPanel> 
    <ItemsControl.ItemContainerStyle> 
    <Style> 
     <Setter Property="Grid.Row" Value="{Binding RowIndex}"/> 
     <Setter Property="Grid.Column" Value="{Binding ColumnIndex}"/> 
    </Style> 
    </ItemsControl.ItemContainerStyle> 
    <ItemsControl.ItemTemplate> 
    <DataTemplate> 
     <ContentControl Content="{Binding}"> 
     <ContentControl.Resources> 
      <DataTemplate DataType="{x:Type UI:MessageEntity}"> 
      <TextBox Text="{Binding Message}"></TextBox> 
      </DataTemplate> 
      <DataTemplate DataType="{x:Type UI:StateEntity}"> 
      <TextBox Text="{Binding State}"></TextBox> 
      </DataTemplate> 
     </ContentControl.Resources> 
     </ContentControl> 
    </DataTemplate> 
    </ItemsControl.ItemTemplate> 
</ItemsControl> 

實施建議之後,這幾乎給了我什麼,我現在想。我只是堅持我應該爲標題做些什麼。 歡迎任何建議。

+0

得到幫助,給予最大的信息的例子提出了一個問題。包含鏈接... – Harry

+0

簡化並添加了一個鏈接。 – zman

+0

關於如何動態添加行和顏色的鏈接 - http://stackoverflow.com/questions/13344788/how-to-create-listview-to-a-grid-programmatically/ – Sai

回答

5

您可以使用嵌套ItemsControls這個

這裏有一個基本的例子:

<!-- Bind Rows using the default StackPanel for the ItemsPanel --> 
<ItemsControl ItemsSource="{Binding Rows}"> 
    <!-- Set the Template for each row to a TextBlock and another ItemsControl --> 
    <ItemsControl.ItemTemplate> 
     <DataTemplate> 
      <StackPanel Orientation="Horizontal"> 
       <!-- Need to set Width of name TextBlock so items line up correctly --> 
       <TextBlock Width="200" Text="{Binding Name}" /> 

       <ItemsControl ItemsSource="{Binding Columns}"> 
        <!-- Use a horizontal StackPanel to display columns --> 
        <ItemsControl.ItemsPanel> 
         <ItemsPanelTemplate> 
          <StackPanel Orientation="Horizontal" /> 
         </ItemsPanelTemplate> 
        </ItemsControl.ItemsPanel> 
       </ItemsControl> 
      </StackPanel> 
     </DataTemplate> 
    </ItemsControl.ItemTemplate> 
</ItemsControl> 
+0

這幾乎是我想要的。我嘗試過使用這個想法來實現一個解決方案,但是當我添加一個獨立於ItemsControl(僅僅是它上面的堆棧面板)的標題行時,我發現了問題。安排列的寬度以便它們同步是非常棘手的。 – zman

+1

@ManuelZanin您可以使用帶有[SharedSizeScope](http://msdn.microsoft.com/zh-cn/library/system.windows.controls.grid.issharedsizescope.aspx)附加屬性的網格,但這需要您提前定義列定義。如果列的數量可以更改,我有一些附加屬性[在我的博客上](http://rachel53461.wordpress.com/2011/09/17/wpf-grids-rowcolumn-count-properties/)您可以綁定列計數而不是手動指定ColumnDefinitions。 – Rachel

+0

好吧,我幾乎得到它的工作感謝您的建議。我更新了我的問題。剩下的唯一問題是如何很好地處理標題。如果我不能使用ItemsControl使用它,我可能不得不使用ListView(儘管我對此控件不是很熟悉)。 – zman

2

使用網格方法可能使事情變得比他們應該更復雜。您是否嘗試過更改listview的模板,或者爲此使用DataGrid?

舉一個例子,看看這個項目:http://www.codeproject.com/Articles/25058/ListView-Layout-Manager

或者這一個:http://www.codeproject.com/Articles/16009/A-Much-Easier-to-Use-ListView

如果用網格去,我相信你會不得不增加大量的代碼背後管理列和行的數量,它們的大小,單元格內容...而ListView/DataGrid可以讓你通過模板動態地做到這一點。

+0

這些鏈接不處理我看到的列集合。 – Paparazzi

+0

@Blam他們也不處理網格!這正是我的觀點:ListView中的DataTemplate可能是OP方案更合適的解決方案。當我啓動WPF時,我曾經開始編寫一個類,它會生成一個包含未知數量的列+標題的Grid,並最終了解了ListView以及它如何簡化這種問題 - 特別是因爲OP希望這是一個純粹的XAML解決方案。 – Joe

+0

你說得好,也許我讓自己生活太困難了。我曾考慮過使用ListView/GridView,但我還沒有找到任何使用它們來實現我想要的示例(我在WPF上生鏽並不起作用)。你發佈的例子是有用的,但我認爲這對我的目的來說是過分的。 – zman