2009-04-20 1 views
1

WPF/Silverlightでは、HTMLのようなTableControlにバインドすることは可能ですか?次のカテゴリ&サブカテゴリを考える

  1. アニメーション(ファミリーガイ、カルバン& Hobes、ブーンドックス、わんぱくダック夢冒険、ルーニートゥーンズ、ピンク&ブレイン)
  2. セサミストリート(オスカー、アーニー&バート、カーミット・デ・カエル、エルモ、クッキーモンスター、グローバー)

は、私は次のように行と列にして)動的に(それをレンダリングする方法を探しています:

 
---------------------------------------------------- 
| Animations          | 
---------------------------------------------------- 
| Family Guy | Calvin & Hobes | The Boondocks  | 
---------------------------------------------------- 
| Duck Tales | Looney Toons | Pinky & The Brain | 
---------------------------------------------------- 
| Sesame Street         | 
---------------------------------------------------- 
| Oscar  | Ernie & Bert | Kermit de Frog | 
---------------------------------------------------- 
| Elmo  | Cookie Monster | Grover   | 
---------------------------------------------------- 

P/S:私はリストコントロール(ItemsControl、DataGrid、ListViewなど)を認識していますが、そのうちのどれもがこの基準を満たしていないようです。

答えて

2

あなたが行う必要があることは、どういうわけかアイテムをカテゴリ別にグループ化するクエリを作成することです(既にそれを持っているか、linqを使ってGroup By ... Intoクエリで階層を作成できます)。

次に、クエリ結果にバインドするItemsControlを使用して、ヘッダーを含むItemTemplateとWrapPanelまたはUniformGridにItemsPanelTemplateを設定した別のItemsControlでデータを表示できます。

Public Class Category 

    Private _Name As String 
    Public Property CategoryName() As String 
     Get 
      Return _Name 
     End Get 
     Set(ByVal value As String) 
      _Name = value 
     End Set 
    End Property 

    Private _SubCategories As New List(Of SubCategory) 
    Public Property SubCategories() As List(Of SubCategory) 
     Get 
      Return _SubCategories 
     End Get 
     Set(ByVal value As List(Of SubCategory)) 
      _SubCategories = value 
     End Set 
    End Property 

End Class 

Public Class SubCategory 

    Private _Name As String 
    Public Property SubCategoryName() As String 
     Get 
      Return _Name 
     End Get 
     Set(ByVal value As String) 
      _Name = value 
     End Set 
    End Property 

End Class 



<ItemsControl ItemsSource="{Binding QueryResult}"> 
     <ItemsControl.ItemTemplate> 
      <DataTemplate> 
       <Border BorderThickness="1" 
         BorderBrush="Black"> 

        <Grid> 
        <Grid.RowDefinitions> 
         <RowDefinition Height="Auto" /> 
         <RowDefinition Height="Auto" />        
        </Grid.RowDefinitions> 
         <Border BorderThickness="1" 
           BorderBrush="Black"> 
          <TextBlock Margin="2" 
             Text="{Binding CategoryName}" /> 
         </Border> 
          <ItemsControl Grid.Row="1" 
              ItemsSource="{Binding SubCategories}"> 
           <ItemsControl.ItemTemplate> 
            <DataTemplate> 
             <Border BorderThickness="1" 
               BorderBrush="Black"> 

              <TextBlock Margin="2" 
                 Text="{Binding SubCategoryName}" /> 
             </Border> 
            </DataTemplate> 
           </ItemsControl.ItemTemplate> 
           <ItemsControl.ItemsPanel> 
            <ItemsPanelTemplate> 
             <UniformGrid Columns="3" /> 
            </ItemsPanelTemplate> 
           </ItemsControl.ItemsPanel> 
          </ItemsControl> 
        </Grid> 
       </Border> 
      </DataTemplate> 
     </ItemsControl.ItemTemplate> 
    </ItemsControl> 

これは非常にラフなテンプレートで、あなた」:

次のクラスでは、あなたのデータを(申し訳ありませんが、ここではVBが、C#はならない遠くから、あなたがそれを必要とする場合)を取得するために管理すると仮定すると、あなたが必要とするものを得るために境界線をつける必要がありますが、それはそのトリックを行います。

+0

SilverlightにUniformGridが存在しないので、私はこのカスタムコードを使用しました:http://www.jeff.wilcox.name/2009/01/uniform-grid/ –

+0

真実、それは欠けています。それが役に立つかもしれないので、周りに横たわっている... –

+0

Silverlightのための別のUniformGrid実装http://jobijoy.blogspot.com/2010/03/uniformgrid-for-silverlight-ported-from.html –