logo标签列表

如何在默认的RadRadioButton上更改前景色

wpfxamltelerikradio-button
3

我正在尝试根据RadRadioButton的默认样式来设置我的RadRadioButton的样式：

<Style x:Key="MyRadRadioButtonStyle" TargetType="{x:Type telerik:RadRadioButton}">
    <Setter Property="BorderThickness" Value="1"/>
    <Setter Property="Foreground" Value="Black"/>
    <Setter Property="Background">
        <Setter.Value>
            <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                <GradientStop Color="White" Offset="0"/>
                <GradientStop Color="Gainsboro" Offset="0.5"/>
                <GradientStop Color="#FFADADAD" Offset="0.5"/>
                <GradientStop Color="#FFD4D4D4" Offset="1"/>
            </LinearGradientBrush>
        </Setter.Value>
    </Setter>
    <Setter Property="BorderBrush" Value="#FF848484"/>
    <Setter Property="CornerRadius" Value="1"/>
    <Setter Property="Padding" Value="3"/>
    <Setter Property="HorizontalContentAlignment" Value="Center"/>
    <Setter Property="VerticalContentAlignment" Value="Center"/>
    <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type telerik:RadRadioButton}">
                <Grid SnapsToDevicePixels="True">
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="Normal"/>
                            <VisualState x:Name="MouseOver">
                                <Storyboard>
                                    <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="OuterMouseOverBorder"/>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Pressed">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="OuterPressedBorder">
                                        <DiscreteObjectKeyFrame KeyTime="0">
                                            <DiscreteObjectKeyFrame.Value>
                                                <Visibility>Visible</Visibility>
                                            </DiscreteObjectKeyFrame.Value>
                                        </DiscreteObjectKeyFrame>
                                    </ObjectAnimationUsingKeyFrames>
                                    <DoubleAnimation Duration="0" To="0" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="CommonStatesWrapper"/>
                                    <DoubleAnimation Duration="0" To="0" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="FocusVisual"/>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Disabled">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="DisabledVisual">
                                        <DiscreteObjectKeyFrame KeyTime="0">
                                            <DiscreteObjectKeyFrame.Value>
                                                <Visibility>Visible</Visibility>
                                            </DiscreteObjectKeyFrame.Value>
                                        </DiscreteObjectKeyFrame>
                                    </ObjectAnimationUsingKeyFrames>
                                    <DoubleAnimation Duration="0" To="0.5" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="Content"/>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="DisabledChecked">
                                <Storyboard>
                                    <DoubleAnimation Duration="0" To="0.5" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="Content"/>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="MouseOverChecked">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Duration="0" Storyboard.TargetProperty="Background" Storyboard.TargetName="CheckedVisual">
                                        <DiscreteObjectKeyFrame KeyTime="0">
                                            <DiscreteObjectKeyFrame.Value>
                                                <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                                    <GradientStop Color="#FFFFE8AB" Offset="0"/>
                                                    <GradientStop Color="#FFFFE08F" Offset="0.5"/>
                                                    <GradientStop Color="#FFFEAF27" Offset="0.5"/>
                                                    <GradientStop Color="#FFFFE74E" Offset="1"/>
                                                </LinearGradientBrush>
                                            </DiscreteObjectKeyFrame.Value>
                                        </DiscreteObjectKeyFrame>
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames Duration="0" Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="CheckedVisual">
                                        <DiscreteObjectKeyFrame KeyTime="0">
                                            <DiscreteObjectKeyFrame.Value>
                                                <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                                    <GradientStop Color="#FF282828"/>
                                                    <GradientStop Color="#FF5F5F5F" Offset="1"/>
                                                </LinearGradientBrush>
                                            </DiscreteObjectKeyFrame.Value>
                                        </DiscreteObjectKeyFrame>
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames Duration="0" Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="InnerCheckedVisual">
                                        <DiscreteObjectKeyFrame KeyTime="0">
                                            <DiscreteObjectKeyFrame.Value>
                                                <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                                    <GradientStop Color="#FFB69A78"/>
                                                    <GradientStop Color="#FFFFE17A" Offset="0.169"/>
                                                </LinearGradientBrush>
                                            </DiscreteObjectKeyFrame.Value>
                                        </DiscreteObjectKeyFrame>
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="BackgroundVisibility">
                            <VisualState x:Name="BackgroundIsHidden">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="OuterBorder">
                                        <DiscreteObjectKeyFrame KeyTime="0">
                                            <DiscreteObjectKeyFrame.Value>
                                                <Visibility>Collapsed</Visibility>
                                            </DiscreteObjectKeyFrame.Value>
                                        </DiscreteObjectKeyFrame>
                                    </ObjectAnimationUsingKeyFrames>
                                    <DoubleAnimation Duration="0" To="0" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="DisabledVisual"/>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="BackgroundIsVisible"/>
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="CheckStates">
                            <VisualState x:Name="Checked">
                                <Storyboard>
                                    <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="CheckedVisual"/>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Unchecked"/>
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="FocusStatesGroup">
                            <VisualState x:Name="Unfocused">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="FocusVisual">
                                        <DiscreteObjectKeyFrame KeyTime="0:0:0.15">
                                            <DiscreteObjectKeyFrame.Value>
                                                <Visibility>Collapsed</Visibility>
                                            </DiscreteObjectKeyFrame.Value>
                                        </DiscreteObjectKeyFrame>
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Focused">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="FocusVisual">
                                        <DiscreteObjectKeyFrame KeyTime="0:0:0.115">
                                            <DiscreteObjectKeyFrame.Value>
                                                <Visibility>Visible</Visibility>
                                            </DiscreteObjectKeyFrame.Value>
                                        </DiscreteObjectKeyFrame>
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                    <Border x:Name="OuterBorder" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" CornerRadius="{TemplateBinding CornerRadius}">
                        <Border BorderBrush="White" BorderThickness="{TemplateBinding BorderThickness}" Background="{x:Null}" CornerRadius="{TemplateBinding InnerCornerRadius}"/>
                    </Border>
                    <Border x:Name="OuterMouseOverBorder" BorderBrush="#FFFFC92B" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="{TemplateBinding CornerRadius}" Opacity="0">
                        <Border.Background>
                            <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                <GradientStop Color="#FFFFFBDA" Offset="0"/>
                                <GradientStop Color="#FFFEEBAE" Offset="0.5"/>
                                <GradientStop Color="#FFFFD25A" Offset="0.5"/>
                                <GradientStop Color="#FFFFFBA3" Offset="1"/>
                            </LinearGradientBrush>
                        </Border.Background>
                        <Border BorderBrush="White" BorderThickness="{TemplateBinding BorderThickness}" Background="{x:Null}" CornerRadius="{TemplateBinding InnerCornerRadius}"/>
                    </Border>
                    <Border x:Name="OuterPressedBorder" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="{TemplateBinding CornerRadius}" Visibility="Collapsed">
                        <Border.BorderBrush>
                            <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                <GradientStop Color="#FF282828"/>
                                <GradientStop Color="#FF5F5F5F" Offset="1"/>
                            </LinearGradientBrush>
                        </Border.BorderBrush>
                        <Border.Background>
                            <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                <GradientStop Color="#FFFFDCAB" Offset="0"/>
                                <GradientStop Color="#FFFFD18F" Offset="0.5"/>
                                <GradientStop Color="#FFFE9227" Offset="0.5"/>
                                <GradientStop Color="#FFFFBA74" Offset="0"/>
                            </LinearGradientBrush>
                        </Border.Background>
                        <Border BorderThickness="{TemplateBinding BorderThickness}" Background="{x:Null}" CornerRadius="{TemplateBinding InnerCornerRadius}">
                            <Border.BorderBrush>
                                <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                    <GradientStop Color="#FFB69A78"/>
                                    <GradientStop Color="#FFFFE17A" Offset="0.126"/>
                                </LinearGradientBrush>
                            </Border.BorderBrush>
                        </Border>
                    </Border>
                    <Border x:Name="DisabledVisual" BorderBrush="Transparent" BorderThickness="{TemplateBinding BorderThickness}" Background="#FFE0E0E0" CornerRadius="{TemplateBinding CornerRadius}" Visibility="Collapsed"/>
                    <Grid x:Name="CommonStatesWrapper">
                        <Border x:Name="FocusVisual" BorderBrush="#FFFFC92B" BorderThickness="{TemplateBinding BorderThickness}" Background="Transparent" CornerRadius="{TemplateBinding CornerRadius}" Visibility="Collapsed">
                            <Border x:Name="FocusInnerVisual" BorderBrush="Transparent" BorderThickness="1" Background="{x:Null}" CornerRadius="{TemplateBinding InnerCornerRadius}"/>
                        </Border>
                        <Border x:Name="CheckedVisual" BorderBrush="#FFFFC92B" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="{TemplateBinding CornerRadius}" Opacity="0">
                            <Border.Background>
                                <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                    <GradientStop Color="#FFFFDCAB" Offset="0"/>
                                    <GradientStop Color="#FFFFD18F" Offset="0.5"/>
                                    <GradientStop Color="#FFFE9227" Offset="0.5"/>
                                    <GradientStop Color="#FFFFD74E" Offset="1"/>
                                </LinearGradientBrush>
                            </Border.Background>
                            <Border x:Name="InnerCheckedVisual" BorderBrush="White" BorderThickness="{TemplateBinding BorderThickness}" Background="{x:Null}" CornerRadius="{TemplateBinding InnerCornerRadius}"/>
                        </Border>
                    </Grid>
                    <ContentPresenter x:Name="Content" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" ContentStringFormat="{TemplateBinding ContentStringFormat}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

比如说，我想要为“Checked”状态创建一个深色背景，那么我该如何改变按钮在这种状态下的前景色（文本颜色）为白色？

编辑1

根据Chris W.的评论，我已经添加了一个ColorAnimation到这个CheckStates VisualStateGroup中：

<VisualStateGroup x:Name="CheckStates">
    <VisualState x:Name="Checked">
        <Storyboard>
            <DoubleAnimation Duration="0" Storyboard.TargetName="CheckedVisual"
                             Storyboard.TargetProperty="Opacity" To="1" />
            <ColorAnimation Storyboard.TargetName="FontColor" Storyboard.TargetProperty="Color" To="White" Duration="0:0:0" />
        </Storyboard>
    </VisualState>
    <VisualState x:Name="Unchecked" />
</VisualStateGroup>

但这并不起作用，它给我返回了以下错误：

编译错误

编辑2

根据新评论，我做出了如下修改：

<VisualStateGroup x:Name="CheckStates">
    <VisualState x:Name="Checked">
        <Storyboard>
            <DoubleAnimation Duration="0" Storyboard.TargetName="CheckedVisual"
                             Storyboard.TargetProperty="Opacity" To="1" />
            <ColorAnimation Storyboard.TargetName="Content" Storyboard.TargetProperty="Foreground" To="White" Duration="0:0:0" />
        </Storyboard>
    </VisualState>
    <VisualState x:Name="Unchecked" />
</VisualStateGroup>

但是现在我遇到了这个错误： 编译错误
看到你的“Checked” VisualState了吗？把这个代码放在storyboard标签之间：<ColorAnimation Storyboard.TargetName="FontColor" Storyboard.TargetProperty="Color" To="White" Duration="0:0:0" /> - Chris W.
@ChrisW。再次感谢您，请查看我的新编辑。 - dhrm
@ChrisW。抱歉，但我仍然遇到了相同的错误。除此之外，现在它说：无法解析属性路径“TextElement.Foreground”中的所有属性引用。请验证适用对象是否支持这些属性。 - dhrm
嗯，我的XAML有点生疏，但并不是很生疏。应该没问题。我会尝试查看一个按钮中的Telerik按钮的副本，并找到你的罪魁祸首。我知道在他们的文档中有一个可以轻松覆盖的画笔来实现你的目标，但你已经覆盖了样式模板，所以它不会起作用。使用Blend和状态面板查看可用属性通常也很容易完成此任务，但我一段时间前转向了Web开发。无论如何，敬请期待。 - Chris W.
@dhrm 因为我对此很感兴趣，你能否请检查一下当您将TextBlock或类似的内容用作telerik:RadRadioButton的Content时会发生什么（或者您已经在使用类似的东西）。 Kamran Asim的答案仍然有效吗？ - nosale
显示剩余3条评论
3个回答
1
你将“Check background”改成了黑色吗？你可以编辑background属性。
对于前景，请在Checked VisualState="Checked"内应用ColorAnimation。
 <VisualState x:Name="Checked">
  <Storyboard>
    ...........                                           
    <ColorAnimation To="White" Storyboard.TargetProperty="(Control.Foreground).(SolidColorBrush.Color)" Storyboard.TargetName="Content" />
  </Storyboard>
</VisualState>
你的解决方案是可行的，除非你做了类似这样的事情 <ToggleButton><TextBlock>内容</TextBlock></ToggleButton>（我使用 ToggleButton 作为参考）。 - nosale
我尝试了上面的解决方案，通过将内容设置为一些文本。它有效。它应该适用于其他具有前景属性的控件。无论如何，您知道应该是什么内容，因此可以相应地设置属性。 - Kamran Asim
非常感谢您的评论。我知道这不是问问题的正确地方，但我提供了一个小示例，展示了我尝试使用您的解决方案，但对我来说并没有起作用。 - nosale
你好 @nosale，感谢分享示例。我用另一种方法解决了你的问题。请尝试以下步骤：
  1. 从选中和未选中状态中删除前景色动画
  2. 应用以下样式 <ControlTemplate.Triggers> <Trigger Property="IsChecked" Value="true"> <Setter Property="Foreground" Value="White"/> </Trigger> <Trigger Property="IsChecked" Value="false"> <Setter Property="Foreground" Value="Black"/> </Trigger> </ControlTemplate.Triggers>
对我有效，请检查一下。 - Kamran Asim
感谢您的时间。我知道这个会起作用，但问题是如何使用“VisualStateManager”使其工作（除了我发布的那个解决方案，我还没有找到其他解决方案）。我发现一个答案，解释了为什么您的方法在这种情况下不起作用（似乎在2018年仍然适用）。 - nosale
0

注意：我没有访问，因此我使用作为参考

即使您的Content更复杂，也可以使您的动画正常工作

<telerik:RadRadioButton>
    <TextBlock>SomeContent</TextBlock>
</telerik:RadRadioButton>

您想设置 RadRadioButton 的 Foreground

通常的第一种方法可能是这样的

<ColorAnimation To="White" Storyboard.TargetProperty="Foreground.(SolidColorBrush.Color)" Storyboard.Target="{Binding RelativeSource={RelativeSource TemplatedParent}}" />

但是你会收到以下错误信息

System.Windows.Data Error: 2 : 找不到目标元素的主要 FrameworkElement 或 FrameworkContentElement...

这个错误是因为 VisualStateManager 不是 VisualTree 的一部分
另请参阅：WPF 错误：找不到目标元素的主要 FrameworkElement

要解决此问题，您必须使用 BindingProxy
有关参考，请参阅：在 WPF 中为 DataGridColumn 绑定可见性

public class BindingProxy : Freezable
{
    #region Overrides of Freezable

    protected override Freezable CreateInstanceCore()
    {
        return new BindingProxy();
    }

    #endregion

    public object Data
    {
        get { return (object)GetValue(DataProperty); }
        set { SetValue(DataProperty, value); }
    }

    public static readonly DependencyProperty DataProperty =
        DependencyProperty.Register("Data", typeof(object),
            typeof(BindingProxy));
}


<ControlTemplate TargetType="{x:Type telerik:RadRadioButton}">
    <Grid SnapsToDevicePixels="True">
        <Grid.Resources>
            <local:BindingProxy x:Key="BindingProxy" Data="{Binding RelativeSource={RelativeSource TemplatedParent}}" />
        </Grid.Resources>
        ...
        <VisualStateManager.VisualStateGroups>
            <VisualStateGroup x:Name="CommonStates">
                ...
                <VisualState x:Name="Checked">
                    <Storyboard>
                        ...                                        
                        <ColorAnimation To="White" Storyboard.TargetProperty="Foreground.(SolidColorBrush.Color)" Storyboard.Target="{Binding Path=Data, Source={StaticResource BindingProxy}}" />
                        ...
                    </Storyboard>
                </VisualState>
                ...
            </VisualStateGroup>
            ...
        </VisualStateManager>
        ...
    </Grid>
</ControlTemplate>
0

这里是代码，应该可以工作（至少对我有效）：

<VisualState x:Name="Checked">
                                    <Storyboard>
                                        <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="CheckedVisual"/>
                                        <ObjectAnimationUsingKeyFrames Duration="0" Storyboard.TargetProperty="(TextElement.Foreground)" Storyboard.TargetName="Content">
                                            <DiscreteObjectKeyFrame KeyTime="0">
                                                <DiscreteObjectKeyFrame.Value>
                                                    <SolidColorBrush Color="White"/>
                                                </DiscreteObjectKeyFrame.Value>
                                            </DiscreteObjectKeyFrame>
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>

要以正确的方式（即Telerik建议的方式）创建这些样式，您应该在设计器中右键单击组件-> 编辑模板...-> 编辑副本（在此时您可以尝试其他选项）。 完成以上步骤后，xaml中将生成正确（可用）的代码，无论是在资源中还是在App.xaml文件中。有了这段代码，您就可以更改那些参数。希望它有所帮助。
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接