The Datagrid column contains a different type of control in different rows.

In Wpf, can I create a datagrid that in another row contains different types of controls in one column?

For the simplest case: a datagrid with 5 cols, 2 rows, don't care about the first 4 cols, in the 5th col:

  • 1st line: this is a text field
  • Second line: this is a summary.

Thank!

+5
source share
2 answers

You can use the DataGridTemplateColumn in combination with multiple triggers to achieve this functionality.

, DataGrid (string) Control. , , . , xaml , :

XAML:

<Window x:Class="DataGridWithMultipleTypesPerColumn.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Height="350" Width="525">
<Grid>
    <DataGrid ItemsSource="{Binding ControlTypes}"
              AutoGenerateColumns="False">
        <DataGrid.Columns>
        <DataGridTextColumn Header="Control Type" Binding="{Binding}"/>
            <DataGridTemplateColumn Header="Actual Control">
                <DataGridTemplateColumn.CellTemplate>
                    <DataTemplate>
                        <ContentControl>
                            <ContentControl.Style>
                                <Style TargetType="ContentControl">
                                    <Style.Triggers>
                                        <DataTrigger Binding="{Binding}" Value="TextBox">
                                            <Setter Property="ContentTemplate">
                                                <Setter.Value>
                                                    <DataTemplate>
                                                        <TextBox Text="Default Text"/>
                                                    </DataTemplate>
                                                </Setter.Value>
                                            </Setter>
                                        </DataTrigger>
                                        <DataTrigger Binding="{Binding}" Value="CheckBox">
                                            <Setter Property="ContentTemplate">
                                                <Setter.Value>
                                                    <DataTemplate>
                                                        <CheckBox Content="Check Box"/>
                                                    </DataTemplate>
                                                </Setter.Value>
                                            </Setter>
                                        </DataTrigger>
                                        <DataTrigger Binding="{Binding}" Value="Button">
                                            <Setter Property="ContentTemplate">
                                                <Setter.Value>
                                                    <DataTemplate>
                                                        <Button Content="Button"/>
                                                    </DataTemplate>
                                                </Setter.Value>
                                            </Setter>
                                        </DataTrigger>
                                    </Style.Triggers>
                                </Style>
                            </ContentControl.Style>
                        </ContentControl>
                    </DataTemplate>
                </DataGridTemplateColumn.CellTemplate>
            </DataGridTemplateColumn>
        </DataGrid.Columns>
    </DataGrid>
</Grid>

- :

namespace DataGridWithMultipleTypesPerColumn
{
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
            this.DataContext = new ViewModel();
        }
    }

    public class ViewModel
    {
        public ObservableCollection<string> ControlTypes
        {
            get;
            private set;
        }
        public ViewModel()
        {
            ControlTypes = new ObservableCollection<string>() { "Button", "TextBox", "CheckBox" };
        }
    }
}
+6
+2

All Articles