如何在Silverlight中制作表格？

Question

我想制作一个可见的表格，每个单元格都有边框，并且标题栏有不同的背景颜色。最终我想在其中插入控件。例如，在表格元素中放置文本字段、一些单选按钮等等。是否有此类控件？

我已经缩小了范围，只剩下两种可能性，但它们都似乎有点“凑合”：

1. 使用网格控件 - 我喜欢这个，但有没有办法给单元格上色（我没有找到）？ 2. 使用数据网格控件 - 这个控件对我来说太复杂了。

我只是想在Silverlight中使用HTML样式表格，有什么建议吗？

- Shai UI

Answer 1

我在工具包中使用HeaderedItemsControl取得了相当不错的结果：

<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>

当然，您可以随心所欲地为上述内容添加样式...

- JerKimball

---

标题模板和项目模板有没有共享同一个网格的方法？ - Andrew Garrison

Answer 2

您可以在每个单元格中使用带有边框厚度(BorderThickness)和边框颜色/背景(BorderBrush\Background)的网格(Grid with Border element)。请看下面这个使用了统一网格(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>

- Nagg

---

谢谢。虽然让我们等待并看看是否有比在每个元素上设置边框更有效的方法。经过3年，我希望微软为表格提供了更好的解决方案。 - Shai UI