Cách tạo bảng trong Silverlight?

Question

Vì vậy, tôi muốn tạo một bảng hiển thị, với đường viền xung quanh mỗi ô và màu nền khác nhau cho tiêu đề. Tôi muốn cuối cùng chèn điều khiển vào điều này. Ví dụ: đặt một trường văn bản bên trong một trong các phần tử bảng hoặc một số nút radio, v.v. Có điều khiển cho điều này không?

tôi đã thu hẹp nó xuống để hai khả năng, nhưng cả hai đều có vẻ loại "meh":

1. sử dụng Control Lưới - Tôi thích video này nhưng có một cách để tô màu biên giới trên di động (Tôi không tìm thấy điều này)

2. sử dụng DataGrid Control - điều khiển này chỉ là quá phức tạp đối với những gì tôi cần.

Tôi chỉ đang tìm bảng kiểu html trong silverlight, có ý tưởng gì không?

Answer 1

tôi đã nhận được kết quả khá tốt với HeaderedItemsControl trong Toolkit:

<c:HeaderedItemsControl ItemsSource="{Binding rowData}" x:Name="theTable"> 
    <c:HeaderedItemsControl.Header> 
     <Border Background="HEADER BG COLOR HERE"> 
      <Grid Width="{Binding ActualWidth, ElementName=theTable}"> 
       <Grid.ColumnDefinitions> 
        <ColumnDefinition Width="*"/> 
        <ColumnDefinition Width="*"/> 
        <ColumnDefinition Width="*"/>     
       </Grid.ColumnDefinitions> 
       <TextBlock Grid.Column="0" Text="Field 1"/> 
       <TextBlock Grid.Column="1" Text="Field 2"/> 
       <TextBlock Grid.Column="2" Text="Field 3"/> 
      </Grid> 
     </Border> 
    </c:HeaderedItemsControl.Header> 
    <c:HeaderedItemsControl.ItemTemplate> 
     <DataTemplate> 
      <Grid> 
       <Grid.ColumnDefinitions> 
        <ColumnDefinition Width="*"/> 
        <ColumnDefinition Width="*"/> 
        <ColumnDefinition Width="*"/>     
       </Grid.ColumnDefinitions> 
       <TextBlock Grid.Column="0" Text="{Binding Value1}"/> 
       <TextBlock Grid.Column="1" Text="{Binding Value2}"/> 
       <TextBlock Grid.Column="2" Text="{Binding Value3}"/> 
      </Grid> 
     </DataTemplate> 
    </c:HeaderedItemsControl.ItemTemplate> 
</c:HeaderedItemsControl> 

và dĩ nhiên bạn có thể tạo kiểu trên nội dung trái tim của bạn ...

Answer 2

Bạn có thể sử dụng lưới có yếu tố Border trong mỗi tế bào (với BorderThickness và BorderBrush \ Background) Nhìn vào mẫu này (với UniformGrid):

<UniformGrid Margin="10" Name="uniformGrid1"> 
    <Border BorderThickness="1" BorderBrush="Red"> 
     <TextBlock Text="1"></TextBlock> 
    </Border> 
    <Border BorderThickness="1" BorderBrush="Blue"> 
     <TextBlock Text="2"></TextBlock> 
    </Border> 
    <Border BorderThickness="1" BorderBrush="Black"> 
     <TextBlock Text="3"></TextBlock> 
    </Border> 
    <Border BorderThickness="1" BorderBrush="Yellow"> 
     <TextBlock Text="4"></TextBlock> 
    </Border> 
</UniformGrid>