WPF自定义控件

一、ImageButton

1、继承ImageButtonButton，添加依赖属性

using System;
using System.Windows;
using System.Windows.Controls;

namespace June.Wpf.Tookit.Controls
{
    public class ImageButton : Button
    {
        static ImageButton()
        {
            DefaultStyleKeyProperty.OverrideMetadata(typeof(ImageButton), new FrameworkPropertyMetadata(typeof(ImageButton)));//去掉默认属性
        }

        #region Dependency Properties

        public double ImageSize
        {
            get { return (double)GetValue(ImageSizeProperty); }
            set { SetValue(ImageSizeProperty, value); }
        }

        public static readonly DependencyProperty ImageSizeProperty =
            DependencyProperty.Register("ImageSize", typeof(double), typeof(ImageButton),
            new FrameworkPropertyMetadata(30.0, FrameworkPropertyMetadataOptions.AffectsRender));

        public string NormalImage
        {
            get { return (string)GetValue(NormalImageProperty); }
            set { SetValue(NormalImageProperty, value); }
        }

        public static readonly DependencyProperty NormalImageProperty =
            DependencyProperty.Register("NormalImage", typeof(string), typeof(ImageButton),
            new FrameworkPropertyMetadata("", FrameworkPropertyMetadataOptions.AffectsRender, ImageSourceChanged));

        public string HoverImage
        {
            get { return (string)GetValue(HoverImageProperty); }
            set { SetValue(HoverImageProperty, value); }
        }

        public static readonly DependencyProperty HoverImageProperty =
            DependencyProperty.Register("HoverImage", typeof(string), typeof(ImageButton),
            new FrameworkPropertyMetadata("", FrameworkPropertyMetadataOptions.AffectsRender, ImageSourceChanged));

        public string PressedImage
        {
            get { return (string)GetValue(PressedImageProperty); }
            set { SetValue(PressedImageProperty, value); }
        }

        public static readonly DependencyProperty PressedImageProperty =
            DependencyProperty.Register("PressedImage", typeof(string), typeof(ImageButton),
            new FrameworkPropertyMetadata("", FrameworkPropertyMetadataOptions.AffectsRender, ImageSourceChanged));

        public string DisabledImage
        {
            get { return (string)GetValue(DisabledImageProperty); }
            set { SetValue(DisabledImageProperty, value); }
        }

        public static readonly DependencyProperty DisabledImageProperty =
            DependencyProperty.Register("DisabledImage", typeof(string), typeof(ImageButton),
            new FrameworkPropertyMetadata("", FrameworkPropertyMetadataOptions.AffectsRender, ImageSourceChanged));
        //依赖属性发生改变时候触发
        private static void ImageSourceChanged(DependencyObject sender, DependencyPropertyChangedEventArgs e)
        {
            Application.GetResourceStream(new Uri("pack://application:,,," + (string)e.NewValue));
        }

        public Visibility BorderVisibility
        {
            get { return (Visibility)GetValue(BorderVisibilityProperty); }
            set { SetValue(BorderVisibilityProperty, value); }
        }

        public static readonly DependencyProperty BorderVisibilityProperty =
            DependencyProperty.Register("BorderVisibility", typeof(Visibility), typeof(ImageButton),
            new FrameworkPropertyMetadata(Visibility.Hidden, FrameworkPropertyMetadataOptions.AffectsRender));

        #endregion
    }
}

2、Themes文件夹定义样式

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                    xmlns:JunControls="clr-namespace:June.Wpf.Tookit.Controls">
    <ControlTemplate x:Key="ImageButtonTemplate" TargetType="{x:Type JunControls:ImageButton}">
        <Grid x:Name="Grid">
            <Border 
        x:Name="Background" 
        Background="{TemplateBinding Background}" 
        BorderBrush="{TemplateBinding BorderBrush}" 
        BorderThickness="{TemplateBinding BorderThickness}" 
        CornerRadius="3" 
        Visibility="{Binding BorderVisibility, RelativeSource={RelativeSource TemplatedParent}}"/>
            <StackPanel
                Orientation="Horizontal" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" 
                HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}">
                <Image x:Name="ButtonImage" 
               Source="{Binding NormalImage, RelativeSource={RelativeSource TemplatedParent}}" 
               Height="{Binding ImageSize, RelativeSource={RelativeSource TemplatedParent}}" 
               Width="{Binding ImageSize, RelativeSource={RelativeSource TemplatedParent}}"
               ToolTip="{TemplateBinding ToolTip}"/>
                <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" 
                          VerticalAlignment="{TemplateBinding VerticalContentAlignment}" RecognizesAccessKey="True" />
            </StackPanel>
        </Grid>
        <ControlTemplate.Triggers>
            <Trigger Property="IsMouseOver" Value="true">
                <Setter TargetName="ButtonImage" Property="Source" Value="{Binding HoverImage, RelativeSource={RelativeSource TemplatedParent}}" />
            </Trigger>
            <Trigger Property="IsPressed" Value="true">
                <Setter TargetName="ButtonImage" Property="Source" Value="{Binding PressedImage, RelativeSource={RelativeSource TemplatedParent}}" />
            </Trigger>
            <Trigger Property="IsEnabled" Value="false">
                <Setter TargetName="ButtonImage" Property="Source" Value="{Binding DisabledImage, RelativeSource={RelativeSource TemplatedParent}}" />
            </Trigger>
        </ControlTemplate.Triggers>
    </ControlTemplate>
    <Style TargetType="{x:Type JunControls:ImageButton}" BasedOn="{x:Null}">
        <Setter Property="Padding" Value="3" />
        <Setter Property="Margin" Value="5" />
        <Setter Property="ImageSize" Value="32" />
        <Setter Property="BorderThickness" Value="3"/>
        <Setter Property="Foreground" Value="{DynamicResource TextBrush}" />
        <Setter Property="Background" Value="{DynamicResource ButtonBackgroundBrush}" />
        <Setter Property="BorderBrush" Value="{DynamicResource ButtonBorderBrush}" />
        <Setter Property="VerticalContentAlignment" Value="Center"/>
        <Setter Property="HorizontalContentAlignment" Value="Center"/>
        <Setter Property="Template" Value="{StaticResource ImageButtonTemplate}" />
    </Style>
</ResourceDictionary>

3、使用时候记得App.xaml中导入样式

        <StackPanel Orientation="Horizontal">
            <JuneControl:ImageButton 
                NormalImage="/JuneTookitDemo;component/Resources/Normal.png" 
                HoverImage="/JuneTookitDemo;component/Resources/Happy.png" 
                PressedImage="/JuneTookitDemo;component/Resources/Tounge.png" 
                Width="136" Background="Black" Content="test" Margin="0,22,0,10"/>
        </StackPanel>

 

<Application x:Class="JuneTookitDemo.App"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:Controls="clr-namespace:June.Wpf.Tookit.Controls;assembly=June.Wpf.Tookit"
             StartupUri="MainWindow.xaml">
    <Application.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="/June.Wpf.Tookit;component/Themes/ImageButton.xaml"/>
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </Application.Resources>
</Application>