Question

我正在尝试使用图像创建一个超链接按钮，其中图像将具有悬停效果（在MouseOver上更改）。我能够创建一个带有一个图像的超链接按钮，但卡在图像上的悬停效果。请帮忙！

这是我的用户控件：

<UserControl.Resources>
        <Style x:Key="NavigationButton_Middle" TargetType="HyperlinkButton">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="HyperlinkButton">
                        <Grid Background="{TemplateBinding Background}" Cursor="{TemplateBinding Cursor}">
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Normal"/>
                                    <VisualState x:Name="MouseOver">
                                        <Storyboard>
                                            <ColorAnimation Storyboard.TargetName="Background"
                                                            Storyboard.TargetProperty="Color"
                                                            To="White"
                                                            Duration="00:00:0.1">
                                            </ColorAnimation>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Pressed"/>
                                    <VisualState x:Name="Disabled"/>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <Border x:Name="Edge" BorderBrush="#FFD9D9D9" BorderThickness="1" CornerRadius="1" Height="32" Width="48">
                                <Border.Background>
                                    <SolidColorBrush x:Name="Background" Color="#FFF4F4F4" />
                                </Border.Background>
                                <ContentPresenter Content="{TemplateBinding Content}" />
                            </Border>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </UserControl.Resources>

XAML：

<HyperlinkButton x:Name="HomeButton" Style="{StaticResource NavigationButton_Middle}" ToolTipService.ToolTip="Home" Visibility="Visible" Margin="0" HorizontalAlignment="Right">
                    <Image Source="home.png" Margin="13,5,13,5" Height="20" Width="20"/>
                </HyperlinkButton>

提前感谢您的帮助！

Answer 1

由于您想要更改按钮的实际内容（样式未知），因此很难在不损害样式的可重用性的情况下使用。但是，如果您不介意，可以将模板移动到ContentPresenter现在所在的模板中。然后，您可以在故事板中按名称修改它。

带图像的Silverlight超链接按钮（图像上有悬停效果）

1 个答案: