更改单击标签颜色WPF



我来自C#winforms背景,通常我会在代码中完成所有这些。我有几个标签正在用作菜单。当鼠标悬停在它们上面时,文本的颜色会发生变化:

<Page.Resources>
    <SolidColorBrush x:Key="normalColor" Color="White" />
    <SolidColorBrush x:Key="mouseOverColor" Color="Gold" />
    <Style TargetType="Label" x:Key="menuItemStyle">
        <Style.Triggers>
            <Trigger Property="IsMouseOver" Value="False">
                <Setter Property="Foreground" Value="{StaticResource normalColor}"/>
            </Trigger>
            <Trigger Property="IsMouseOver" Value="True">
                <Setter Property="Foreground" Value="{StaticResource mouseOverColor}"/>
            </Trigger>
        </Style.Triggers>
    </Style>
</Page.Resources>
      <Label x:Name="Label_Video1" Style="{StaticResource menuItemStyle}" Content="1.Video 1."  FontSize="16" HorizontalAlignment="Left" Margin="25,74,0,0" VerticalAlignment="Top" MouseLeftButtonDown="Label_Video1_MouseLeftButtonDown" />
    <Label x:Name="Label_Video2" Style="{StaticResource menuItemStyle}" Content="2. Video 2." FontSize="16" HorizontalAlignment="Left" Margin="25,105,0,0" VerticalAlignment="Top" MouseDown="Label_Video2_MouseDown"/>

当用户点击标签时,我希望它保持一定的颜色(在本例中为金色),其他标签保持正常颜色。因此,如果一个标签之前被点击过,我点击了另一个标签,它将从金色变为白色等。

使用WPF时,您必须稍微有不同的想法。我们知道Label控件不知道它何时被单击,尤其不知道另一个Label元素何时被单击。。。但有些控件确实如此。仔细想想…RadioButton正是有这种行为的。这就是WPF真正的闪光点。

我们可以使用RadioButton,并通过为它们提供一个新的ControlTemplate,我们可以使它们看起来像纯文本:

<Grid Background="Black">
    <Grid.Resources>
        <Style TargetType="{x:Type RadioButton}">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type RadioButton}">
                        <TextBlock Text="{TemplateBinding Content}">
                            <TextBlock.Style>
                                <Style TargetType="{x:Type TextBlock}">
                                    <Setter Property="Foreground" Value="White" />
                                    <Style.Triggers>
<DataTrigger Binding="{Binding IsChecked, RelativeSource={RelativeSource AncestorType={
x:Type RadioButton}}}" Value="True">
    <Setter Property="Foreground" Value="Gold" />
</DataTrigger>
<DataTrigger Binding="{Binding IsMouseOver, RelativeSource={RelativeSource
AncestorType={x:Type RadioButton}}}" Value="True">
    <Setter Property="Foreground" Value="Gold" />
</DataTrigger>
                                    </Style.Triggers>
                                </Style>
                            </TextBlock.Style>
                        </TextBlock>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </Grid.Resources>
    <StackPanel Margin="5" Background="{x:Null}">
        <RadioButton Content="1.Video 1." />
        <RadioButton Content="2.Video 2." />
        <RadioButton Content="3.Video 3." />
    </StackPanel>
</Grid>

如果不希望RadioButton在一个StackPanel中全部在一起,则可以使用赋予它们相同的GroupName属性值,以确保它们仍然作为一个组运行。

最新更新