更改 Mahapps Tile 上的鼠标悬停效果

Changing mouseover effect on Mahapps Tile

所以最近我开始使用 MahApps.Metro 进行申请。 进展顺利,但我无法解决的一个问题是 Tile 上的 MouseOver 效果

我有一个 Grid,其中有一个 Expander 托管所有 Tiles,每个 Tiles 代表与特定数据库的连接。它们绑定到我从另一个数据库填充的 ObservableCollection

<Grid>
    <Expander Margin="5" Header="Server Connections">
        <ListBox ItemsSource="{Binding OmsConnections}" ScrollViewer.HorizontalScrollBarVisibility="Disabled">
            <ListBox.ItemsPanel>
                <ItemsPanelTemplate>
                    <WrapPanel IsItemsHost="True" />
                </ItemsPanelTemplate>
            </ListBox.ItemsPanel>
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <controls:Tile
                        Title="{Binding Name}"
                        controls:ControlsHelper.MouseOverBorderBrush="{DynamicResource BlackBrush}"
                        Background="{DynamicResource GrayBrush2}"
                        Command="{Binding DataContext.TileClickCommand, RelativeSource={RelativeSource AncestorType=ListBox}}"
                        CommandParameter="{Binding}"
                        HorizontalTitleAlignment="Left"
                        Style="{StaticResource LargeTileStyle}"
                        TiltFactor="2">
                        <Image
                            Width="60"
                            Height="60"
                            Source="{Binding OmsConnectionTypeId, Converter={StaticResource ConnectionTypeToIconConverter}}" />
                    </controls:Tile>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>
    </Expander>
</Grid>

这是通过样式应用的样式

    <Style x:Key="LargeTileStyle" TargetType="controls:Tile">
        <Setter Property="Height" Value="125" />
        <Setter Property="TitleFontSize" Value="14" />
        <Setter Property="TextOptions.TextFormattingMode" Value="Display" />
        <Setter Property="TextOptions.TextRenderingMode" Value="ClearType" />
        <Setter Property="Width" Value="210" />
    </Style>

因此,每当我将鼠标悬停在一个项目上时,我都会得到指定的黑色边框和橙色背景颜色(如果我没记错的话,它是 AccentColorBrush3),我不知道如何更改它。

Here's the Image, since my rep is low and i cannot embed it.

此外,我真的非常不擅长模板和样式,所以这几乎是我从 Internet 上删除的内容。对于我绑定到集合的方式以及如何更改鼠标悬停颜色的任何反馈,我们将不胜感激。

您可以通过向 ListBox 添加 SolidColorBrush 资源来 "override" AccentColorBrush3 资源:

<ListBox ItemsSource="{Binding OmsConnections}" ScrollViewer.HorizontalScrollBarVisibility="Disabled">
    <!-- Specify the highlight brush here: -->
    <ListBox.Resources>
        <SolidColorBrush x:Key="AccentColorBrush3" Color="Yellow" />
    </ListBox.Resources>
    <ListBox.ItemsPanel>
        <ItemsPanelTemplate>
            <WrapPanel IsItemsHost="True" />
        </ItemsPanelTemplate>
    </ListBox.ItemsPanel>
    <ListBox.ItemTemplate>
        <DataTemplate>
            <controls:Tile
                        Title="{Binding Name}"
                        controls:ControlsHelper.MouseOverBorderBrush="{DynamicResource BlackBrush}"
                        Background="{DynamicResource GrayBrush2}"
                        Command="{Binding DataContext.TileClickCommand, RelativeSource={RelativeSource AncestorType=ListBox}}"
                        CommandParameter="{Binding}"
                        HorizontalTitleAlignment="Left"
                        Style="{StaticResource LargeTileStyle}"
                        TiltFactor="2">
                <Image  Width="60"
                        Height="60"
                        Source="{Binding OmsConnectionTypeId, Converter={StaticResource ConnectionTypeToIconConverter}}" />
            </controls:Tile>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>