如何更改按下狀態的按鈕樣式？

Question

我有一個按鈕樣式。

<Style x:Key="btnBackStyle" TargetType="Button"> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="Button"> 
        <Grid> 
         <Image Source="/Assets/Icons/ic_arrow_back_white_48dp.png" Margin="8"/> 
         <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
              VerticalAlignment="{TemplateBinding VerticalContentAlignment}" 
              Content=""/> 
        </Grid> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 

當用戶點擊它，我需要的圖像是不同的一個，當他再次點擊圖像需要再次第一個。當我在項目中的幾個地方使用這種風格時，我不想使用C＃代碼，可以通過XAMl代碼來設置它嗎？

我試圖觸發以下

<ControlTemplate.Triggers> 

    <Trigger Property="IsPressed" Value="True"> 
     <Setter Property="Source" Value="/Assets/Icons/ic_arrow_back_blue_48dp.png" /> 
    </Trigger> 

</ControlTemplate.Triggers> 

我也得到了錯誤

的附着性能「觸發器」並沒有在類型中找到「控件模板」

Answer 1

如果您需要的圖像唯一的變化，同時按下（並按下，我的意思是你是從字面上向下按壓它用鼠標/手指/筆），那麼這將做到：

<ControlTemplate TargetType="Button"> 
    <Grid> 
     <Image x:Name="ImageOne"></Image> 
     <Image x:Name="ImageTwo"></Image> 
     <ContentPresenter></ContentPresenter> 
    </Grid> 
    <ControlTemplate.Triggers> 
     <Trigger Property="IsPressed" Value="False"> 
      <Setter TargetName="ImageOne" Property="Visibility" Value="Visible"></Setter> 
      <Setter TargetName="ImageTwo" Property="Visibility" Value="Collapsed"></Setter> 
     </Trigger> 
     <Trigger Property="IsPressed" Value="True"> 
      <Setter TargetName="ImageOne" Property="Visibility" Value="Collapsed"></Setter> 
      <Setter TargetName="ImageTwo" Property="Visibility" Value="Visible"></Setter> 
     </Trigger> 
    </ControlTemplate.Triggers> 
</ControlTemplate> 

如果你需要它-stay-更換一次壓，直到再次按下，那麼您將需要一個切換按鈕被替換的按鈕，並給它這個模板：

<ControlTemplate TargetType="ToggleButton"> 
    <Grid> 
     <Image x:Name="ImageOne"></Image> 
     <Image x:Name="ImageTwo"></Image> 
     <ContentPresenter></ContentPresenter> 
    </Grid> 
    <ControlTemplate.Triggers> 
     <Trigger Property="IsChecked" Value="False"> 
      <Setter TargetName="ImageOne" Property="Visibility" Value="Visible"></Setter> 
      <Setter TargetName="ImageTwo" Property="Visibility" Value="Collapsed"></Setter> 
     </Trigger> 
     <Trigger Property="IsChecked" Value="True"> 
      <Setter TargetName="ImageOne" Property="Visibility" Value="Collapsed"></Setter> 
      <Setter TargetName="ImageTwo" Property="Visibility" Value="Visible"></Setter> 
     </Trigger> 
    </ControlTemplate.Triggers> 
</ControlTemplate> 

如果你想動畫的內容，因爲他們實現這種轉變，那麼我建議使用混合來定位這裏顯示的觸發器並創建一個故事板，執行你所追蹤的動畫。

Answer 2

的想法將兩個圖像放在一個接一個的後面，所以當按下按鈕時，只需改變按下按鈕時圖像的可見性即可。

您可以通過更改按鈕的視覺狀態來做到這一點。

從你的情況看來，你正在尋找複選框。這爲檢查狀態顯示不同的圖像。