0

我正在使用下面的模板来呈现一个半透明的“标签”来显示某些数据。如您所见,显示器是椭圆的(我为此使用 Border.CornerRadius)。我现在正尝试在基于鼠标进入/存在时弹出并收缩标签。这行得通,但问题是,当弹出时,显示的文本显示为矩形,而不是椭圆。此外,似乎文本本身被扩展时,边框不是,导致一些文本被截断. 所以总结一下......我怎样才能让弹出窗口也显示为椭圆而不切断任何文本?

    <DataTemplate x:Key="LabelTmplt" >
    <Border Name="myBorder" BorderThickness="0" CornerRadius="9" RenderTransformOrigin="0.5,0.5" >
        <Border.Background>
            <SolidColorBrush Opacity=".3" Color="Red"/>
        </Border.Background>
        <TextBlock Text="{Binding Path=Text}" Padding="5,1,5,1.5" Margin="0,0,0,0"/>
        <Border.RenderTransform>
            <ScaleTransform />
        </Border.RenderTransform>
        <Border.Triggers>
            <EventTrigger RoutedEvent="MouseEnter">
                <BeginStoryboard>
                    <Storyboard TargetName="myBorder">
                        <DoubleAnimation Duration="0:0:0.25" To="1.5" Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleX)">
                            <DoubleAnimation.EasingFunction>
                                <BackEase Amplitude="2" EasingMode="EaseOut"/>
                            </DoubleAnimation.EasingFunction>
                        </DoubleAnimation>
                        <DoubleAnimation Duration="0:0:0.25" To="1.5" Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleY)">
                            <DoubleAnimation.EasingFunction>
                                <BackEase Amplitude="2" EasingMode="EaseOut"/>
                            </DoubleAnimation.EasingFunction>
                        </DoubleAnimation>
                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger>
            <EventTrigger RoutedEvent="MouseLeave">
                <BeginStoryboard>
                    <Storyboard TargetName="myBorder">
                        <DoubleAnimation Duration="0:0:0.5" To="1" Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleX)">
                            <DoubleAnimation.EasingFunction>
                                <CircleEase EasingMode="EaseOut"/>
                            </DoubleAnimation.EasingFunction>
                        </DoubleAnimation>
                        <DoubleAnimation Duration="0:0:0.5" To="1" Storyboard.TargetProperty="(UIElement.RenderTransform).(ScaleTransform.ScaleY)">
                            <DoubleAnimation.EasingFunction>
                                <CircleEase EasingMode="EaseOut"/>
                            </DoubleAnimation.EasingFunction>
                        </DoubleAnimation>
                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger>                
        </Border.Triggers>
    </Border>
</DataTemplate>
4

1 回答 1

0

如果您不介意文本随着弹出窗口实际缩小和增长,您可以将其放在 ViewBox 中

    <Viewbox Margin="0,0,0,0">
        <TextBlock Text="{Binding Path=Text}" Padding="5,1,5,1.5"/>
    </Viewbox>
于 2012-06-15T17:45:12.357 回答