how to highlight tiles of MahApps.Metro on mouseover?

问题

I've just discovered a very great UI toolkit for WPF: MahApps.Metro. I created a window with tiles of type MahApps.Metro.Controls.Tile.

I am not able to find the right way to highlight a tile when the mouse passes over.

Do you know how can I do that? Do I need to use templates and storyboard (seems to be a bit complex to set up...) ?

Thank you

[EDIT] Here is the control with the tiles:

<mah:TransitioningContentControl x:Name="LeftControl" Grid.Row="1" Grid.Column="1"  Transition="Default"  HorizontalAlignment="Left">
    <WrapPanel x:Name="SearchPanel" Width="400" Height="500" HorizontalAlignment="Left" VerticalAlignment="Top">
        <mah:Tile x:Name="CategoriesTile" Title="Catégories" Style="{StaticResource SearchTileStyle}" Click="ButtonBase_OnClick" />
        <mah:Tile x:Name="TagsTile" Title="Tags" Style="{StaticResource SearchTileStyle}"  Click="ButtonBase_OnClick"/>
        <mah:Tile x:Name="SearchTile" Title="Recherche" Style="{StaticResource SearchTileStyle}" />
        <mah:Tile  x:Name="FavoritesTile" Title="Favoris" Style="{StaticResource SearchTileStyle}" />
        <mah:Tile x:Name="AssistantTile" Title="Assistant" Style="{StaticResource SearchTileStyle}" />
    </WrapPanel>
</mah:TransitioningContentControl>

Here is the style that I use for the tiles (in a dictionary):

<Style x:Key="SearchTile" TargetType="mah:Tile">
    <Setter Property="Width" Value="150" />
    <Setter Property="Height" Value="150" />
    <Setter Property="TitleFontSize" Value="16" />
    <Setter Property="Background" Value="{StaticResource SearchTileBrush}" />
    <Setter Property="Margin" Value="3" />
</Style>

I would like to be able to change the background color or to add a border on mouse over. If possible, I would like to be able too to change the mouse cursor on mouse over.

I do not know if I could you triggers to do that.

[EDIT] mah:Tile inherits from System.Windows.Controls.Button. Thank you

回答1:

You're not too far off. All you would need is a trigger which responds to IsMouseOver and have a "highlighted brush color" when True, and the default color when False.

<Style x:Key="SearchTile" TargetType="mah:Tile">
    <Setter Property="Background" Value="{StaticResource SearchTileBrush}" />
    <Style.Triggers>
        <Trigger Property="IsMouseOver" Value="True">
            <Setter Property="Background" Value="{StaticResource SearchTyleHighlightedBrush}" />
        </Trigger>
    </Style.Triggers>
</Style>

来源：https://stackoverflow.com/questions/25447323/how-to-highlight-tiles-of-mahapps-metro-on-mouseover

标签

wpf

mahapps.metro