Silverlight：将按钮控件对齐到Datagrid单元格内部(Silverlight: Align button controls to right inside Datagrid cell)

Silverlight：将按钮控件对齐到Datagrid单元格内部(Silverlight: Align button controls to right inside Datagrid cell)

我已经尝试了一段时间了。 我只是陷入困境，无法通过它。

datagrid单元格中有三个控件。

1：超链接按钮2：清除按钮3：搜索按钮

我需要做的是将“清除”和“打开按钮”对齐到列的右侧。 捕获的是列可调整大小。 我试图给超链接按钮一个固定的宽度它看起来不错，但是当调整列的大小时它会变得混乱。

细胞内容低于风格。

<Style TargetType="controls:HyperlinkClear"> <Setter Property="Background" Value="Transparent"/> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="controls:HyperlinkClear"> <Border BorderThickness="0" Margin="2" BorderBrush="Transparent"> <Border.Resources> <Style x:Name="buttonStyle" TargetType="Button"> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="Button"> <Grid Width="12" Height="12"> <TextBlock Margin="{TemplateBinding Margin}" Text="x"></TextBlock> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style> </Border.Resources> <controlsToolkit:DockPanel Background="Transparent"> <Button Margin="-2,0,0,0" controlsToolkit:DockPanel.Dock="Right" HorizontalAlignment="Right" x:Name="MainSearchButton" Style="{StaticResource ButtonStyle}" IsTabStop="False" Visibility ="{Binding IsRemoveButtonEnabled,Converter={StaticResource BoolToVisibilityConverter},Mode=TwoWay}"> <Image Source="./open.png" Height="14" Width="16" VerticalAlignment="Center"/> </Button> <Button controlsToolkit:DockPanel.Dock="Right" Cursor="hand" Margin="3,-2,0,0" Visibility ="{Binding IsRemoveButtonEnabled,Converter={StaticResource BoolToVisibilityConverter},Mode=TwoWay}" x:Name="RemoveItemButton" HorizontalAlignment="Right" Style="{StaticResource buttonStyle}" IsTabStop="false"/> <HyperlinkButton x:Name="HyperlinkButton" Style="{StaticResource HyperlinkButtonStyle}" Content="{TemplateBinding Content}" /> </controlsToolkit:DockPanel> </Border> </ControlTemplate> </Setter.Value> </Setter> </Style>

目前它看起来像这样。

预期

I have been trying this for a while. I am just stuck and can't get through it.

There are three controls in the datagrid cell.

1: A hyperlink Button 2: A clear button 3: A search button

What i need to do is to align the "clear" and "open button" align to the right of the column. The catch is the column is resizable. I tried to give a fixed width to the hyperlink button it looks good but it gets messy when the column is resized.

The cell content has below style.

<Style TargetType="controls:HyperlinkClear"> <Setter Property="Background" Value="Transparent"/> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="controls:HyperlinkClear"> <Border BorderThickness="0" Margin="2" BorderBrush="Transparent"> <Border.Resources> <Style x:Name="buttonStyle" TargetType="Button"> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="Button"> <Grid Width="12" Height="12"> <TextBlock Margin="{TemplateBinding Margin}" Text="x"></TextBlock> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style> </Border.Resources> <controlsToolkit:DockPanel Background="Transparent"> <Button Margin="-2,0,0,0" controlsToolkit:DockPanel.Dock="Right" HorizontalAlignment="Right" x:Name="MainSearchButton" Style="{StaticResource ButtonStyle}" IsTabStop="False" Visibility ="{Binding IsRemoveButtonEnabled,Converter={StaticResource BoolToVisibilityConverter},Mode=TwoWay}"> <Image Source="./open.png" Height="14" Width="16" VerticalAlignment="Center"/> </Button> <Button controlsToolkit:DockPanel.Dock="Right" Cursor="hand" Margin="3,-2,0,0" Visibility ="{Binding IsRemoveButtonEnabled,Converter={StaticResource BoolToVisibilityConverter},Mode=TwoWay}" x:Name="RemoveItemButton" HorizontalAlignment="Right" Style="{StaticResource buttonStyle}" IsTabStop="false"/> <HyperlinkButton x:Name="HyperlinkButton" Style="{StaticResource HyperlinkButtonStyle}" Content="{TemplateBinding Content}" /> </controlsToolkit:DockPanel> </Border> </ControlTemplate> </Setter.Value> </Setter> </Style>

Currently it looks like this.

Expected

最满意答案

我找到了解决方案。 解决方案是将cellcontent的水平对齐设置为“Stretch”。

覆盖列的BindCellContent方法。

public override void BindCellContent(FrameworkElement cellContent, DataGridRow row) { var hyperlinkButton = (HyperlinkClear)cellContent; hyperlinkButton.HorizontalAlignment = HorizontalAlignment.Stretch; }

I found the solution. The solution is to set the cellcontent's horizontal alignment to "Stretch".

Override the BindCellContent Method of the column.

public override void BindCellContent(FrameworkElement cellContent, DataGridRow row) { var hyperlinkButton = (HyperlinkClear)cellContent; hyperlinkButton.HorizontalAlignment = HorizontalAlignment.Stretch; }