ToggleButton图片按钮的两种制作方法

第一种：

因为项目需要制作ToggleButton图片按钮，要求点击之后改变图片，而Check和Uncheck的时候又具有Normal、MouseOver、Pressed三种状态。

开始想要利用VisualStateManager来做，如果放置6个image有不知道怎么区分check状态和UnCheck状态的Normal、MouseOver、Pressed（如果有知道的告诉一声，谢谢）。

然后想了一个比较笨的办法，制作一个图片按钮，区分三种状态，然后在ToggleButton图片按钮里面放置两个图片按钮，但是这样的话，图片按钮会阻止点击是的状态变化，于是对每个按钮实现click事件，手动实现状态变化。代码如下：

xaml：

后台代码：

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Controls.Primitives;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace DrawText.Controls
{
    /// <summary>
    /// ImageToggleButton.xaml 的交互逻辑
    /// </summary>
    public partial class ImageToggleButton : ToggleButton
    {
        public ImageToggleButton()
        {
            InitializeComponent();
        }

public ImageSource CheckNormalImage
        {
            get { return (ImageSource)GetValue(CheckNormalImageProperty); }
            set { SetValue(CheckNormalImageProperty, value); }
        }

// Using a DependencyProperty as the backing store for CheckNormalImage. This enables animation, styling, binding, etc...
public static readonly DependencyProperty CheckNormalImageProperty =
DependencyProperty.Register("CheckNormalImage", typeof(ImageSource), typeof(ImageToggleButton), new PropertyMetadata(null));

public ImageSource CheckMouseOverImage
        {
            get { return (ImageSource)GetValue(CheckMouseOverImageProperty); }
            set { SetValue(CheckMouseOverImageProperty, value); }
        }

// Using a DependencyProperty as the backing store for CheckMouseOverImage. This enables animation, styling, binding, etc...
public static readonly DependencyProperty CheckMouseOverImageProperty =
DependencyProperty.Register("CheckMouseOverImage", typeof(ImageSource), typeof(ImageToggleButton), new PropertyMetadata(null));

public ImageSource CheckPressedImage
        {
            get { return (ImageSource)GetValue(CheckPressedImageProperty); }
            set { SetValue(CheckPressedImageProperty, value); }
        }

// Using a DependencyProperty as the backing store for CheckPressedImage. This enables animation, styling, binding, etc...
public static readonly DependencyProperty CheckPressedImageProperty =
DependencyProperty.Register("CheckPressedImage", typeof(ImageSource), typeof(ImageToggleButton), new PropertyMetadata(null));

public ImageSource UnCheckNormalImage
        {
            get { return (ImageSource)GetValue(UnCheckNormalImageProperty); }
            set { SetValue(UnCheckNormalImageProperty, value); }
        }

// Using a DependencyProperty as the backing store for UnCheckNormalImage. This enables animation, styling, binding, etc...
public static readonly DependencyProperty UnCheckNormalImageProperty =
DependencyProperty.Register("UnCheckNormalImage", typeof(ImageSource), typeof(ImageToggleButton), new PropertyMetadata(null));

public ImageSource UnCheckMouseOverImage
        {
            get { return (ImageSource)GetValue(UnCheckMouseOverImageProperty); }
            set { SetValue(UnCheckMouseOverImageProperty, value); }
        }

// Using a DependencyProperty as the backing store for UnCheckMouseOverImage. This enables animation, styling, binding, etc...
public static readonly DependencyProperty UnCheckMouseOverImageProperty =
DependencyProperty.Register("UnCheckMouseOverImage", typeof(ImageSource), typeof(ImageToggleButton), new PropertyMetadata(null));

public ImageSource UncheckPressedImage
        {
            get { return (ImageSource)GetValue(UncheckPressedImageProperty); }
            set { SetValue(UncheckPressedImageProperty, value); }
        }

// Using a DependencyProperty as the backing store for UncheckPressedImage. This enables animation, styling, binding, etc...
public static readonly DependencyProperty UncheckPressedImageProperty =
DependencyProperty.Register("UncheckPressedImage", typeof(ImageSource), typeof(ImageToggleButton), new PropertyMetadata(null));

private void unCheck_Click(object sender, RoutedEventArgs e)
        {
            this.IsChecked = true;
        }

private void check_Click(object sender, RoutedEventArgs e)
        {
            this.IsChecked = false;
        }

}
}

第二种：

该方法使触发器实现

xaml：

后台代码：

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Controls.Primitives;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace DrawText.Controls
{
    /// <summary>
    /// TriggerImageButton.xaml 的交互逻辑
    /// </summary>
    public partial class TriggerImageButton : ToggleButton
    {
        public TriggerImageButton()
        {
            InitializeComponent();
        }

public ImageSource CheckNormalImage
        {
            get { return (ImageSource)GetValue(CheckNormalImageProperty); }
            set { SetValue(CheckNormalImageProperty, value); }
        }

public ImageSource CheckPressedImage
        {
            get { return (ImageSource)GetValue(CheckPressedImageProperty); }
            set { SetValue(CheckPressedImageProperty, value); }
        }

}
}

ToggleButton图片按钮的两种制作方法相关推荐

Word中繁体艺术字的两种制作方法(转)
Word中繁体艺术字的两种制作方法(转) Word里的艺术字是大家平时常用的一项功能,但有时我们可能需要制作一些繁体艺术字,而这个看似简单的要求,实现起来却不是那么容易,因为Word里的繁简转换功能对 ...
OCR图片转文字两种python方法实现
图片转文字的两种处理方法: 一种是文字识别工作都需要在网络侧完成的方式,我们称为在线识别: 另一种是不需要互联网功能的,我们称作离线识别. 在线识别方式先看第一种,在线识别的方式.在线识别方式最大的 ...
PDF文件如何转换成转图片？分享两种实现方法
PDF文件通常是用于在不同计算机.操作系统和应用程序之间共享文档的标准格式.但有时,您可能需要将PDF文件转换为图像文件以进行其他用途.PDF文件如何转换成转图片?本文将介绍两种将PDF文件转换为图像 ...
android 图片叠加xml,Android实现图片叠加效果的两种方法
本文实例讲述了Android实现图片叠加效果的两种方法.,具体如下: 效果图: 第一种: 第二种: 第一种是通过canvas画出来的效果: public void first(View v) { // ...
pytorch加载自己的图片数据集的两种方法
目录 ImageFolder 加载数据集使用pytorch提供的Dataset类创建自己的数据集. Dataset加载数据集接下来我们就可以构建我们的网络架构: 训练我们的网络: 保存网络模型(这 ...
android 画布叠加,Android实现图片叠加效果的两种方法
本文实例讲述了Android实现图片叠加效果的两种方法.分享给大家供大家参考,具体如下: 效果图: 第一种: 第二种: 第一种是通过canvas画出来的效果: public void first(Vi ...
qt 加载图片旋转_QT 实现图片旋转的两种方法
第一种方案使用 QPixmap 的 transformed 函数来实现旋转,这个函数默认是以图片中心为旋转点,不能设置旋转的中心点,使用如下: QMatrix matrix; matrix.rota ...
D3D中2D图片的绘制两种方法
2014/09/19 (转载自:http://blog.csdn.net/rabbit729/article/details/6388703) 想要在D3D中加载2D图片可以使用如下两种方法(我只想到 ...
给TextView设置图片的两种实现方法
有时在开发过程中,我们会有在TextView中添加图片的需求(比如下图箭头所指文字中的表情).而在xml中对Textview进行属性设置时,只能设置图片在TextView的左.右.上.下四个位置,不能 ...

ToggleButton图片按钮的两种制作方法

ToggleButton图片按钮的两种制作方法相关推荐

最新文章

热门文章