2017-01-01 3 views
1

Ресурсов:изменение цвета TextBlock внутри границы - МОФ

<Window.Resources> 
    <Style x:Key="blue"> 
     <Style.Triggers> 
      <EventTrigger RoutedEvent="Border.MouseEnter"> 
       <BeginStoryboard> 
        <Storyboard TargetProperty="(Border.Background).(SolidColorBrush.Color)"> 
         <ColorAnimation To="#ffffff" Duration="0:0:.3"/> 
        </Storyboard> 
       </BeginStoryboard> 
      </EventTrigger> 


      <EventTrigger RoutedEvent="Border.MouseLeave"> 
       <BeginStoryboard> 
        <Storyboard TargetProperty="(Border.Background).(SolidColorBrush.Color)"> 
         <ColorAnimation To="#FF0080FF" Duration="0:0:.3"/> 
        </Storyboard> 
       </BeginStoryboard> 
      </EventTrigger> 
     </Style.Triggers> 
    </Style> 
</Window.Resources> 

Вид:

<Border Style="{StaticResource blue}" Cursor="Hand" BorderBrush="#FF0080FF" BorderThickness="1" HorizontalAlignment="Left" Height="43" Margin="85,266,0,0" VerticalAlignment="Top" Width="157" CornerRadius="30" Panel.ZIndex="10" Background="#FF0080FF"> 
     <TextBlock x:Name="textBlock" TextWrapping="Wrap" TextAlignment="Center" FontSize="28" Foreground="White" Margin="0,5,0,4"><Run FlowDirection="RightToLeft" Text="hello"/></TextBlock> 
    </Border> 

при наведении указателя мыши на Border, то Border.Background изменения в белый но TextBlock.Foreground цвета белый тоже.

Как я могу изменить их одновременно?

+0

Будет ли это Border/TextBlock работать как кнопки? – GeorgeChond

+0

_____yes_______ – amirhossein

ответ

0

Как указано в комментариях Border и TextBlock собираются использовать в качестве кнопки.

Для этой цели, вместо того, чтобы создать 2 аналогичные Styles для Border и TextBlock предпочтительнее использовать Button контроль и изменить его Style и Template свойства, чтобы изменить границы и текст в случае необходимости.

Ресурсы:

 <Style x:Key="FocusVisual"> 
     <Setter Property="Control.Template"> 
      <Setter.Value> 
       <ControlTemplate> 
        <Rectangle Margin="2" SnapsToDevicePixels="true" Stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" StrokeThickness="1" StrokeDashArray="1 2"/> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 
    <Style x:Key="ButtonStyle1" TargetType="{x:Type Button}"> 
     <Setter Property="FocusVisualStyle" Value="{StaticResource FocusVisual}"/> 

     <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/> 
     <Setter Property="BorderThickness" Value="1"/> 
     <Setter Property="HorizontalContentAlignment" Value="Center"/> 
     <Setter Property="VerticalContentAlignment" Value="Center"/> 
     <Setter Property="Padding" Value="1"/> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="{x:Type Button}"> 
        <Border x:Name="border" Cursor="Hand" Width="{TemplateBinding Width}" Height="{TemplateBinding Height}" BorderBrush="#FF0080FF" BorderThickness="1" HorizontalAlignment="Left" VerticalAlignment="Top" CornerRadius="30" Panel.ZIndex="10" Background="#FF0080FF"> 
         <ContentPresenter x:Name="contentPresenter" Focusable="False" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/> 
        </Border> 
        <ControlTemplate.Triggers> 


         <EventTrigger SourceName="border" RoutedEvent="MouseEnter"> 
          <BeginStoryboard> 
           <Storyboard TargetName="border" TargetProperty="(Background).(SolidColorBrush.Color)"> 
            <ColorAnimation To="#ffffff" Duration="0:0:.3"/> 
           </Storyboard> 

          </BeginStoryboard> 
          <BeginStoryboard> 
           <Storyboard TargetProperty="Foreground.(SolidColorBrush.Color)"> 
            <ColorAnimation To="#FF0080FF" Duration="0:0:.3"/> 
           </Storyboard> 
          </BeginStoryboard> 
         </EventTrigger> 
         <EventTrigger SourceName="border" RoutedEvent="MouseLeave"> 
          <BeginStoryboard> 
           <Storyboard TargetName="border" TargetProperty="(Background).(SolidColorBrush.Color)"> 
            <ColorAnimation To="#FF0080FF" Duration="0:0:.3"/> 
           </Storyboard> 
          </BeginStoryboard> 
          <BeginStoryboard> 
           <Storyboard TargetProperty="Foreground.(SolidColorBrush.Color)"> 
            <ColorAnimation To="#ffffff" Duration="0:0:.3"/> 
           </Storyboard> 
          </BeginStoryboard> 
         </EventTrigger> 
        </ControlTemplate.Triggers> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 

Кнопка:

 <Button Foreground="White" FontSize="28" Width="157" Height="43" Content="hello" Style="{DynamicResource ButtonStyle1}"></Button> 
+0

Wow! Большое спасибо!!! – amirhossein

0

Стиль может устанавливать только свойства элемента, к которому он применяется, что означает, что стиль границы не может установить свойство Foreground для TextBlock.

Вы можете задать другой стиль для TextBlock, хотя:

<Border x:Name="border" Style="{StaticResource blue}" Cursor="Hand" BorderBrush="#FF0080FF" BorderThickness="1" HorizontalAlignment="Left" Height="43" Margin="85,266,0,0" VerticalAlignment="Top" Width="157" CornerRadius="30" Panel.ZIndex="10" Background="#FF0080FF"> 
    <TextBlock x:Name="textBlock" TextWrapping="Wrap" TextAlignment="Center" FontSize="28" Margin="0,5,0,4"><Run FlowDirection="RightToLeft" Text="hello"/> 
     <TextBlock.Style> 
      <Style TargetType="TextBlock"> 
       <Setter Property="Foreground" Value="White" /> 
       <Style.Triggers> 
        <DataTrigger Binding="{Binding IsMouseOver, ElementName=border}" Value="True"> 
         <DataTrigger.EnterActions> 
          <BeginStoryboard> 
           <Storyboard TargetProperty="(TextBlock.Foreground).(SolidColorBrush.Color)"> 
            <ColorAnimation To="#FF0080FF" Duration="0:0:.3"/> 
           </Storyboard> 
          </BeginStoryboard> 
         </DataTrigger.EnterActions> 
         <DataTrigger.ExitActions> 
          <BeginStoryboard> 
           <Storyboard TargetProperty="(TextBlock.Foreground).(SolidColorBrush.Color)"> 
            <ColorAnimation To="#FFFFFF" Duration="0:0:.3"/> 
           </Storyboard> 
          </BeginStoryboard> 
         </DataTrigger.ExitActions> 
        </DataTrigger> 
       </Style.Triggers> 
      </Style> 
     </TextBlock.Style> 
    </TextBlock> 
</Border> 
+0

большое спасибо – amirhossein

Смежные вопросы