二傳手的內部ContentPresenter

Question

元素我有一個ControlTemplate這樣的：

<ControlTemplate TargetType="Button"> 
    <Grid Background="Transparent"> 
     <ContentPresenter x:Name="contentPresenter" HorizontalAlignment="Center" 
          VerticalAlignment="Center" /> 
    </Grid> 
    <ControlTemplate.Triggers> 
     <Trigger Property="IsMouseOver" Value="True"> 
      <Setter Property="Effect"> 
       <Setter.Value> 
        <DropShadowEffect BlurRadius="20" Color="Black" ShadowDepth="0" 
             Opacity="0.5" /> 
       </Setter.Value> 
      </Setter> 
      <Setter Property="FontWeight" Value="SemiBold"/> 
     </Trigger> 
     <Trigger Property="IsPressed" Value="True"> 
      <Setter Property="Effect"> 
       <Setter.Value> 
        <DropShadowEffect BlurRadius="20" Color="Black" ShadowDepth="0" Opacity="1" /> 
       </Setter.Value> 
      </Setter> 
     </Trigger> 
     <Trigger Property="IsEnabled" Value="False"> 
      <Setter Property="Foreground" Value="Gray" /> 
     </Trigger> 
    </ControlTemplate.Triggers> 
</ControlTemplate> 

當IsMouseOver屬性更改爲True，我要contentPresenter中的所有圖像有DropShadowEffect，而不是按鈕本身。
我嘗試將setter屬性更改爲Image.Effect，但它不起作用。
我該怎麼做？

這是我的按鈕看起來像當鼠標懸停：
，這是它的外觀時，它不是：
正如你可以看到，無論是圖像和TextBlock的越來越陰影效果的影響。但我只想要圖像來獲取它。

Answer 1

你可以採用Sinatr推薦的樣式並將其放入按鈕控制模板的ControlTemplate.Resources部分。這是一個適合我的例子。它也處理IsPressed事件，在此期間我假設您要調整圖像的陰影效果：

<ControlTemplate x:Key="BtnTemplate" TargetType="{x:Type Button}"> 
    <Grid Background="Transparent"> 
     <ContentPresenter x:Name="contentPresenter" HorizontalAlignment="Center" VerticalAlignment="Center"/> 
    </Grid> 

    <ControlTemplate.Triggers> 
     <Trigger Property="IsMouseOver" Value="True"> 
      <Setter Property="FontWeight" Value="SemiBold"/> 
     </Trigger> 
     <Trigger Property="IsEnabled" Value="False"> 
      <Setter Property="Foreground" Value="Gray" /> 
     </Trigger> 
    </ControlTemplate.Triggers> 

    <ControlTemplate.Resources> 
     <Style TargetType="{x:Type Image}"> 
      <Style.Triggers> 
       <DataTrigger Binding="{Binding IsMouseOver, RelativeSource={RelativeSource AncestorType=Button}}" Value="True"> 
        <DataTrigger.Setters> 
         <Setter Property="Effect"> 
          <Setter.Value> 
           <DropShadowEffect BlurRadius="20" Color="Black" ShadowDepth="0" Opacity="0.5"/> 
          </Setter.Value> 
         </Setter> 
        </DataTrigger.Setters> 
       </DataTrigger> 

       <DataTrigger Binding="{Binding IsPressed, RelativeSource={RelativeSource AncestorType=Button}}" Value="True"> 
        <DataTrigger.Setters> 
         <Setter Property="Effect"> 
          <Setter.Value> 
           <DropShadowEffect BlurRadius="20" Color="Black" ShadowDepth="0" Opacity="1" /> 
          </Setter.Value> 
         </Setter> 
        </DataTrigger.Setters> 
       </DataTrigger> 
      </Style.Triggers> 
     </Style> 
    </ControlTemplate.Resources> 
</ControlTemplate> 

Answer 2

你並不真的需要定義Button模板，而創建一個Image風格

<Style x:Key="style" 
     TargetType="Image"> 
    <Style.Triggers> 
     <DataTrigger Binding="{Binding IsMouseOver, RelativeSource={RelativeSource AncestorType=Button}}" 
        Value="True"> 
      <DataTrigger.Setters> 
       <Setter Property="Effect"> 
        <Setter.Value> 
         <DropShadowEffect BlurRadius="20" 
              Color="Black" 
              ShadowDepth="0" 
              Opacity="0.5" /> 
        </Setter.Value> 
       </Setter> 
      </DataTrigger.Setters> 
     </DataTrigger> 
    </Style.Triggers> 

並將其應用到你每一個裏面顯示的按鈕圖像

<Button> 
... 
    <Image Style="{StaticResource style}" ... /> 
... 
</Button>