Question

所以我想创建一个可见的表格，每个单元格周围有一个边框，标题的背景颜色不同。我想最终在此插入控件。例如，将一个文本字段放在其中一个表格元素或一些单选按钮等中。是否有控制权？

我把它缩小到两种可能性，但它们看起来都像是“meh”：

使用网格控件 - 我喜欢这个，但有没有办法为单元格上的边框着色（我没有找到这个）
使用DataGrid控件 - 这个控件对于我需要的东西来说太复杂了。

我只是想在silverlight中寻找一个html风格的表，有什么想法吗？

Answer 1

我使用Toolkit中的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>

当然，你可以将上述内容设为你心中的内容......

Answer 2

您可以在每个单元格中使用带边框元素的网格（使用BorderThickness和BorderBrush \ Background）看看这个示例（使用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>

如何在Silverlight中制作表格？

2 个答案: