原文:WPF自定义动画控件 风机

一：创建WPF项目

二：在项目下添加文件Themes,在此文件下添加新项 ”资源词典“取名为 Generic.xaml  注意大小写，之前遇到因为大小写不对应，导致出错的情况
Generic.xaml文件代码如下：

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                    xmlns:local="clr-namespace:YinFengJi">
    <Style TargetType="{x:Type local:YinFengJ}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type local:YinFengJ}">
                    <Viewbox>
                        <Canvas Height="100" Width="80" Background="Transparent">
                            <!--给水泵 右侧 通道-->
                            <Rectangle Canvas.Left="35" Canvas.Top="14.1" Width="28.3" Height="14.5">
                                <Rectangle.Fill>
                                    <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                                        <GradientStop Offset="0" Color="#646768"></GradientStop>
                                        <GradientStop Offset="0.2" Color="#EFEEF3"></GradientStop>
                                        <GradientStop Offset="0.5" Color="#EFEEF3"></GradientStop>
                                        <GradientStop Offset="1" Color="#646768"></GradientStop>
                                    </LinearGradientBrush>
                                </Rectangle.Fill>
                            </Rectangle>

<!--给水泵 右侧 关节-->
                            <Path Stroke="#7E7E7E" StrokeThickness="1"   Data="M71.4,27.7c0,1.6-2,2.9-4.5,2.9l0,0c-2.5,0-4.5-1.3-4.5-2.9v-12.7c0-1.6,2-2.9,4.5-2.9l0,0
 c2.5,0,4.5,1.3,4.5,2.9V27.7z">
                                <Path.Fill>
                                    <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                                        <GradientStop Offset="0" Color="#646768"></GradientStop>
                                        <GradientStop Offset="0.2" Color="#EFEEF3"></GradientStop>
                                        <GradientStop Offset="0.5" Color="#EFEEF3"></GradientStop>
                                        <GradientStop Offset="1" Color="#646768"></GradientStop>
                                    </LinearGradientBrush>
                                </Path.Fill>
                            </Path>
                            <!--给水泵 外边框-->
                            <Ellipse  Canvas.Left="9.7" Canvas.Top="14" Width="50.2" Height="50.2">
                                <Ellipse.Fill>
                                    <LinearGradientBrush StartPoint="0,0" EndPoint="1,1">
                                        <GradientStop Offset="0" Color="#BEBFC1"></GradientStop>
                                        <GradientStop Offset="0.52" Color="#BEBFC1"></GradientStop>
                                        <GradientStop Offset="0.54" Color="#7A7D7C"></GradientStop>
                                        <GradientStop Offset="1" Color="#7A7D7C"></GradientStop>
                                    </LinearGradientBrush>
                                </Ellipse.Fill>
                            </Ellipse>
                            <!--给水泵 风扇 背景-->
                            <Ellipse Fill="#626968" Canvas.Left="15.1" Canvas.Top="19.4" Width="39.4" Height="39.4"/>
                            <!--给水泵 三个 扇页-->
                            <Grid x:Name="GridFanJiShuiBeng" Canvas.Left="15.3" Canvas.Top="18.6" Width="39.4" Height="39.4" RenderTransformOrigin="0.5,0.5">
                                <Canvas Width="39.4" Height="39.4">
                                    <Path Fill="#010C00" Data="M21.5,35.4c-0.3-0.1-0.6-0.3-0.9-0.5c-4.3-2.6-5.7-8.2-3.1-12.5c0.6-1,1.4-1.9,2.3-2.6
 c-4.1-1.9-9.1-0.4-11.5,3.5c-2.6,4.3-1.2,9.9,3.1,12.5C14.7,37.9,18.7,37.6,21.5,35.4z"/>
                                    <Path Fill="#010C00" Data="M5.3,13.5c0.3-0.2,0.5-0.4,0.8-0.6c4.3-2.6,9.9-1.3,12.5,3c0.6,1,1,2.1,1.2,3.3c3.6-2.8,4.6-7.9,2.1-11.9
 c-2.6-4.3-8.2-5.6-12.5-3C6.5,7.1,4.7,10,5.3,13.5z"/>
                                    <Path Fill="#010C00" Data="M32.4,10.4c0,0.3,0.1,0.7,0.1,1c0,5-4.1,9.1-9.1,9.1c-1.2,0-2.4-0.2-3.4-0.7c0.5,4.5,4.3,8,9,8
 c5,0,9.1-4.1,9.1-9.1C38,15,35.7,11.7,32.4,10.4z"/>
                                </Canvas>
                            </Grid>
                            <!-- 风扇 圆心-->
                            <Ellipse Fill="#FCFCFC" Canvas.Left="32" Canvas.Top="35.3" Height="6" Width="6"/>

<Path Fill="#5C6162" Data="M27.2,69.3c0,1-0.6,1.8-1.2,1.8h-7.5c-0.7,0-1.2-0.8-1.2-1.8v-1.8c0-1,0.6-1.8,1.2-1.8h7.5
 c0.7,0,1.2,0.8,1.2,1.8V69.3z"/>
                            <Path Fill="#5C6162" Data="M27.6,60.5c1.3,0.3,2.2,1.1,2,1.8l-2.1,7.8c-0.2,0.7-1.4,1.1-2.7,0.8l-2.4-0.5c-1.3-0.3-2.2-1.1-2-1.8
 l2.1-7.8c0.2-0.7,1.4-1.1,2.7-0.8L27.6,60.5z"/>
                            <Path Fill="#5C6162" Data="M43.7,59.9c1.3-0.3,2.5,0.1,2.7,0.8l2,7.9c0.2,0.7-0.7,1.5-2,1.8l-2.4,0.5c-1.3,0.3-2.5-0.1-2.7-0.8l-2-7.9
 c-0.2-0.7,0.7-1.5,2-1.8L43.7,59.9z"/>
                            <Path Fill="#5C6162" Data="M51.2,69.3c0,1-0.6,1.8-1.2,1.8h-7.5c-0.7,0-1.2-0.8-1.2-1.8v-1.8c0-1,0.6-1.8,1.2-1.8h7.5
 c0.7,0,1.2,0.8,1.2,1.8V69.3z"/>

<!--标题-->
                            <TextBlock x:Name="JiShuiBengTitle" Text="给水泵" FontSize="20" FontWeight="Bold" Canvas.Left="7.1" Canvas.Top="74.4"></TextBlock>
                            <!--风力值-->
                            <TextBlock x:Name="FanValue" Visibility="Hidden"></TextBlock>
                        </Canvas>
                    </Viewbox>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</ResourceDictionary>

三：在项目下添加实现类

代码如下：

using System;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Media;
using System.Windows.Media.Animation;

namespace YinFengJi
{
    /// <summary>
    ///
    /// </summary>
    public class YinFengJ : Button
    {
        /// <summary>
        /// 转速设置
        /// </summary>
        private int RotationRate = 0;
        /// <summary>
        /// 动画 重复 次数
        /// </summary>
        private int RotationRepeatTime = 100000;
        static YinFengJ()
        {
            DefaultStyleKeyProperty.OverrideMetadata(typeof(YinFengJ), new FrameworkPropertyMetadata(typeof(YinFengJ)));

}
        #region 控件列表
        /// <summary>
        /// 风扇 扇页元素
        /// </summary>
        Grid _GridFanJiShuiBeng = null;
        /// <summary>
        /// 风力大小
        /// </summary>
        TextBlock _FanValue = null;
        /// <summary>
        /// 动画标题
        /// </summary>
        TextBlock _JiShuiBengTitle = null;
        #endregion

#region 控件绑定
        public override void OnApplyTemplate()
        {
            base.OnApplyTemplate();
            _GridFanJiShuiBeng = GetTemplateChild("GridFanJiShuiBeng") as Grid;
            _FanValue = GetTemplateChild("FanValue") as TextBlock;
            _JiShuiBengTitle = GetTemplateChild("JiShuiBengTitle") as TextBlock;

_FanValue.SetBinding(TextBlock.TextProperty, new Binding("FanValue") { Source = this });
            _JiShuiBengTitle.SetBinding(TextBlock.TextProperty, new Binding("JiShuiBengTitle") { Source = this });
            _GridFanJiShuiBeng.SetBinding(Grid.StyleProperty, new Binding("FanValue") { Source = this });
        }
        #endregion

#region 依赖及属性

/// <summary>
        /// 标题
        /// </summary>
        public string JiShuiBengTitle
        {
            get { return (string)GetValue(_JiShuiBengTitleProperty); }
            set { SetValue(_JiShuiBengTitleProperty, value); }
        }
        public static readonly DependencyProperty _JiShuiBengTitleProperty =
            DependencyProperty.Register("JiShuiBengTitle", typeof(string), typeof(YinFengJ), new PropertyMetadata("引风机"));
        /// <summary>
        /// 风力值
        /// </summary>
        public float FanValue
        {
            get { return (float)GetValue(_FanValueProperty); }
            set { SetValue(_FanValueProperty, value); }
        }
        public static readonly DependencyProperty _FanValueProperty =
            DependencyProperty.Register("FireValue", typeof(float), typeof(YinFengJ), new PropertyMetadata(0f, FanValueCallBack));

private static void FanValueCallBack(DependencyObject d, DependencyPropertyChangedEventArgs e)
        {
            (d as YinFengJ).FanValueStoryboardPlay(e);
        }
        private void FanValueStoryboardPlay(DependencyPropertyChangedEventArgs e)
        {
            float newV = float.Parse(e.NewValue.ToString());
            float oldV = float.Parse(e.OldValue.ToString());
            转速设置
            RotationRepeatTime = 100000;
            if (newV == 1)
            {
                RotationRate = 35000;
            }
            else if (newV == 2)
            {
                RotationRate = 16000;
            }
            else if (newV == 3)
            {
                RotationRate = 6000;
            }
            else if (newV == 0)
            {
                RotationRepeatTime = 0;
            }
            //元素 转动动画
            RotateTransform rtGSB = new RotateTransform();
            rtGSB.CenterX = 0;
            rtGSB.CenterY = 0;
            _GridFanJiShuiBeng.RenderTransform = rtGSB;
            //rotationRate = 9000;
            DoubleAnimation GSB_DA = new DoubleAnimation(0, 3000, new Duration(TimeSpan.FromMilliseconds(RotationRate)));
            GSB_DA.RepeatBehavior = new RepeatBehavior(RotationRepeatTime);
            rtGSB.BeginAnimation(RotateTransform.AngleProperty, GSB_DA);
        }
        #endregion
    }
}

四：以类库项目输出，就可以作为控件用于其它WPF项目了

此程序中的Generic.xaml 是由，svg格式图中的元素修改来的，注意svg图片元素跟xaml格式的区别

WPF自定义动画控件 风机相关推荐

  1. WPF自定义仪表盘控件

    WPF自定义仪表盘控件 一.前言 二.功能实现 一.前言 在学习和工作中使用WPF时,都离不开自定义控件的使用,今天分享一个自己在学习过程中使用到的一个自定义仪表盘控件,感觉挺不错的,在这里分享给大家 ...

  2. 通过WPF自定义ListBox控件实现ListBoxItem中开关及删除功能

    通过WPF自定义ListBox控件实现类似CAD图层关闭与删除功能 文章目录 通过WPF自定义ListBox控件实现类似CAD图层关闭与删除功能 前言 一.程序界面设计 二.代码部分 2.1前端代码 ...

  3. WPF 自定义DataGrid控件样式

    WPF 自定义DataGrid控件样式 样式一: 样式代码: <!--DataGrid样式--><Style TargetType="DataGrid">& ...

  4. WPF 自定义TabControl控件样式（转）

    WPF 自定义TabControl控件样式 一.前言 程序中经常会用到TabControl控件,默认的控件样式很普通.而且样式或功能不一定符合我们的要求.比如:我们需要TabControl的标题能够居 ...

  5. wpf 自定义combox控件

    关键步骤 1.新建usercontrol使用基本的控件进行设计 2.依赖属性的定义,目的:外部调用时候能够使用属性进行控件样式的控制 例如 Width="200" DisplayM ...

  6. WPF 自定义放大镜控件

    控件名:Magnifier 作   者:WPFDevelopersOrg - 驚鏵 原文链接[1]:https://github.com/WPFDevelopersOrg/WPFDevelopers ...

  7. WPF Calendar 日历控件 样式自定义

    原文:WPF Calendar 日历控件 样式自定义 粗略的在代码上做了些注释 blend 生成出来的模版 有的时候 会生成 跟 vs ui界面不兼容的代码 会导致可视化设计界面 报错崩溃掉 但是确不 ...

  8. iOS 自定义无限循环滚动广告动画控件

    iOS  自定义无限循环广告动画控件 自定义循环滚动的广告控件,支持水平和竖直两个动画方向,页码标记是自定义的,可以随意控制大小位置和颜色等 效果图: 下载地址: https://github.com ...

  9. WPF控件之自定义TextBox控件

    首先我们要知道用户控件与自定义用户控件的确保 用户控件 1将多个现有的控件组合成一个可重用的"组". 2不能使用样式和模板. 3继承自UserControl类. 自定义控件 1在现 ...

最新文章

  1. 移动磁盘格式化了，要如何寻回数据
  2. javascript学习系列(17):数组中的find方法
  3. C语言入门基础——Brute-Force算法
  4. PHP+MySQL 手工注入语句大全 推荐
  5. /usr/bin/python^M: bad interpreter: No such file or directory
  6. 数据库镜像怎么还原数据库_如何创建数据库镜像
  7. J2SE:Java环境搭建探究环境变量
  8. 谷歌免费GPU训练星际2AI好难？你需要份debug指南
  9. Create-React-App创建antd-mobile开发环境
  10. 2020年开发者大会资料和武大定量遥感视频分享（部分）
  11. 夜间灯光数据dn值_黑夜给了我黑色的眼睛——全球夜间灯光数据分析
  12. 数字图像处理(冈萨雷斯)学习 第二章 数字图像基础
  13. 百度云盘资源迁移到阿里云盘
  14. 23种设计模式设计原则
  15. java 获取yyyymmdd_从JS日期对象获取YYYYMMDD格式的字符串？
  16. python概率编程_TensorFlow新功能：TensorFlow Probability概率编程工具箱介绍
  17. mysql分页查询出租房屋信息_分页查询信息（使用jdbc连接mysql数据库实现分页查询任务）...
  18. Vue 和 React 的diff有什么不同
  19. 我们的新书--《我是一只IT小小鸟》
  20. 《计算机系统基础》—— 运算

热门文章

  1. spring学习--AOP术语
  2. r语言 新增一列数字类型_R语言实战之R语言基础语法精讲（一）
  3. opencv双线程图片处理_打开正经图片，你可能会看到一张黄图，这种造假方法能同时骗过 AI 和人眼...
  4. linux 开机加载的文档,Linux 修改文档“打开方式”
  5. Redis基本数据类型、应用场景、操作指令
  6. python mongodb查询速度优化_Mongodb 3 查询优化（语句优化、建索引）
  7. 毕业生推荐表计算机水平新国二,实用信息 | 2018届毕业指南：毕业生推荐表与三方协议...
  8. SpringBoot修改默认端口号
  9. guid会重复么_饿了么请你考虑一下消费者
  10. excel如何做出弧形_如何做出酷炫且实用的可视化大屏？Excel和PPT该淘汰了