CODEWITHSUNDEEP
wpfxaml
Mister 832
Mister 832

Reputation: 1221

Format Margin / Padding in DataGrid ColumnHeader

I want to place a canvas in the columnheader of a datagrid, which is aligned to the far left of the colum, i.e. no margin between the column and the control. However, there is always some space between the column and the control. I'm wondering how I get rid of the small space shown yellow in the picture? I also wonder, why none of the background colors (ItemsControl = LightBlue, Canvas = LemonChiffon) are visible, but I guess that is the same reason.

enter image description here

The desired design looks like this:

enter image description here

Here is my code:

<Grid DataContext="{StaticResource vmJp}">
    <DataGrid  x:Name="dgProj" AutoGenerateColumns="False" IsReadOnly="True"  CanUserAddRows="False" Margin="10" ItemsSource="{Binding Baustellen}" BorderThickness="0" HeadersVisibility="Column" Padding="0">
        <DataGrid.Columns>
         ....

            <DataGridTemplateColumn Width="1*" x:Name="coPlanung">
                <DataGridTemplateColumn.HeaderTemplate>
                    <DataTemplate>
                        <ItemsControl ItemsSource="{Binding DataContext.Monate, ElementName=dgProj}" Margin="0" VerticalAlignment="Center" Background="LightBlue">
                            <ItemsControl.ItemContainerStyle>
                                <Style TargetType="ContentPresenter">
                                    <Setter Property="Canvas.Left">
                                        <Setter.Value>
                                            <MultiBinding Converter="{StaticResource d2x}">
                                                <Binding Path="Date" Mode="OneWay" />
                                                <Binding Path="ActualWidth" ElementName="coPlanung" Mode="OneWay"/>
                                            </MultiBinding>
                                        </Setter.Value>
                                    </Setter>
                                </Style>
                            </ItemsControl.ItemContainerStyle>
                            <ItemsControl.ItemsPanel>
                                <ItemsPanelTemplate>
                                    <Canvas Width="{Binding ActualWidth, ElementName=coPlanung}" Margin="0" Background="LemonChiffon"/>
                                </ItemsPanelTemplate>
                            </ItemsControl.ItemsPanel>
                            <ItemsControl.ItemTemplate>
                                <DataTemplate>
                                    <!--Monthnames-->
                                    <TextBox Text="{Binding Path=Date, StringFormat={}{0:MMM-yyyy}, Mode=OneWay}" HorizontalAlignment="Center" VerticalAlignment="Center" Background="Transparent" Margin="0">
                                        <TextBox.Width>
                                            <MultiBinding Converter="{StaticResource d2b}">
                                                <Binding Path="Date" Mode="OneWay" />
                                                <Binding Path="ActualWidth" ElementName="coPlanung" Mode="OneWay"/>
                                            </MultiBinding>
                                        </TextBox.Width>
                                    </TextBox>
                                </DataTemplate>
                            </ItemsControl.ItemTemplate>
                        </ItemsControl>
                    </DataTemplate>
                </DataGridTemplateColumn.HeaderTemplate>

Setting the margin to -5 doesn't show the desired design:

enter image description here

Code

<DataGridTemplateColumn x:Name="coPlanung">
    <DataGridTemplateColumn.HeaderStyle>
        <Style TargetType="DataGridColumnHeader">
            <Setter Property="Padding" Value="0"/>
            <Setter Property="Margin" Value="-5"/>
        </Style>
    </DataGridTemplateColumn.HeaderStyle>
    <DataGridTemplateColumn.HeaderTemplate>
    ...

Upvotes: 2

Views: 7263

Answers (2)

mm8
mm8

Reputation: 169400

I'm wondering how I get rid of the small space shown yellow in the picture?

You could set the HeaderStyle of the DataGridTemplateColumn to a DataGridColumnHeader style with negative margins:

<DataGridTemplateColumn x:Name="coPlanung">
    <DataGridTemplateColumn.HeaderStyle>
        <Style TargetType="DataGridColumnHeader">
            <Setter Property="Padding" Value="0"/>
            <Setter Property="Margin" Value="-5"/>
        </Style>
    </DataGridTemplateColumn.HeaderStyle>
    <DataGridTemplateColumn.HeaderTemplate>
    ...

I also wonder, why none of the background colors (ItemsControl = LightBlue, Canvas = LemonChiffon) are visible, but I guess that is the same reason.

Try to specify a Height for the Canvas. The ItemsControl's background is "hidden" behind the ItemsPanel.

Edit: As you have already noticed you could also try set the Margin of the ContentPresenter:

<Style TargetType="ContentPresenter">                                        
    <Setter Property="Margin" Value="-5"/>
</Style>

Upvotes: 3

Mighty Badaboom
Mighty Badaboom

Reputation: 6155

Try to set RowHeaderWidth="0", it's a DataGrid property.

//edit Maybe something else is interfering. Here is a link of the most important properties to style your DataGrid: Styling Microsoft’s WPF datagrid

And here is a short example

<DataGrid ItemsSource="{Binding ViewModels}" />

without

<DataGrid ItemsSource="{Binding ViewModels}"
          RowHeaderWidth="0"/>

with

As you can see the RowHeader is gone.

Upvotes: 0

Related Questions