wpf - 垂直对齐 WPF RadioButton 项目符号并拉伸其内容

Question

我想使用一个跨越整个可用区域的网格作为 RadioButton 的内容，并且我希望 RadioButton 的项目符号垂直对齐。

让网格横跨整个区域很容易，我只需在 RadioButton 上设置 Horizo​​ntalContentAlignment 属性：

<RadioButton HorizontalContentAlignment="Stretch">
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
        </Grid.RowDefinitions>
        <TextBlock>Foo</TextBlock>
        <TextBox Grid.Column="1"/>
        <TextBlock Grid.Row="1">The quick brown fox</TextBlock>
        <TextBox Grid.Row="1" Grid.Column="1"/>
    </Grid>
</RadioButton>

按照 Simon Weaver 对这个旧问题的回答，我可以相对容易地垂直对齐单选按钮的项目符号：

<RadioButton HorizontalContentAlignment="Stretch">
    <TextBlock Grid.IsSharedSizeScope="True">
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="Auto" SharedSizeGroup="A"/>
                <ColumnDefinition Width="*"/>
            </Grid.ColumnDefinitions>
            <TextBlock>Foo</TextBlock>
            <TextBox Grid.Column="1"/>
        </Grid>
        <LineBreak/>
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="Auto" SharedSizeGroup="A"/>
                <ColumnDefinition Width="*"/>
            </Grid.ColumnDefinitions>
            <TextBlock Grid.Row="1">The quick brown fox</TextBlock>
            <TextBox Grid.Row="1" Grid.Column="1"/>
        </Grid>
    </TextBlock>
</RadioButton>

问题是，这样做后，内容不再延伸。

如何获得垂直对齐的项目符号和拉伸网格？

Answer 1

TextBlock 被正确拉伸，但其中的网格没有。大概这就是 TextBlock 的工作方式。

以下是有点hacky，但它的工作原理：

<RadioButton HorizontalContentAlignment="Stretch">
    <TextBlock Name="Text" Grid.IsSharedSizeScope="True">
        <Grid Width="{Binding ElementName=Text, Path=ActualWidth}">

Answer 2

这将适用于视觉效果。您没有列出任何功能要求，所以我不确定在没有一些事件映射的情况下它是否适合您。

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto"/>
        <ColumnDefinition Width="Auto"/>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="Auto"/>
    </Grid.RowDefinitions>
    <RadioButton Grid.Column="0" Grid.RowSpan="2" Content=""/>
    <TextBlock Grid.Column="1">Foo</TextBlock>
    <TextBox Grid.Column="2"/>
    <TextBlock Grid.Row="1" Grid.Column="1">The quick brown fox</TextBlock>
    <TextBox Grid.Row="1" Grid.Column="2"/>
</Grid>