Question

我想构建一个自定义控件，其中可扩展行添加到网格中。为了匹配可扩展行的列，我添加了另一个网格作为扩展器头和内容。但是，列略微向右倾斜（见图）。我认为这是因为标题大小？

如何访问togglebutton代码的宽度，以便我可以相应地更改columndefinition？

谢谢！

Answer 1

有几种方法可以解决这个问题。

一个人会试图通过查看the control template并补偿来自己找到togglebutton的宽度 - 但这是不可靠的，因为模板可以在.NET版本（如果我没记错的话，操作系统）中发生变化，并且无论如何要实施凌乱。

第二种方法是尝试以编程方式找到宽度并以此方式进行补偿，但仍需要深入控制模板（参见上述问题）

第三是让布局引擎为你解决问题。您可以在第2-4列的sharing the column width上执行此操作，并将第1列的宽度设置为＆＃34; *＆＃34;。最初这样做会产生不希望的结果，因为Expander Header模板无法设置HorizontalContentAlignment。

由于存在上述风险，您可以通过代码隐藏在模板中挖掘来解决问题，as described here但它仍然不完美。

看起来某处有边框或边距。让我们将扩展器的BorderThickness设置为0。

UGH！更好 - （空白消失了），但我们的网格（红色和黑色边框）和.NET 4.5中的绿色之间仍然存在差距。我无法在合理的时间内找到这个间隙的来源，所以我只需将扩展器的边距设置为0,0，-1,0。根据内容的不同，这可能需要在扩展器内部进行补偿，并且会导致CSS黑客的内存受到抑制（XAML被认为更好，不是吗？）

结束结果：

XAML：

<Window x:Class="Sandbox.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Height="350" Width="800" SnapsToDevicePixels="True">
<Window.Resources>
    <DataTemplate x:Key="StretchedHeaderTemplate">
        <Border HorizontalAlignment="Stretch" Loaded="Border_Loaded">
            <ContentPresenter Content="{TemplateBinding Content}"/>
        </Border>
    </DataTemplate>
</Window.Resources>
<Grid Grid.IsSharedSizeScope="True" Margin="15">
    <Grid.ColumnDefinitions>
        <ColumnDefinition x:Name="MainLeft"/>
        <ColumnDefinition x:Name="MainRight"/>
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition/>
        <RowDefinition/>
    </Grid.RowDefinitions>
    <Grid Grid.Column="0" Background="AliceBlue">
        <Grid.ColumnDefinitions>
            <ColumnDefinition/>
            <ColumnDefinition Width="100" SharedSizeGroup="Col2"/>
            <ColumnDefinition Width="100" SharedSizeGroup="Col3"/>
            <ColumnDefinition Width="100" SharedSizeGroup="Col4"/>
        </Grid.ColumnDefinitions>
        <Border Grid.Column="0" BorderBrush="Black" BorderThickness="1">
            <TextBlock>Col1</TextBlock>
        </Border>
        <Border Grid.Column="1" BorderBrush="Black" BorderThickness="1">
            <TextBlock>Col2</TextBlock>
        </Border>
        <Border Grid.Column="2" BorderBrush="Black" BorderThickness="1">
            <TextBlock>Col3</TextBlock>
        </Border>
        <Border Grid.Column="3" BorderBrush="Black" BorderThickness="1">
            <TextBlock>Col4</TextBlock>
        </Border>
    </Grid>
    <Grid Grid.Column="1">
        <Grid.ColumnDefinitions>
            <ColumnDefinition/>
            <ColumnDefinition/>
            <ColumnDefinition/>
            <ColumnDefinition/>
        </Grid.ColumnDefinitions>
        <TextBlock Grid.Column="0" HorizontalAlignment="Center">January</TextBlock>
        <TextBlock Grid.Column="1" HorizontalAlignment="Center">February</TextBlock>
        <TextBlock Grid.Column="2" HorizontalAlignment="Center">March</TextBlock>
    </Grid>
    <StackPanel Grid.Column="0" Grid.Row="1">
        <Expander HeaderTemplate="{StaticResource StretchedHeaderTemplate}" Background="LightGreen" BorderThickness="0" Margin="0,0,-1,0">
            <Expander.Header>
                <Grid HorizontalAlignment="Stretch" Background="LightCoral">
                    <Grid Grid.Column="0">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition/>
                            <ColumnDefinition SharedSizeGroup="Col2"/>
                            <ColumnDefinition SharedSizeGroup="Col3"/>
                            <ColumnDefinition SharedSizeGroup="Col4"/>
                        </Grid.ColumnDefinitions>
                        <Border Grid.Column="0" BorderBrush="Black" BorderThickness="1">
                            <TextBlock>Record1</TextBlock>
                        </Border>
                        <Border Grid.Column="1" BorderBrush="Black" BorderThickness="1">
                            <TextBlock>02.05.2016</TextBlock>
                        </Border>
                        <Border Grid.Column="2" BorderBrush="Black" BorderThickness="1">
                            <TextBlock>05.05.2017</TextBlock>
                        </Border>
                        <Border Grid.Column="3" BorderBrush="Black" BorderThickness="1">
                            <TextBlock>340</TextBlock>
                        </Border>
                    </Grid>
                </Grid>
            </Expander.Header>
        </Expander>
    </StackPanel>
</Grid>

代码背后：

/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
    }

    private void Border_Loaded(object sender, RoutedEventArgs e)
    {
        Border root = (Border)sender;
        ContentPresenter presenter = (ContentPresenter)root.TemplatedParent;
        presenter.HorizontalAlignment = HorizontalAlignment.Stretch;
    }
}

结论：这样做有效，但如果您发现其中的任何一个太乱，您可能需要考虑覆盖Expander的控件模板。

如何在代码隐藏

1 个答案: