Question

我是WPF和XAML的新手，但在我读到这篇文章时仍然很棘手。我希望在鼠标悬停时更改的是Label前景色，但标签位于按钮内容中。一切都应该由样式完成，没有C#。

<Button Name="Home_Button" Height="50" VerticalAlignment="Top" Click="Home_Click" Background="Gray" Foreground="{x:Null}" BorderBrush="{x:Null}" BorderThickness="0">
   <DockPanel>
       <Image Source="Images/icons/home.png" HorizontalAlignment="Left" Margin="-90,0,0,0" />
       <Label VerticalAlignment="Center" HorizontalAlignment="Right"  Margin="0,0,-90,0" Foreground="LightGray" FontSize="12">Home</Label>
   </DockPanel>
</Button>

我的样式设置如下所示：

<Style TargetType="{x:Type Button}" x:Key="MetroButton">
    <Setter Property="MinHeight" Value="25" />
    <Setter Property="FontWeight" Value="Bold" />
    <Setter Property="FontSize" Value="10" />
    <Setter Property="FontFamily" Value="{DynamicResource DefaultFont}" />
    <Setter Property="Background" Value="{DynamicResource GrayBrush7}" />
    <Setter Property="BorderBrush" Value="{DynamicResource TextBoxBorderBrush}" />
    <Setter Property="Foreground" Value="{DynamicResource TextBrush}" />
    <Setter Property="Padding" Value="5,6" />
    <Setter Property="BorderThickness" Value="1" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="Button">
                <Grid>
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="Normal" />
                            <VisualState x:Name="MouseOver">
                                <Storyboard>
                                    <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="MouseOverBorder">
                                        <EasingDoubleKeyFrame KeyTime="0" Value="1" />
                                    </DoubleAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Pressed">
                                <Storyboard>
                                    <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="PressedBorder">
                                        <EasingDoubleKeyFrame KeyTime="0" Value="1" />
                                    </DoubleAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Disabled">
                                <Storyboard>
                                    <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="Opacity" Storyboard.TargetName="DisabledVisualElement">
                                        <SplineDoubleKeyFrame KeyTime="0" Value="0.7" />
                                    </DoubleAnimationUsingKeyFrames>
                                    <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="contentPresenter">
                                        <EasingDoubleKeyFrame KeyTime="0" Value="0.3" />
                                    </DoubleAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="FocusStates">
                            <VisualState x:Name="Focused">
                                <Storyboard>
                                    <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="ActiveContent">
                                        <EasingDoubleKeyFrame KeyTime="0" Value="1" />
                                    </DoubleAnimationUsingKeyFrames>
                                    <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="ActiveContent">
                                        <EasingDoubleKeyFrame KeyTime="0" Value="1" />
                                    </DoubleAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Unfocused" />
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                    <Border x:Name="Background"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}"
                            Background="{TemplateBinding Background}" />
                    <Rectangle x:Name="DisabledVisualElement"
                               Fill="{DynamicResource ControlsDisabledBrush}"
                               IsHitTestVisible="false"
                               Opacity="0"
                               RadiusY="3"
                               RadiusX="3" />
                    <Border x:Name="MouseOverBorder"
                            Background="{DynamicResource GrayBrush8}"
                            BorderThickness="{TemplateBinding BorderThickness}"
                            Opacity="0" />
                    <Border x:Name="ActiveContent"
                            Background="LightGray"
                            Opacity="0" 
                            />
                    <Border x:Name="PressedBorder"
                            Background="{DynamicResource GrayBrush5}"
                            BorderThickness="{TemplateBinding BorderThickness}"
                            Opacity="0" />
                    <Rectangle x:Name="FocusRectangle"
                               Stroke="{DynamicResource TextBoxMouseOverInnerBorderBrush}"
                               RadiusY="4"
                               RadiusX="4"
                               Margin="-1"
                               Opacity="0" />
                    <Rectangle x:Name="FocusInnerRectangle"
                               StrokeThickness="{TemplateBinding BorderThickness}"
                               Stroke="{DynamicResource TextBoxMouseOverBorderBrush}"
                               RadiusX="3"
                               RadiusY="3"
                               Opacity="0" />
                    <ContentPresenter x:Name="contentPresenter"
                                      RecognizesAccessKey="True"
                                      ContentTemplate="{TemplateBinding ContentTemplate}"
                                      Content="{TemplateBinding Content, Converter={StaticResource ToUpperConverter}}"
                                      HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                      Margin="{TemplateBinding Padding}"
                                      VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

现在我要更改Foreground.Color内MouseOver Label上的Button。目前，样式设置仅更改Background上Button的{{1}}。

Answer 1

将Button的子样式放在按钮样式的Style.Resources中，这是一个减少的示例，但应该解释我想说的内容。

<Window x:Class="WpfApplication1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">

    <Window.Resources>
        <Style TargetType="Button">
            <Style.Resources>
                <Style TargetType="Label">
                    <Style.Triggers>
                        <Trigger Property="IsMouseOver" Value="True">
                            <Setter Property="Foreground" Value="Green"/>
                        </Trigger>
                    </Style.Triggers>
                </Style>
            </Style.Resources>
            <Style.Triggers>
                <Trigger Property="IsMouseOver" Value="True">
                    <Setter Property="Background" Value="Blue"/>
                </Trigger>
            </Style.Triggers>
                <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="Button">
                        <Grid Background="Gray">
                            <Grid.RowDefinitions>
                                <RowDefinition />
                                <RowDefinition/>
                            </Grid.RowDefinitions>

                            <!-- This represents your image/-->
                            <Grid Grid.Row="0" Background="{TemplateBinding Background}"/>
                            <Label FontSize="20" Grid.Row="1" Content="{TemplateBinding Content}"/>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </Window.Resources>

    <Grid>
        <Button Margin="172,122,131,79" Foreground="Green">
            test
        </Button>
    </Grid>
</Window>

标签样式不适用于按钮外的任何内容，如果您将鼠标悬停在按钮区域的任何部分上，它会将上半部分变为蓝色，但只有当鼠标位于下半部分时才会将文本变为绿色（标签涵盖）

Answer 2

试试这个。

<Button Height="36" Margin="286,274,0,0" Width="74" MouseEnter="Button_MouseEnter_1">
       <Label x:Name="mylbl" Content="Test" MouseEnter="mylbl_MouseEnter"/>
</Button>

代码背后的代码：

private void mylbl_MouseEnter(object sender, MouseEventArgs e)
{
      mylbl.Background = new SolidColorBrush(Colors.Red);
}

鼠标悬停时更改标签前景，但标签位于按钮内容中

2 个答案: