Question

我试图在旋转TextBlock后限制第一列高度与第二列匹配。

我有以下XAML：

<Viewbox>
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition />
            <ColumnDefinition />
        </Grid.ColumnDefinitions>

        <TextBlock
            Grid.Column='1'
            Text='Ubuntu'
            FontFamily='Ubuntu'
            FontSize='36' />

        <TextBlock
            Grid.Column='0'
            Text='Linux'
            FontFamily='Ubuntu'
            FontSize='36'>
            <TextBlock.LayoutTransform>
                <RotateTransform
                    Angle='-90' />
            </TextBlock.LayoutTransform>
        </TextBlock>

    </Grid>
</Viewbox>

将呈现以下内容：

Actual output

但是，我正在尝试获取此输出，以便左列的高度将适应第二列的高度：

Desired output

您是否知道如何使用声明式XAML进行纯粹的操作？ IE浏览器。没有绑定到高度或代码隐藏。我也不想指定控件的任何边距。

感谢。

Answer 1

您的代码中的轻微修改可以为您提供所需的内容：

首先：您的更新代码

<Grid >
            <Grid.ColumnDefinitions>
                <ColumnDefinition />
                <ColumnDefinition />
            </Grid.ColumnDefinitions>

            <TextBlock x:Name="UbuntuBox"
            Grid.Column='1'
            Text='Ubuntu'
            FontFamily='Ubuntu'
            FontSize='36' />

            <TextBlock Width="{Binding ElementName=UbuntuBox, Path=Height}"
            Grid.Column='0'
            Text='Linux'
            FontFamily='Ubuntu'
            >
            <TextBlock.LayoutTransform>
                <RotateTransform
                    Angle='-90' />
            </TextBlock.LayoutTransform>
            </TextBlock>

        </Grid>

第二：解释

您的TextBlock显示“Linux”必须与Ubuntu TextBlock相关联。在这种情况下，其Width必须与Ubuntu的Height相同，因此我添加了以下内容：Width="{Binding ElementName=UbuntuBox, Path=Height}"
您不能拥有符合此给定宽度的TextBlock FontSize {{1}}。删除它将使其保持默认状态，如果你想要

这就是你所需要的！没有硬编码添加的东西=）

Answer 2

这是我能想到的最好的。坏的部分是硬编码的行定义，但是因为你已经在视图框中有根网格，它的相对性，所以它应该不是一个大问题。

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition />
        <ColumnDefinition />
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="36"/>
    </Grid.RowDefinitions>
    <TextBlock
        Grid.Column='1'
        Text='Ubuntu'
        FontFamily='Ubuntu'
        FontSize='36' />

    <Viewbox Grid.Column='0'>
        <TextBlock
            Text='Linux'
            FontFamily='Ubuntu'
            FontSize='36'>
            <TextBlock.LayoutTransform>
                <RotateTransform
                    Angle='-90' />
            </TextBlock.LayoutTransform>
        </TextBlock>
    </Viewbox>
</Grid>

限制旋转的TextBlock大小

2 个答案: