WPF 实现火炬效果

于 2022-04-25 07:50:00 发布
阅读量253 收藏
点赞数
文章标签： vue python github c# go
原文链接：https://mp.weixin.qq.com/s?__biz=MzI0NDE0MDgyNg==&mid=2649597877&idx=4&sn=7ed9c5eed9408faa9472b44ff80655cd&chksm=f17b59c0c60cd0d6a7a40de853c76afaad6c44d778cd95d7909eeff7917f1199a6efca384de9&scene=126&&sessionid=0
版权

01

—

效果预览

02

—

代码如下

一、FireControl.cs 代码如下

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows;
using System.Windows.Controls;


namespace WPFDevelopers.Controls
{
    public class FireControl : Control
    {
        static FireControl()
        {
            DefaultStyleKeyProperty.OverrideMetadata(typeof(FireControl), new FrameworkPropertyMetadata(typeof(FireControl)));
        }


        public bool IsStart
        {
            get { return (bool)GetValue(IsStartProperty); }
            set { SetValue(IsStartProperty, value); }
        }


        // Using a DependencyProperty as the backing store for IsStart.  This enables animation, styling, binding, etc...
        public static readonly DependencyProperty IsStartProperty =
            DependencyProperty.Register("IsStart", typeof(bool), typeof(FireControl), new PropertyMetadata(default(bool)));
    }
}

二、OtherControl.xaml 代码如下

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                    xmlns:controls="clr-namespace:WPFDevelopers.Controls">
    <Style TargetType="controls:FireControl">
        <Setter Property="Background" Value="Transparent"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="controls:FireControl">
                    <ControlTemplate.Resources>
                        <Storyboard x:Key="PART_Fire_Storyboard" RepeatBehavior="Forever" Duration="0:0:0.1">
                            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="PART_Container" 
                                                           Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(RotateTransform.Angle)">
                                <LinearDoubleKeyFrame Value="-1" KeyTime="0:0:0" />
                                <LinearDoubleKeyFrame Value="1" KeyTime="0:0:0.2" />
                                <LinearDoubleKeyFrame Value="-1" KeyTime="0:0:0.4" />
                                <LinearDoubleKeyFrame Value="1" KeyTime="0:0:0.6" />
                                <LinearDoubleKeyFrame Value="-1" KeyTime="0:0:0.8" />
                                <LinearDoubleKeyFrame Value="1" KeyTime="0:0:1" />
                            </DoubleAnimationUsingKeyFrames>
                            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="PART_Container" 
                                                           Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[1].(ScaleTransform.ScaleY)">
                                <LinearDoubleKeyFrame Value="1" KeyTime="0:0:0.0" />
                                <LinearDoubleKeyFrame Value="1.3" KeyTime="0:0:0.2" />
                                <LinearDoubleKeyFrame Value="1" KeyTime="0:0:0.4" />
                                <LinearDoubleKeyFrame Value="1.3" KeyTime="0:0:0.5" />
                                <LinearDoubleKeyFrame Value="1" KeyTime="0:0:0.8" />
                                <LinearDoubleKeyFrame Value="1.3" KeyTime="0:0:1" />
                            </DoubleAnimationUsingKeyFrames>
                        </Storyboard>
                    </ControlTemplate.Resources>


                    <Viewbox>
                        <Grid x:Name="PART_Container"  Width="50" Height="50" RenderTransformOrigin="0,1">
                            <Grid.RenderTransform>
                                <TransformGroup>
                                    <RotateTransform CenterX="25" CenterY="25"/>
                                    <ScaleTransform/>
                                </TransformGroup>
                            </Grid.RenderTransform>
                            <Grid VerticalAlignment="Bottom">
                                <Path HorizontalAlignment="Center" VerticalAlignment="Bottom"  Stretch="Uniform" Height="50" Fill="OrangeRed"  
                                  Data="M563.308448 313.43188C495.439988 103.734035 591.338282 0 591.338282 0S276.514483 151.316058 183.199572 559.143951c-39.235011-56.442559-73.469923-87.328305-69.571197-77.222249 42.108942 109.060717-53.057357 157.906279-51.793818 272.879275 1.281557 114.954978 199.722422 246.534159 199.722422 246.53416l0.054055-0.164418a291.39766 291.39766 0 0 0 24.716706 16.349423 384.906268 384.906268 0 0 1-20.761672-26.948732c-21.511687-30.70331-36.61559-63.089087-36.964696-94.303668-0.677941-61.589057 26.252772-104.20927 44.982872-147.2867 16.23906-37.311549 26.345116-74.972205 6.810946-125.592576-3.076637-7.964122 17.63098 9.630821 45.750906 45.111254 54.850185-148.770963 108.878281-277.676668 108.878281-277.676668s1.391919 202.504009 70.028413 332.270091c64.424699 121.801961 60.56201 184.361758 60.56201 184.361757 117.189257-112.026992 156.385979-290.053039 156.385979-290.053039 42.602195 37.568311 67.098175 85.314752 80.884484 133.263899 29.036611 100.932178-30.95782 202.375628-32.295685 212.188885-0.567579 4.083414-1.610392 7.889796-2.488788 11.790774-4.101433 18.417031-11.479957 34.876817-21.640068 49.359086 11.00247-6.993382 21.439614-14.700741 31.489362-22.8473l0.054055 0.164418s182.895512-131.579181 184.159051-246.552178c1.263539-114.954978-93.900507-163.80054-51.793818-272.879275 3.644216-9.446133-24.185163 16.842676-57.724115 66.440504-33.210117-102.432208-54.485313-185.222135-165.46724-283.113712 0 0 20.522929 222.680084-97.434361 383.917509 0.020271 0.047298 41.451271-125.984476-26.435208-335.702591z" >
                                    <Path.Effect>
                                        <DropShadowEffect BlurRadius="6" Color="OrangeRed" ShadowDepth="0"/>
                                    </Path.Effect>
                                </Path>


                                <Path HorizontalAlignment="Center" VerticalAlignment="Bottom"  Stretch="Uniform" Margin="0,0,3,0" Height="44" Fill="Orange"  
                                  Data="M563.308448 313.43188C495.439988 103.734035 591.338282 0 591.338282 0S276.514483 151.316058 183.199572 559.143951c-39.235011-56.442559-73.469923-87.328305-69.571197-77.222249 42.108942 109.060717-53.057357 157.906279-51.793818 272.879275 1.281557 114.954978 199.722422 246.534159 199.722422 246.53416l0.054055-0.164418a291.39766 291.39766 0 0 0 24.716706 16.349423 384.906268 384.906268 0 0 1-20.761672-26.948732c-21.511687-30.70331-36.61559-63.089087-36.964696-94.303668-0.677941-61.589057 26.252772-104.20927 44.982872-147.2867 16.23906-37.311549 26.345116-74.972205 6.810946-125.592576-3.076637-7.964122 17.63098 9.630821 45.750906 45.111254 54.850185-148.770963 108.878281-277.676668 108.878281-277.676668s1.391919 202.504009 70.028413 332.270091c64.424699 121.801961 60.56201 184.361758 60.56201 184.361757 117.189257-112.026992 156.385979-290.053039 156.385979-290.053039 42.602195 37.568311 67.098175 85.314752 80.884484 133.263899 29.036611 100.932178-30.95782 202.375628-32.295685 212.188885-0.567579 4.083414-1.610392 7.889796-2.488788 11.790774-4.101433 18.417031-11.479957 34.876817-21.640068 49.359086 11.00247-6.993382 21.439614-14.700741 31.489362-22.8473l0.054055 0.164418s182.895512-131.579181 184.159051-246.552178c1.263539-114.954978-93.900507-163.80054-51.793818-272.879275 3.644216-9.446133-24.185163 16.842676-57.724115 66.440504-33.210117-102.432208-54.485313-185.222135-165.46724-283.113712 0 0 20.522929 222.680084-97.434361 383.917509 0.020271 0.047298 41.451271-125.984476-26.435208-335.702591z">
                                    <Path.Effect>
                                        <DropShadowEffect BlurRadius="10" Color="Orange" ShadowDepth="0"/>
                                    </Path.Effect>
                                </Path>


                                <Path HorizontalAlignment="Center" VerticalAlignment="Bottom"  Stretch="Uniform" Margin="0,0,3,0" Height="38" Fill="Gold"  
                                  Data="M563.308448 313.43188C495.439988 103.734035 591.338282 0 591.338282 0S276.514483 151.316058 183.199572 559.143951c-39.235011-56.442559-73.469923-87.328305-69.571197-77.222249 42.108942 109.060717-53.057357 157.906279-51.793818 272.879275 1.281557 114.954978 199.722422 246.534159 199.722422 246.53416l0.054055-0.164418a291.39766 291.39766 0 0 0 24.716706 16.349423 384.906268 384.906268 0 0 1-20.761672-26.948732c-21.511687-30.70331-36.61559-63.089087-36.964696-94.303668-0.677941-61.589057 26.252772-104.20927 44.982872-147.2867 16.23906-37.311549 26.345116-74.972205 6.810946-125.592576-3.076637-7.964122 17.63098 9.630821 45.750906 45.111254 54.850185-148.770963 108.878281-277.676668 108.878281-277.676668s1.391919 202.504009 70.028413 332.270091c64.424699 121.801961 60.56201 184.361758 60.56201 184.361757 117.189257-112.026992 156.385979-290.053039 156.385979-290.053039 42.602195 37.568311 67.098175 85.314752 80.884484 133.263899 29.036611 100.932178-30.95782 202.375628-32.295685 212.188885-0.567579 4.083414-1.610392 7.889796-2.488788 11.790774-4.101433 18.417031-11.479957 34.876817-21.640068 49.359086 11.00247-6.993382 21.439614-14.700741 31.489362-22.8473l0.054055 0.164418s182.895512-131.579181 184.159051-246.552178c1.263539-114.954978-93.900507-163.80054-51.793818-272.879275 3.644216-9.446133-24.185163 16.842676-57.724115 66.440504-33.210117-102.432208-54.485313-185.222135-165.46724-283.113712 0 0 20.522929 222.680084-97.434361 383.917509 0.020271 0.047298 41.451271-125.984476-26.435208-335.702591z">
                                    <Path.Effect>
                                        <DropShadowEffect BlurRadius="10" Color="Gold" ShadowDepth="0"/>
                                    </Path.Effect>
                                </Path>


                                <Path HorizontalAlignment="Center" VerticalAlignment="Bottom"  Stretch="Uniform" Height="32" Margin="0,0,3,0" Fill="LightYellow"  
                                  Data="M563.308448 313.43188C495.439988 103.734035 591.338282 0 591.338282 0S276.514483 151.316058 183.199572 559.143951c-39.235011-56.442559-73.469923-87.328305-69.571197-77.222249 42.108942 109.060717-53.057357 157.906279-51.793818 272.879275 1.281557 114.954978 199.722422 246.534159 199.722422 246.53416l0.054055-0.164418a291.39766 291.39766 0 0 0 24.716706 16.349423 384.906268 384.906268 0 0 1-20.761672-26.948732c-21.511687-30.70331-36.61559-63.089087-36.964696-94.303668-0.677941-61.589057 26.252772-104.20927 44.982872-147.2867 16.23906-37.311549 26.345116-74.972205 6.810946-125.592576-3.076637-7.964122 17.63098 9.630821 45.750906 45.111254 54.850185-148.770963 108.878281-277.676668 108.878281-277.676668s1.391919 202.504009 70.028413 332.270091c64.424699 121.801961 60.56201 184.361758 60.56201 184.361757 117.189257-112.026992 156.385979-290.053039 156.385979-290.053039 42.602195 37.568311 67.098175 85.314752 80.884484 133.263899 29.036611 100.932178-30.95782 202.375628-32.295685 212.188885-0.567579 4.083414-1.610392 7.889796-2.488788 11.790774-4.101433 18.417031-11.479957 34.876817-21.640068 49.359086 11.00247-6.993382 21.439614-14.700741 31.489362-22.8473l0.054055 0.164418s182.895512-131.579181 184.159051-246.552178c1.263539-114.954978-93.900507-163.80054-51.793818-272.879275 3.644216-9.446133-24.185163 16.842676-57.724115 66.440504-33.210117-102.432208-54.485313-185.222135-165.46724-283.113712 0 0 20.522929 222.680084-97.434361 383.917509 0.020271 0.047298 41.451271-125.984476-26.435208-335.702591z">
                                    <Path.Effect>
                                        <DropShadowEffect BlurRadius="10" Color="LightYellow" ShadowDepth="0"/>
                                    </Path.Effect>
                                </Path>
                            </Grid>
                        </Grid>
                    </Viewbox>


                    <ControlTemplate.Triggers>
                        <Trigger Property="IsStart" Value="True">
                            <Trigger.EnterActions>
                                <BeginStoryboard Storyboard="{StaticResource PART_Fire_Storyboard}" x:Name="part_fire_storyboard"/>
                            </Trigger.EnterActions>
                            <Trigger.ExitActions>
                                <StopStoryboard BeginStoryboardName="part_fire_storyboard"/>
                            </Trigger.ExitActions>
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
</Style>
</ResourceDictionary>

三、OtherControlExample.xaml 代码如下

<UserControl x:Class="WPFDevelopers.Samples.ExampleViews.OtherControlExample"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:local="clr-namespace:WPFDevelopers.Samples.ExampleViews"
             xmlns:wpfdev="https://github.com/yanjinhuagood/WPFDevelopers"
             mc:Ignorable="d" 
             d:DesignHeight="450" d:DesignWidth="800">
    <Grid>
        <Border HorizontalAlignment="Center" VerticalAlignment="Center"
                Background="{StaticResource BlackSolidColorBrush}"
                Height="200" Width="200">
            <StackPanel Orientation="Vertical" VerticalAlignment="Bottom"
                        Margin="0,10">
                <wpfdev:FireControl IsStart="True" Width="100" Height="100" Opacity="0.8"/>
                <Grid Width="100" Height="60">
                    <Path Data="M495.746032 859.654321l-7.223986-169.763668c-3.611993 0-7.223986-1.805996-12.641975-3.611993l10.835978 155.315696c0 7.223986 3.611993 14.447972 9.029983 18.059965zM530.059965 691.696649c-1.805996-1.805996-12.641975 1.805996-32.507937 0l5.41799 171.569665c3.611993 1.805996 5.417989 1.805996 9.029982 1.805996 5.417989 0 9.029982-1.805996 14.447972-3.611993 5.417989-111.971781 5.417989-167.957672 3.611993-169.763668z" Fill="#FFB938" Stretch="Fill"></Path>
                    <Path Data="M502.970018 863.266314l-5.41799-171.569665c-1.805996 0-5.417989 0-9.029982-1.805996l7.223986 169.763668c1.805996 1.805996 3.611993 3.611993 7.223986 3.611993z" Fill="#FFEA8B" Stretch="Fill"></Path>
                    <Path Data="M362.102293 572.500882h281.73545c-14.447972 77.657848-61.40388 115.583774-140.867725 115.583774s-126.419753-37.925926-140.867725-111.971781" Fill="#F49B1E" Stretch="Fill"></Path>
                    <Path Data="M358.4903 572.500882H573.40388c0 81.269841-30.70194 119.195767-93.911817 117.389771s-102.941799-43.343915-121.001763-117.389771z" Fill="#FFB938" Stretch="Fill"></Path>
                    <Path Data="M398.222222 572.500882c5.417989 36.119929 10.835979 59.597884 18.059965 72.239859 10.835979 18.059965 28.895944 37.925926 66.821869 43.343915h1.805997c0-1.805996-10.835979-7.223986-21.671958-16.253968-7.223986-7.223986-12.641975-18.059965-18.059964-30.70194-7.223986-12.641975-10.835979-34.313933-12.641976-68.627866h-34.313933z" Fill="#FFEA8B" Stretch="Fill"></Path>
                </Grid>
            </StackPanel>
            
        </Border>
    </Grid>
</UserControl>

源码地址

github：https://github.com/yanjinhuagood/WPFDevelopers.git

gitee：https://gitee.com/yanjinhua/WPFDevelopers.git

WPF开发者QQ群： 340500857 

Github：https://github.com/yanjinhuagood

版权：本作品采用「署名-非商业性使用-相同方式共享 4.0 国际」许可协议进行许可。

转载请著名作者 出处 https://github.com/yanjinhuagood

技术群：添加小编微信并备注进群

小编微信：mm1552923   

公众号：dotNet编程大全    

zls365365
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
WPF火焰图像特效——效果实例
04-22
WPF火焰图像特效——效果实例,适合初学都学习
WPF真实火焰粒子效果（转）
06-08
WPF真实火焰粒子效果
WPF超炫效果
04-15
Follow The Pointer 是开发WPF 动画的比较好的实例，通过了解其代码，你可以轻松构建属于你自己的WPF 动画
粒子效果实现简单火焰特效
03-21
粒子效果实现简单火焰特效，资源包包括粒子特效预制体，粒子火焰形状的动画贴图以及制作的材质。（制作时要把场景的光调暗）
C# WPF 实现 会呼吸的文字 效果
02-12
在本文中，我们将深入探讨如何使用C# WPF（Windows Presentation Foundation）来实现一个具有“呼吸”效果的文字特效。这种效果让文字周围的区域呈现出渐变的动态呼吸辉光，为用户界面增添了一种引人入胜的视觉体验...
WPF实现简单的跑马灯效果
10-19
总结来说，WPF实现简单的跑马灯效果主要利用了ViewBox的自适应功能、Canvas的绝对定位以及动画的连续播放，最终通过编程逻辑控制实现了一个基本的跑马灯展示效果。通过这种方式，可以灵活地调整跑马灯的展示项数、...
超炫酷的WPF实现Loading控件效果
01-21
Win8系统的Loading效果还是很不错的，网上也有人用CSS3等技术实现，研究了一下，并打算用WPF自定义一个Loading控件实现类似的效果，并可以让用户对Loading的颗粒（Particle）背景颜色进行自定义，话不多说，直接上...
WPF实现钟表效果
01-01
和之前一样首先看一下WPF钟表效果图 是不是很炫酷，上面的那个花都是带有动画效果的图片 。 接下来就是代码了。 首先看一下整个场景的布局搭建 <Window x:Class=QQDemo1.DateTimew xmlns=...
WPF制作的火苗例子
04-07
C#源码，WFP制作的火苗的例子，已经编译成功，可以独立运行，便于学习WPF的朋友参考。
参考特效 wpf Fire.zip
07-22
完整编译，童叟无欺！vs2010-2019均可。查阅大量资料，整合而来。
使用wpf 2d 火焰效果
12-29
WPFFireApp wpf 火焰 2d
WPF呼吸闪烁效果例子
02-09
一个WPF呼吸闪烁效果的例子 更多资源： http://cleopard.download.csdn.net
WPF破解版Visfire控件，Toolkit控件
02-22
WPF破解版Visfire控件，Toolkit控件。
WPF 星空效果
04-25
WPF 星空效果
超炫的图片爆炸效果
切图仔
04-04 1390
css样式： &lt;style type="text/css"&gt; *{margin: 0;padding: 0;list-style: none;} body{overflow: hidden;} #div{ width: 640px;height: 400px;position: absolute;left: 50%;top: 50%;mar...
火焰特效MaxScript——1.2版
风达的专栏
05-09 1500
实现功能：增加一个可以调节火焰密度的Spinner通过调节Spinner的值实现火焰的浓烈程度utility FireEffect "火焰特效" width:162 height:245( button btn1 "火焰" pos:[12,20] width:140 height:30 bitmap bmp1 "" pos:[12,70] width:140 heigh
WPF入门之hello WPF！
火焰
08-20 580
环境：vs2013 1.启动vs2013，创建wpf项目 2.创建后的项目结构 需要注意的是，这个App.xaml是程序的起点，里面“x：Class"表示它编译用的类名，但是不一定非的是App.xaml.cs文件里定义的类,即使随便写一个不存在的类也是可以的。 StartupUri表示定义的主窗体 3.主窗体的代码MaiWindow.xaml <Window x:Cla
C#开发WPF/Silverlight动画及游戏系列教程(Game Tutorial)：(三十二) 雷、混、冰、毒、火、风 - 幻化中的魔法魅力！...
weixin_33982670的博客
09-09 126
魔法的魅力不仅仅因为其华丽的外表，更深层次的，它们的额外附加属性效果使得游戏世界更加幻化多彩！无论是中式的金木水火土5行，还是欧式的水火风雷，异或是日式的风林火山等等，在目前的网游世界中无处不得到体现。更甚者，由此衍生出来的好比火影中的混合属性更推动了魔法属性概念的再一次升华。 本节，我将为大家演示如何为游戏中的魔法增加华丽的附加属性。 第一步，定义规则： 1）定义魔法附加属性分类：在本教程...
wpf 实现走图效果
最新发布
11-20
要在WPF中实现走图效果，可以通过使用动画和布局来实现。 首先，可以使用WPF的动画功能来实现角色的走动效果。可以使用WPF提供的动画类如DoubleAnimation或KeyFrameAnimation来实现人物行走时的连续动作。通过设置...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值