2012-08-04 111 views
1

我有上圖像的按鈕,如下所示:將鼠標懸停效果的按鈕,圖像在XAML

<Button Width="22" Height="22" Command="{Binding PreviousCommand}">        
    <Button.Template> 
    <ControlTemplate> 
     <Image Source="C:\Users\abcdef\Desktop\Slide-To-Left-Arrow-24.png"></Image>        
    </ControlTemplate> 
    </Button.Template> 
    <Button.InputBindings> 
    <KeyBinding Key="Up" Command="{Binding PreviousCommand}" Modifiers="Alt+Shift" /> 
    </Button.InputBindings> 
</Button> 

我想通過效果來識別按鈕應用一些鼠標點擊/可獲得焦點。 我嘗試添加觸發如下,但它不工作:

<ControlTemplate.Triggers> 
    <Trigger Property="IsMouseOver" Value="True"> 
    <Setter Property="Background" Value="Black" /> 
    </Trigger> 
</ControlTemplate.Triggers> 

它不工作。我需要做什麼?請幫助我。

回答

7

您的控件模板由只有在這一點上的圖像,所以沒有什麼可以改變背景(通過你的觸發器)。如果您想添加背景更改,則需要稍微擴展您的ControlTemplate。嘗試是這樣的:

<Button.Template> 
    <ControlTemplate> 
    <Grid x:Name="bg"> 
     <Image Margin="4" Source="C:\Users\dheeraj.dilip.awale\Desktop\Slide-To-Left-Arrow-24.png"></Image> 
    </Grid> 
    <ControlTemplate.Triggers> 
     <Trigger Property="IsMouseOver" Value="True"> 
      <Setter Target="bg" Property="Background" Value="Black" /> 
     </Trigger> 
    </ControlTemplate.Triggers>        
    </ControlTemplate> 
</Button.Template> 

這只是一個非常簡單你如何利用您在上面所示的觸發例子。所有這些都是在圖像下添加一個Grid,並在圖像上添加一個Margin,以便Grid的一部分可見。然後,它使用SetterTarget屬性在用戶將鼠標懸停在按鈕上時分配GridBackground。你當然可以做更多與你的ControlTemplate提供其他類型的視覺線索,但希望這會讓你開始。

+0

謝謝。但它在Target =「mygrid」上給出編譯時錯誤。 – deathrace 2012-08-06 06:03:25

+0

你的模板中有一個名爲「mygrid」的元素嗎?我在你的文章或我的回答中看不到那個名字。您需要確保'Trigger'' Setter'中的'Target'與模板中'Grid'的'x:Name'匹配。 – 2012-08-06 13:50:20

+0

就像魅力一樣,即使我不得不在設置者中設置TargetName而不是Target – MUG4N 2016-07-23 17:43:50