Question

我正在使用Silverlight MVVM模式，有一个datagrid（组件一），最初将有4列，稍后在运行时用户将显示组合框中的列列表，他可以选择他想要查看的列datagrid并单击一个按钮来添加datagrid中的列，因此在运行时我必须在datagrid中添加Column。是否可以使用Silverlight MVVM模式。请帮忙。

Answer 1

当然有可能。您将在xaml中定义数据网格和绑定，然后您将必须进行数据绑定并在代码中添加列。请务必关闭autoGenerateColumns。我保留了一个单独的列表来描述我的列。我还在代码中定义列模板，因为我希望每列的工具提示和标题不同。下面是一个添加浮点数或整数列的示例，如果需要，可以添加其他类型：

首先定义网格 - 我认为您使用组件一个数据网格并不重要

            <!-- NOTE: Creating columns is done Programmatically -->
            <sdk:DataGrid x:Name="DataGridForDistrictSummaries" Grid.Column="1" 
                              AutoGenerateColumns="False" 
                              VerticalScrollBarVisibility="Visible"  
                              HorizontalScrollBarVisibility="Visible" 
                              HorizontalAlignment="Stretch" 
                              VerticalAlignment="Stretch" 
                              MinHeight="70"
                              ItemsSource="{Binding dataGridView}"
                              AlternatingRowBackground="LightBlue"
                        >
           </sdk:DataGrid>

然后你需要建立你的网格列，我重建整个网格：

    public static void BuildDataGridColumns(DataGrid dataGrid, List<DataGridColumnDescription> columnDescriptionList)
    {
        // clear out the old columns and re-build them with new criteria
        dataGrid.Columns.Clear();

        // add columns based on the description
        int index = 0;
        foreach (DataGridColumnDescription column in columnDescriptionList)
        {
            if (DataGridColumnDescriptionValueType.floatDataType == column.valueType)
            {
                dataGrid.Columns.Add(DataGridColumnBuilder.CreateFloatColumn(index++, column.name, column.header, column.description));
            }
            else
            {
                dataGrid.Columns.Add(DataGridColumnBuilder.CreateIntColumn(index++, column.name, column.header, column.description));
            }
        }
    }

这使您可以在网格中使用不同的数据类型。这对于控制您希望如何显示数据非常重要。在这种情况下，我想要显示2个小数点

    public static DataGridTextColumn CreateFloatColumn(int index, string fieldName, string header, string description)
    {
        DataGridTextColumn column = new DataGridTextColumn();
        column.Header = header;
        column.HeaderStyle = BuildColumnHeaderStyle(description);
        column.Binding = new Binding("floatValuesList[" + index + "]");
        column.Binding.StringFormat = "0.00";
        column.CellStyle = BuildFloatCellStyle(fieldName, description);
        return column;
    }

    public static DataGridTextColumn CreateIntColumn(int index, string fieldName, string header, string description)
    {
        DataGridTextColumn column = new DataGridTextColumn();
        column.Header = header;
        column.HeaderStyle = BuildColumnHeaderStyle(description);
        column.Binding = new Binding("intValuesList[" + index + "]");
        column.CellStyle = BuildCellStyle(fieldName, description);
        return column;
    }

这定义了代码中的样式，我对某些内容进行了硬编码 - 但您可以根据需要将其设置为动态：

    private static Style BuildColumnHeaderStyle(string tooltip)
    {
        FontWeight fw = FontWeights.Bold;
        Style newGridHeaderStyle = new Style(typeof(DataGridColumnHeader));
        newGridHeaderStyle.Setters.Add(new Setter { Property = DataGridColumnHeader.FontSizeProperty, Value = 9.0 });
        newGridHeaderStyle.Setters.Add(new Setter { Property = DataGridColumnHeader.FontWeightProperty, Value = FontWeights.Bold });
        newGridHeaderStyle.Setters.Add(new Setter { Property = DataGridColumnHeader.ContentTemplateProperty, Value = CreateDataGridColumnHeaderTemplate(tooltip) });
        return newGridHeaderStyle;
    }

    private static Style BuildFloatCellStyle(string fieldName, string tooltip)
    {
        Style newGridCellStyle = new Style(typeof(DataGridCell));
        newGridCellStyle.Setters.Add(new Setter { Property = DataGridCell.FontSizeProperty, Value = 11.0 });
        newGridCellStyle.Setters.Add(new Setter { Property = DataGridCell.HorizontalContentAlignmentProperty, Value = HorizontalAlignment.Right });
        return newGridCellStyle;
    }

    private static Style BuildCellStyle(string fieldName, string tooltip)
    {
        Style newGridCellStyle = new Style(typeof(DataGridCell));
        newGridCellStyle.Setters.Add(new Setter { Property = DataGridCell.FontSizeProperty, Value = 11.0 });
        newGridCellStyle.Setters.Add(new Setter { Property = DataGridCell.HorizontalContentAlignmentProperty, Value = HorizontalAlignment.Right });


        return newGridCellStyle;
    }

您还必须在代码中创建单元格模板。这将创建xaml文本字符串并使用XamlReader加载它

    private static DataTemplate CreateDataGridColumnHeaderTemplate(string tooltip)
    {
        string str = @"<DataTemplate xmlns='http://schemas.microsoft.com/client/2007'>"
                    + @"<ContentControl   Content='{Binding}'>"
                    + @"<ToolTipService.ToolTip>"
                    + @"<ToolTip Content='" + tooltip + "'>"
                    + @"</ToolTip>"
                    + @"</ToolTipService.ToolTip>"
                    + @"</ContentControl >"
                    + @"</DataTemplate>";
        return (DataTemplate)XamlReader.Load(str);
    }

Answer 2

参考链接：http://blogs.msdn.com/b/scmorris/archive/2008/04/14/defining-silverlight-datagrid-columns-at-runtime.aspx

代码段来自上面的链接:(这是这样做的一种方式。其他方式也在该链接中解释）

的Xaml：

<UserControl.Resources>
<local:DateTimeConverter x:Key="DateConverter" />

<DataTemplate x:Key="myCellTemplate">
    <TextBlock 
        Text="{Binding Birthday, 
        Converter={StaticResource DateConverter}}" 
        Margin="4"/>
</DataTemplate>

<DataTemplate x:Key="myCellEditingTemplate">
    <basics:DatePicker 
        SelectedDate="{Binding Birthday, Mode=TwoWay}" />
</DataTemplate>

代码背后：

DataGridTemplateColumn templateColumn = new DataGridTemplateColumn();
templateColumn.Header = "Birthday";
templateColumn.CellTemplate = (DataTemplate)Resources["myCellTemplate"];
templateColumn.CellEditingTemplate = 
                   (DataTemplate)Resources["myCellEditingTemplate"];
targetDataGrid.Columns.Add(templateColumn);

在运行时添加新列

2 个答案: