在Silverlight没有像HTML中的table标签，如果我们想创建一个类似表格的界面或者说想创建一个类似Excel表格，那该如何创建呢，对于一般的可以使用DataGrid控件实现表格的显示，但是如果出现跨行跨列需要合并的表格，那DataGrid就无法实现了。接下来，我就介绍，如何使用Grid控件实现这样的功能。
首先，对于Gird布局控件，我们知道它有行和列的属性，以及可以在每行每列的单元格中放入控件。首先我们需要知道我们创建的表格有多少行或多少列，然后我们在动态创建行和列。
/// <summary>
/// 创建Grid,实现表格的主体
/// </summary>
protected void CreateGrid(int rows,int columns)
{
grid = new Grid()
{
Background = null,
HorizontalAlignment = HorizontalAlignment.Stretch,
VerticalAlignment = VerticalAlignment.Top,
Margin = new Thickness(10, 0, 10, 0)
};
for (int i = 0; i < rows; i++)
{
RowDefinition row = CreateRow();
grid.RowDefinitions.Add(row);
}
for (int i = 0; i < columns; i++)
{
ColumnDefinition column = CreateColumn();
grid.ColumnDefinitions.Add(column);
}
}
自定义创建行和列的方法：CreateRow()和CreateColumn()：
/// <summary>
/// 创建表格的一行
/// </summary>
/// <returns>返回Grid的一行</returns>
private RowDefinition CreateRow()
{
RowDefinition row = new RowDefinition()
{
Height = new GridLength(1, GridUnitType.Star)
};
return row;
}
/// <summary>
/// 创建表格的一列
/// </summary>
/// <returns>返回Grid的一列</returns>
private ColumnDefinition CreateColumn()
{
ColumnDefinition column = new ColumnDefinition()
{
Width = new GridLength(1, GridUnitType.Star)
};
return column;
}上面的代码，实现了一个表格的框架的创建，没有边框没有内容，接下来我们创建它的表头以及边框：
protected virtual void CreateHeader(List<string> headList)
{
for (int i = 0; i < headList.Count; i++)
{
TextBlock block = CreateTextBlock(headList[i]);
Border border = new Border() { Background = new SolidColorBrush(Colors.Transparent), BorderThickness = new Thickness(1, 1, 1, 1), BorderBrush = ConvertColor("FFC9CACA") };
border.Child = block;
border.SetValue(Grid.RowProperty, 0);
border.SetValue(Grid.ColumnProperty, i);
grid.Children.Add(border);
}
}创建Border是为了让单元格有边框，上面创建的Border的宽度为1Px，创建完后，你会发现最外层的边框宽度会细一些，中间内容的边框会粗一些，这是因为中间的部分是两个Border的宽度，如果要追求完美，你可以将表格最外层单元格的Border的宽度逐一设置一下。
创建TextBlock的方法，创建TextBlock主要是用来显示表格里面的内容：
/// <summary>
/// 创建一个TextBlock控件
/// </summary>
/// <param name="text">控件的Text</param>
/// <returns></returns>
protected TextBlock CreateTextBlock(string text)
{
TextBlock block = new TextBlock()
{
Text = text,
FontSize = 12,
Foreground = new SolidColorBrush(Colors.Black),
Margin = new Thickness(0, 5, 0, 5),
TextWrapping = TextWrapping.Wrap,
HorizontalAlignment = HorizontalAlignment.Center,
VerticalAlignment = VerticalAlignment.Center
};
return block;
}颜色转换的方法ConvertColor()：
/// <summary>
/// 将ARGB颜色转化成系统的颜色
/// </summary>
/// <param name="color">ARGB色彩的字符串</param>
/// <returns></returns>
protected SolidColorBrush ConvertColor(string color)
{
SolidColorBrush brush;
try
{
byte a, r, g, b;
a = r = g = b = 255;
r = Convert.ToByte(color.Substring(0, 2), 16);
g = Convert.ToByte(color.Substring(2, 2), 16);
b = Convert.ToByte(color.Substring(4, 2), 16);
brush = new SolidColorBrush(Color.FromArgb(a, b, g, r));
return brush;
}
catch
{
return new SolidColorBrush(Colors.Black);
}
}以上就完成了表格的表头的创建，下面介绍一下有关表头需要合并的操作：
/// <summary>
/// 创建表格的表头
/// </summary>
protected virtual void CreateHeaderOne()
{
TextBlock block;
block=CreateTextBlock(headList[0]);
Border border =new Border(){ Background=new SolidColorBrush(Colors.Transparent),BorderThickness=new Thickness(2,2,1,1) ,BorderBrush = ConvertColor("FFC9CACA")};
border.Child = block;
border.SetValue(Grid.RowProperty,0);
border.SetValue(Grid.ColumnProperty, 0);
grid.Children.Add(border);
block = CreateTextBlock(headList[1]);
border = new Border() { Background = new SolidColorBrush(Colors.Transparent), BorderThickness = new Thickness(1, 2, 1, 1), BorderBrush = ConvertColor("FFC9CACA") };
border.Child = block;
border.SetValue(Grid.RowProperty, 0);
border.SetValue(Grid.ColumnProperty, 1);
border.SetValue(Grid.ColumnSpanProperty, 2);//合并两列
grid.Children.Add(border);
block = CreateTextBlock(headList[2]);
border = new Border() { Background = new SolidColorBrush(Colors.Transparent), BorderThickness = new Thickness(1, 2, 1, 1), BorderBrush = ConvertColor("FFC9CACA") };
border.Child = block;
border.SetValue(Grid.RowProperty, 0);
border.SetValue(Grid.ColumnProperty, 3);
border.SetValue(Grid.RowSpanProperty, 2);//合并两行
grid.Children.Add(border);
}表格内容的填充：
/// <summary>
/// 将数据绑定到表格里
/// </summary>
protected virtual void BindingContent()
{
int index = 1;
foreach (var data in dataSource)
{
BindingOneColumn(index, data);
index++;
}
}
/// <summary>
/// 绑定一行数据
/// </summary>
private void BindingOneColumn(int index,Model data)
{
TextBlock block;
block=CreateTextBlock(data.ID.ToString());
Border border =new Border(){ Background=new SolidColorBrush(Colors.Transparent),BorderThickness=new Thickness(1,1,1,1) ,BorderBrush = ConvertColor("FFC9CACA")};
border.Child = block;
border.SetValue(Grid.RowProperty,index);
border.SetValue(Grid.ColumnProperty, 0);
grid.Children.Add(border);
string text = ConverterToString(data.Name);
block = CreateTextBlock(text);
border = new Border() { Background = new SolidColorBrush(Colors.Transparent), BorderThickness = new Thickness(1, 1, 1, 1), BorderBrush = ConvertColor("FFC9CACA") };
border.Child = block;
border.SetValue(Grid.RowProperty, index);
border.SetValue(Grid.ColumnProperty, 1);
grid.Children.Add(border);
text = ConverterToString(data.Sex);
block = CreateTextBlock(text);
border = new Border() { Background = new SolidColorBrush(Colors.Transparent), BorderThickness = new Thickness(1, 1, 1, 1), BorderBrush = ConvertColor("FFC9CACA") };
border.Child = block;
border.SetValue(Grid.RowProperty, index);
border.SetValue(Grid.ColumnProperty, 2);
grid.Children.Add(border);
text = ConverterToString(data.Age);
block = CreateTextBlock(text);
border = new Border() { Background = new SolidColorBrush(Colors.Transparent), BorderThickness = new Thickness(1, 1, 1, 1), BorderBrush = ConvertColor("FFC9CACA") };
border.Child = block;
border.SetValue(Grid.RowProperty, index);
border.SetValue(Grid.ColumnProperty, 3);
grid.Children.Add(border);
text = ConverterToString(data.Address);
block = CreateTextBlock(text);
border = new Border() { Background = new SolidColorBrush(Colors.Transparent), BorderThickness = new Thickness(1, 1, 1, 1), BorderBrush = ConvertColor("FFC9CACA") };
border.Child = block;
border.SetValue(Grid.RowProperty, index);
border.SetValue(Grid.ColumnProperty, 4);
grid.Children.Add(border);
}以上代码实现了，将我们的数据集合循环添加到Gird的每一行，每一列中去。其中的dataSource是我们的数据集合，它是我们自定义类型Model的集合。
以上就完成了通过Grid控件实现Table的创建，效果图，如下所示：
本文章为转载内容，我们尊重原作者对文章享有的著作权。如有内容错误或侵权问题，欢迎原作者联系我们进行内容更正或删除文章。
