欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

WPF C# RadioButton单选图标按钮

程序员文章站 2022-07-14 13:15:22
...

有一组单选按钮,选中不同的按钮切换到不同功能。按钮通过矢量图显示,当选中按钮变暗,先看一下效果:

WPF C# RadioButton单选图标按钮

单选按钮需要增加几个依赖属性:CornerRadius,Icon,IconWidth,IconHeight。

public class IconButton : RadioButton
    {
        public CornerRadius CornerRadius
        {
            get { return (CornerRadius)GetValue(CornerRadiusProperty); }
            set { SetValue(CornerRadiusProperty, value); }
        }
        public static readonly DependencyProperty CornerRadiusProperty =
            DependencyProperty.Register("CornerRadius", typeof(CornerRadius), typeof(IconButton), new PropertyMetadata(null));


        /// <summary>
        /// 图标
        /// </summary>
        public Geometry Icon
        {
            get { return (Geometry)GetValue(IconProperty); }
            set { SetValue(IconProperty, value); }
        }
        public static readonly DependencyProperty IconProperty =
            DependencyProperty.Register("Icon", typeof(Geometry), typeof(IconButton), new PropertyMetadata(null));



        /// <summary>
        /// 图标宽度
        /// </summary>
        public double IconWidth
        {
            get { return (double)GetValue(IconWidthProperty); }
            set { SetValue(IconWidthProperty, value); }
        }
        public static readonly DependencyProperty IconWidthProperty =
            DependencyProperty.Register("IconWidth", typeof(double), typeof(IconButton), new PropertyMetadata(12.0));



        /// <summary>
        /// 图标高度
        /// </summary>
        public double IconHeight
        {
            get { return (double)GetValue(IconHeightProperty); }
            set { SetValue(IconHeightProperty, value); }
        }
        public static readonly DependencyProperty IconHeightProperty =
            DependencyProperty.Register("IconHeight", typeof(double), typeof(IconButton), new PropertyMetadata(12.0));


    }

依赖属性类设计完,需要在样式中把这些属性绑定。

<Style TargetType="{x:Type local:IconButton}">
        <Setter Property="Width" Value="28" />
        <Setter Property="Height" Value="24" />
        <Setter Property="BorderThickness" Value="1,1,1,1" />
        <Setter Property="Cursor" Value="Hand" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type local:IconButton}">
                    <Border
                        x:Name="bg"
                        Background="White"
                        BorderBrush="#E5E5E5"
                        BorderThickness="{TemplateBinding BorderThickness}"
                        CornerRadius="{TemplateBinding CornerRadius}"
                        UseLayoutRounding="True">
                        <Path
                            x:Name="Content"
                            Width="{TemplateBinding IconWidth}"
                            Height="{TemplateBinding IconHeight}"
                            Data="{TemplateBinding Icon}"
                            Fill="#888888"
                            Stretch="Fill"
                            UseLayoutRounding="True" />
                    </Border>
                    <ControlTemplate.Triggers>
                        <MultiTrigger>
                            <MultiTrigger.Conditions>
                                <Condition Property="IsMouseOver" Value="True" />
                                <Condition Property="IsMouseOver" Value="True" />
                            </MultiTrigger.Conditions>
                        </MultiTrigger>
                        <Trigger Property="IsChecked" Value="True">
                            <Setter TargetName="bg" Property="Background" Value="{StaticResource ButtonHighlightBackColor}" />
                            <Setter TargetName="bg" Property="BorderThickness" Value="0" />
                            <Setter TargetName="Content" Property="Fill" Value="White" />
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

继承类和样式都写好了,直接在代码中调用就行了。