【发布时间】:2011-03-01 09:11:46
【问题描述】:
我在 DataGrid 的列的标题中放置了一个带有图像的按钮。单元格模板也只是一个带有图像的简单按钮。
<my:DataGridTemplateColumn>
<my:DataGridTemplateColumn.HeaderTemplate>
<DataTemplate>
<Button ToolTip="Add New Template" Name="AddNewTemplate" Click="AddNewTemplate_Click">
<Image Source="../Resources/add.png"/>
</Button>
</DataTemplate>
</my:DataGridTemplateColumn.HeaderTemplate>
<my:DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<Button ToolTip="Edit Template" Name="EditTemplate" Click="EditTemplate_Click" Tag="{Binding}">
<Image Source="../Resources/pencil.png"/>
</Button>
</DataTemplate>
</my:DataGridTemplateColumn.CellTemplate>
</my:DataGridTemplateColumn>
渲染时,标题的右侧只有大约 10-15 像素的填充,这会导致单元格以该宽度明显渲染,从而使单元格按钮的两侧都有空白空间。作为一个像素完美主义者,这让我很恼火。我最初认为它是排序时显示的箭头的空间,但我在整个 DataGrid 和列上都禁用了排序。
这是一张图片: http://img716.imageshack.us/img716/1787/68487749.png
我假设这是从按钮的父元素中填充的。有谁知道消除它的方法吗?
见:
解决方案:
<my:DataGrid.Resources>
<Style x:Key="addHeader" TargetType="{x:Type myp:DataGridColumnHeader}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type myp:DataGridColumnHeader}">
<Button ToolTip="Add New Template" Name="AddNewTemplate" Click="AddNewTemplate_Click" Margin="4">
<Image Source="../Resources/add.png"/>
</Button>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</my:DataGrid.Resources>
<my:DataGrid.Columns>
<my:DataGridTemplateColumn HeaderStyle="{StaticResource addHeader}">
<my:DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<Button ToolTip="Edit Template" Name="EditTemplate" Click="EditTemplate_Click" Tag="{Binding}">
<Image Source="../Resources/pencil.png"/>
</Button>
</DataTemplate>
</my:DataGridTemplateColumn.CellTemplate>
</my:DataGridTemplateColumn>
</my:DataGrid.Columns>
【问题讨论】: