视觉刷怪异的行为

Question

我有一个文本框和一个矩形。文本框内容更改时，矩形会自动更新。我用可视刷子绘制矩形填充。问题是视觉画笔与文本框的实际外观不匹配。我该怎么办。这是我的代码：

    <StackPanel HorizontalAlignment="Center" VerticalAlignment="Center">
        <TextBox Name="txtBox"/>

        <Rectangle Height="{Binding ElementName=txtBox, Path=ActualHeight}"
                   Width="{Binding ElementName=txtBox, Path=ActualWidth}">
            <Rectangle.Fill>
               <VisualBrush Visual="{Binding ElementName=txtBox}"/>
            <Rectangle.Fill>
            <Rectangle.LayoutTransform>
                <ScaleTransform ScaleY="-0.75"/>
            </Rectangle.LayoutTransform>
        </Rectangle>
    </StackPanel>

这里我写了“Visual Brush”，

然后删掉几个字符，看看我得到了什么：

Answer 1

根据评论中的信息对您的Xaml进行一些小改动。问题似乎是TextBlock没有Background，所以我猜VisualBrush只是找到TextBlock的可见部分进行渲染，然后将其拉伸基于Bindings到TextBlock的全长。

当TextBlock有Background="Transparent"时，以下Xaml可以正常工作，但在没有它的情况下重现您的问题

更新：在聊天中，OP发现Width绑定在删除字符时保持TextBox不缩小。因此，删除Width绑定也会修复居中问题。

<StackPanel HorizontalAlignment="Center" VerticalAlignment="Center">
    <TextBox Name="txtBox"/>
    <TextBlock Name="textBlock" Text="{Binding ElementName=txtBox, Path=Text}"
               Background="Transparent"/>
    <Rectangle Height="{Binding ElementName=textBlock, Path=ActualHeight}">
        <Rectangle.Fill>
            <VisualBrush Visual="{Binding ElementName=textBlock}"/>
        </Rectangle.Fill>
        <Rectangle.LayoutTransform>
            <ScaleTransform ScaleY="5"/>
        </Rectangle.LayoutTransform>
    </Rectangle>
</StackPanel>