MouseOver狀態的邊框元素

Question

我在我的頁面上有一個邊框元素，其中包含網格中包含的一些TextBlock元素，例如， （簡體）：

<Border Style="{StaticResource borderStyle}"> 
    <Grid Background="Transparent"> 
    <Grid.RowDefinitions> 
     <RowDefinition/> 
    </Grid.RowDefinitions> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition/> 
     <ColumnDefinition/> 
    </Grid.ColumnDefinitions> 
    <TextBlock Text="Something" Grid.Column="0" Grid.Row="0" /> 
    <TextBlock Text="Something else" Grid.Column="1" Grid.Row="0" /> 
    </Grid> 
</Border> 

我已經定義了以下樣式：

<Style x:Key="borderStyle" TargetType="Border"> 
    <Setter Property="CornerRadius" Value="0,0,15,15"/> 
    <Setter Property="Background" Value="Black"/> 
    <Setter Property="Opacity" Value="0.6"/> 
</Style> 

我將如何添加一個VisualStateGroup（或類似的東西）的風格來改變鼠標懸停的透明度？我似乎無法得到它爲邊界元素工作，是否有這個原因？

Answer 1

VSM將在ControlTemplate中單獨工作。那就是原因。那裏沒有模板，這是你無法工作的原因。

或者，您可以使用EventTriggers。如下所示。對於

<Grid x:Name="LayoutRoot" Background="White"> 
     <VisualStateManager.VisualStateGroups> 
      <VisualStateGroup x:Name="VisualStateGroup"> 
       <VisualStateGroup.Transitions> 
        <VisualTransition GeneratedDuration="0"> 
         <Storyboard/> 
        </VisualTransition> 
       </VisualStateGroup.Transitions> 
       <VisualState x:Name="Normal"/> 
       <VisualState x:Name="MouseOverState"> 
        <Storyboard> 
         <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(Border.BorderThickness)" Storyboard.TargetName="border"> 
          <DiscreteObjectKeyFrame KeyTime="0"> 
           <DiscreteObjectKeyFrame.Value> 
            <Thickness>3</Thickness> 
           </DiscreteObjectKeyFrame.Value> 
          </DiscreteObjectKeyFrame> 
         </ObjectAnimationUsingKeyFrames> 
        </Storyboard> 
       </VisualState> 
      </VisualStateGroup> 
     </VisualStateManager.VisualStateGroups> 
     <Border x:Name="border" BorderBrush="Black" BorderThickness="1" Height="143" Margin="164,79,191,0" VerticalAlignment="Top"> 
      <i:Interaction.Triggers> 
       <i:EventTrigger EventName="MouseEnter"> 
        <ei:GoToStateAction StateName="MouseOverState" TargetObject="{Binding ElementName=userControl}"/> 
       </i:EventTrigger> 
      </i:Interaction.Triggers> 
     </Border> 
    </Grid>