Define a custom WPF control with inheritance

Question

I have a simple problem I guess. Basically I have a WPF app, where I use DataGrid control a lot. And everytime I style it the same way (just the data, number of rows and columns are different). So I thought about creating my own control DataGridMatrix which would fill my needs.

The code I wrote for it is as follows:

<UserControl x:Class="StateMachines.UI.Controls.DataGridMatrix"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             mc:Ignorable="d">
    <DataGrid Width="450"
              RenderTransformOrigin="0.657,1.249"
              ItemsSource="{Binding Path=Logic.DefaultView}" ColumnWidth="*"
              CanUserReorderColumns="False"
              CanUserResizeColumns="False" CanUserAddRows="False" CanUserSortColumns="False"
              CanUserResizeRows="False" Grid.ColumnSpan="1">
        <DataGrid.ColumnHeaderStyle>
            <Style TargetType="{x:Type DataGridColumnHeader}"
                   BasedOn="{StaticResource MetroDataGridColumnHeader}">
                <Setter Property="HorizontalContentAlignment" Value="Center" />
            </Style>
        </DataGrid.ColumnHeaderStyle>
        <DataGrid.RowHeaderStyle>
            <Style TargetType="{x:Type DataGridRowHeader}"
                   BasedOn="{StaticResource MetroDataGridRowHeader}">
                <Setter Property="HorizontalContentAlignment" Value="Center" />
            </Style>
        </DataGrid.RowHeaderStyle>
        <DataGrid.CellStyle>
            <Style TargetType="{x:Type DataGridCell}" BasedOn="{StaticResource MetroDataGridCell}">
                <Setter Property="HorizontalContentAlignment" Value="Center" />
                <Style.Triggers>
                    <DataTrigger
                        Binding="{Binding RelativeSource={x:Static RelativeSource.Self}, Path=Column.DisplayIndex}"
                        Value="0">
                        <Setter Property="Block.FontWeight" Value="Bold" />
                    </DataTrigger>
                </Style.Triggers>
            </Style>
        </DataGrid.CellStyle>
    </DataGrid>
</UserControl>

So as you can see, I only style it, I don't put any data in it (in XAML). The problem is I can of course put this control in my MainWindow.xaml like this:

<controls:DataGridMatrix x:Name="DataGridTransition"/>

But then, if I want f.e change the position (in grid, f.e I would like it to be Grid.ColumnSpan="2" instead of Grid.ColumnSpan="1") I can't do that, cuz theDataGridis in my control, and my control isn't derived fromDataGrid` itself (I guess, if it would be derived, then I could do that, like in normal classes, right?).

So finally my question would be: Is there a way to inherit from a standard XAML control in my own UserControl and just style it differently (like here, in my code I would omit the <DataGrid> tag and I would place its arguments in <UserControl> tag + the other things like DataGrid.ColumnHeaderStyle would be placed right below the <UserControl>)?

Instead of making a custom control, you could try making a Style based on the DataGrid. That way, you could use the style, and still alter some properties of the grid. — Lupu Silviu
– Lupu Silviu, Commented Jul 4, 2018 at 13:31
@LupuSilviu So if I wanted to have 3 DataGrids, I would just do 3x <DataGrid></DataGrid> and then somewhere above them I define I style that affects all the DataGrids? @mm8 -> How would I create it? I mean Add->New Item and then what? — minecraftplayer1234
– minecraftplayer1234, Commented Jul 4, 2018 at 13:37
@Frynio: Just remove the <UserControl> root element and inherit the partial class from DataGrid. See my answer. — mm8
– mm8, Commented Jul 4, 2018 at 13:48

mm8 · Accepted Answer · 2018-07-04 13:40:39Z

3

Create a custom DataGrid instead of a custom UserControl, i.e remove the <UserControl> root element from your XAML file (DataGridMatrix.xaml) so it looks like this:

<DataGrid    x:Class="WpfApp2.DataGridMatrix"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             Width="450"
              RenderTransformOrigin="0.657,1.249"
              ItemsSource="{Binding Path=Logic.DefaultView}" ColumnWidth="*"
              CanUserReorderColumns="False"
              CanUserResizeColumns="False" CanUserAddRows="False" CanUserSortColumns="False"
              CanUserResizeRows="False" Grid.ColumnSpan="1">
    <DataGrid.ColumnHeaderStyle>
        <Style TargetType="{x:Type DataGridColumnHeader}"
                   BasedOn="{StaticResource MetroDataGridColumnHeader}">
            <Setter Property="HorizontalContentAlignment" Value="Center" />
        </Style>
    </DataGrid.ColumnHeaderStyle>
    <DataGrid.RowHeaderStyle>
        <Style TargetType="{x:Type DataGridRowHeader}"
                   BasedOn="{StaticResource MetroDataGridRowHeader}">
            <Setter Property="HorizontalContentAlignment" Value="Center" />
        </Style>
    </DataGrid.RowHeaderStyle>
    <DataGrid.CellStyle>
        <Style TargetType="{x:Type DataGridCell}" BasedOn="{StaticResource MetroDataGridCell}">
            <Setter Property="HorizontalContentAlignment" Value="Center" />
            <Style.Triggers>
                <DataTrigger
                        Binding="{Binding RelativeSource={x:Static RelativeSource.Self}, Path=Column.DisplayIndex}"
                        Value="0">
                    <Setter Property="Block.FontWeight" Value="Bold" />
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </DataGrid.CellStyle>
</DataGrid>

...and change the base class in the code-behind (DataGridMatrix.xaml.cs) from UserControl to DataGrid:

public partial class DataGridMatrix : DataGrid
{
    public DataGridMatrix()
    {
        InitializeComponent();
    }
}

answered Jul 4, 2018 at 13:40

mm8

170k10 gold badges70 silver badges102 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

minecraftplayer1234 Over a year ago

Mhmm. And if I don't have the *.xaml.cs file? Cuz I did Add->New Item->WPF Control? Should I add it manually?

mm8 Over a year ago

You should have a DataGridMatrix.xaml.cs file if you have a x:Class attribute in your XAML...which you have in the sample markup you have posted.

minecraftplayer1234 Over a year ago

Gee, I am so stupid. Didn't notice the arrow near the file name. Anyway, thank you, I think this will work for me, I can't check right know, cuz I am nowhere near my computer, but definitely will accept your answer. Thank you once more

Collectives™ on Stack Overflow

Define a custom WPF control with inheritance

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related