2012-06-15 2 views
0

Я использую шаблон ниже, чтобы визуализировать полупрозрачную «метку» для отображения определенных данных. поскольку вы можете видеть, что дисплей эллиптический (для этого я использую Border.CornerRadius). Теперь я пытаюсь всплывать и сжимать ярлык, когда на основе мыши входит/существует. это работает, но проблема в том, что когда выскочили, отображаемый текст появляется в rectanble, а не elipse .. и, кроме того, кажется, что, в то время как сам текст расширен, граница не является, что приводит к тому, что часть текста обрезается , Итак, чтобы обобщить ... как я могу заставить всплывать, чтобы также показать как elipse и не вырезать какой-либо текст?Пользовательские границы с scaletransform не работает должным образом

<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> 
+0

Почему бы вам не использовать эллипс для этого? – NestorArturo

+0

ellipse не поддерживает прямой контент. Мне нужен текстовый блок для отображения некоторого текста. – mike01010

+1

Может публиковать, когда вы используете этот шаблон. Я просто использовал этот шаблон для управления контентом, и я не вижу проблемы, о которой вы говорите. –

ответ

0

Если вы не возражаете текст фактически сокращается и растет с всплывающего окна вы можете поместить его внутрь ViewBox

<Viewbox Margin="0,0,0,0"> 
     <TextBlock Text="{Binding Path=Text}" Padding="5,1,5,1.5"/> 
    </Viewbox> 
Смежные вопросы