WPF/Silverlight深度解决方案:(七)HLSL自定义渲染特效之完美攻略(中)
通过上一节的解说,大家是否已经对HLSL有了较深刻的认识和理解,HLSL的渲染不仅仅局限于静态处理,通过时时更新HLSL代码的各全局变量值同样可以实现动画形式的渲染,非常Cool对吧~。那么本节我将向大家介绍如何在Silverlight平台上实现HLSL动画渲染特效。
以BandedSwirl(螺旋波纹)渲染特效为例,我们首先要做的是按照上一节的方法将BandedSwirl.ps文件添加进项目中,同时创建一个对应的BandedSwirl.cs文件:
using System.Windows;
using System.Windows.Media;
using System.Windows.Media.Effects;
namespace Silverlight.Shader {
public class BandedSwirl : ShaderEffect {
public static DependencyProperty InputProperty = ShaderEffect.RegisterPixelShaderSamplerProperty("Input", typeof(BandedSwirl), 0);
public static DependencyProperty CenterProperty = DependencyProperty.Register("Center", typeof(System.Windows.Point), typeof(BandedSwirl), new PropertyMetadata(new System.Windows.Point(), PixelShaderConstantCallback(0)));
public static DependencyProperty SpiralstrengthProperty = DependencyProperty.Register("Spiralstrength", typeof(double), typeof(BandedSwirl), new PropertyMetadata(new double(), PixelShaderConstantCallback(1)));
public static DependencyProperty DistancethresholdProperty = DependencyProperty.Register("Distancethreshold", typeof(double), typeof(BandedSwirl), new PropertyMetadata(new double(), PixelShaderConstantCallback(2)));
public BandedSwirl(PixelShader shader) {
PixelShader = shader;
this.UpdateShaderValue(InputProperty);
this.UpdateShaderValue(CenterProperty);
this.UpdateShaderValue(SpiralstrengthProperty);
this.UpdateShaderValue(DistancethresholdProperty);
}
public virtual System.Windows.Media.Brush Input {
get {
return ((System.Windows.Media.Brush)(GetValue(InputProperty)));
}
set {
SetValue(InputProperty, value);
}
}
public virtual System.Windows.Point Center {
get {
return ((System.Windows.Point)(GetValue(CenterProperty)));
}
set {
SetValue(CenterProperty, value);
}
}
public virtual double Spiralstrength {
get {
return ((double)(GetValue(SpiralstrengthProperty)));
}
set {
SetValue(SpiralstrengthProperty, value);
}
}
public virtual double Distancethreshold {
get {
return ((double)(GetValue(DistancethresholdProperty)));
}
set {
SetValue(DistancethresholdProperty, value);
}
}
}
}
接下来在后台cs代码中创建渲染特效实例:
pixelShader = new PixelShader() {
UriSource = GetShaderUri("BandedSwirl.ps")
};
BandedSwirl bandedSwirl = new BandedSwirl(pixelShader) {
Center = new Point(0.5, 0.5),
Spiralstrength = 1,
Distancethreshold = 0
};
Spirit.Effect = bandedSwirl;
最后就是关键环节了,如何实现动画效果呢?大家是否有注意到BandedSwirl类中的CenterProperty、SpiralstrengthProperty、DistancethresholdProperty这三个DependencyProperty(关联属性)参数,它们分别代表该渲染特效的中心、螺旋强度和延伸阈值。由于是关联属性,所以我们可以直接使用Storyboard去实现基于它们的渐变动画,那么以动态修改Distancethreshold值为例,具体实现代码如下:
BeginShaderAnimation(bandedSwirl, 0, 1, 3, "Distancethreshold");
/// <summary>
/// 启动渲染动画
/// </summary>
private void BeginShaderAnimation(DependencyObject shader, double from, double to, double timeSpanFromSeconds, string dependencyProperty) {
if (storyboard != null) { storyboard.Stop(); }
storyboard = new Storyboard();
storyboard.RepeatBehavior = RepeatBehavior.Forever;
storyboard.AutoReverse = true;
doubleAnimation = new DoubleAnimation();
doubleAnimation.From = from;
doubleAnimation.To = to;
doubleAnimation.Duration = new Duration(TimeSpan.FromSeconds(timeSpanFromSeconds));
Storyboard.SetTarget(doubleAnimation, shader);
Storyboard.SetTargetProperty(doubleAnimation, new PropertyPath(dependencyProperty));
storyboard.Children.Add(doubleAnimation);
storyboard.Begin();
}
通过一个Storyboard故事板,我们让bandedSwirl渲染特效的Distancethreshold值在3秒时间内从改变到1,然后反序列帧执行并不断循环。至此一个基于HLSL的螺旋波纹渲染特效就制作完成啦!以同样的方法我还特意制作了波浪渲染动画、放大渲染动画、模糊缩放渲染动画、环状发散渲染动画、挤压收缩渲染动画等几个动画,都非常非常的Cool哦~下面是它们的效果截图:
在线演示Demo:
有些遗憾的是,目前的Silverlight3.0版本仅支持基于pixel(像素)的渲染,暂时还无法实现基于Vertex(顶点)的HLSL渲染,但是这些已经很大程度上能够满足我们现有的需求。基于HLSL的动画渲染特效能够通过简单的代码编写再配上合适的图片即可实现诸如光晕、雨雪、云雾、闪电、冰块等环境特效以及爆炸、激光、水晶等魔法特效,这一切一切的实现仅仅使用最大不过几十KB的存储空间。Silverlight的明天更美好!我坚信。
![](http://static.oschina.net/uploads/img/201203/09130741_M6OV.jpg)
出处: http://alamiye010.cnblogs.com/
本系列目录及源码下载: 点击进入( 欢迎加入WPF/Silverlight小组 WPF/Silverlight博客团队)
本文版权归作者和博客园共有,欢迎转载。但未经作者同意必须保留此段声明,且在文章页面显著位置给出原文连接,否则保留追究法律责任的权利。
原文链接: http://www.cnblogs.com/alamiye010/archive/2009/09/28/1576033.html
转载于:https://my.oschina.net/chen106106/blog/43619
WPF/Silverlight深度解决方案:(七)HLSL自定义渲染特效之完美攻略(中)相关推荐
- HLSL自定义渲染特效之完美攻略(中)
通过上一节的解说,大家是否已经对HLSL有了较深刻的认识和理解,HLSL的渲染不仅仅局限于静态处理,通过时时更新HLSL代码的各全局变量值同样可以实现动画形式的渲染,非常Cool对吧~.那么本节我将向 ...
- WPF/Silverlight深度解决方案:(十六)传值实现
许多开发者在从.NET网站开发向Silverlight转型过程中往往都会经历一个比较郁闷的过度期:Silverlight作为镶嵌在网页中的插件,如何能像传统ASP.NET网页一样实现页面切换及参数传递 ...
- WPF/Silverlight深度解决方案:(二)Silverlight源码之自我保护
Silverlight应用程序发布时会将所有本地资源及类库dll打包进xap文件中,好处是可以非常方便的在网页中部署及桌面化使用:但是同时带来了高度的源码泄露风险.众所周知,xap文件可以被zip等解 ...
- WPF/Silverlight深度解决方案:(二)Silverlight源码之自我保护(加密)
Silverlight应用程序发布时会将所有本地资源及类库dll打包进xap文件中,好处是可以非常方便的在网页中部署及桌面化使用:但是同时带来了高度的源码泄露风险.众所周知,xap文件可以被zip等解 ...
- WPF/Silverlight深度解决方案:Silverlight源码之自我保护
Silverlight应用程序发布时会将所有本地资源及类库dll打包进xap文件中,好处是可以非常方便的在网页中部署及桌面化使用:但是同时带来了高度的源码泄露风险.众所周知,xap文件可以被zip等解 ...
- 机器人聊天软件c#_使用python3.7配置开发钉钉群自定义机器人(2020年新版攻略)
原文转载自「刘悦的技术博客」https://v3u.cn/a_id_132 最近疫情比较严重,很多公司依靠阿里旗下的办公软件钉钉来进行远程办公,当然了,钉钉这个产品真的是让人一言难尽,要多难用有多难用 ...
- 使用python3.7配置开发钉钉群自定义机器人(2020年新版攻略)
最近疫情比较严重,很多公司依靠阿里旗下的办公软件钉钉来进行远程办公,当然了,钉钉这个产品真的是让人一言难尽,要多难用有多难用,真的让人觉得阿里的pm都是脑残才会设计出这种脑残产品,不过吐槽归吐槽,该用 ...
- java 自定义形状按钮_制作自定义背景Button按钮、自定义形状Button的全攻略
在Android开发应用中,默认的Button是由系统渲染和管理大小的.而我们看到的成功的移动应用,都是有着酷炫的外观和使用体验的.因此,我们在开发产品的时候,需要对默认按钮进行美化.在本篇里,笔者结 ...
- flutter 卡顿_Flutter渲染性能优化全攻略(解决应用卡顿)
大规模应用开发过程中,性能优化是重中之重,其中包括了包体积,UI 渲染.交互等多个方面. 在之前的文章中,我通过 Flutter 应用的混淆为入口,探讨了应用包体积优化的实践方案,本文,我把话题再次转 ...
最新文章
- C/C++中未定义行为
- 数据中心怎么关机?光有UPS还不够
- 经典C语言程序100例之三九
- jdbc map获取keys_跟我学shardingjdbc之分布式主键及其自定义
- C#中读取文件内容本文分步介绍了如何从文本文件
- egg.js java 生产数据_eggjs中,自动从数据库直接生成model.
- 1.Hello,Python
- TRUNCATE TABLE恢复-脚本
- 实测6大App「青少年模式」:有徒具形式,也有虚情假意!
- 单片机原理及应用 C51编程 proteus仿真
- [显卡直通]Server 2016/2019 Hyper-V显卡直通Win10教学及过程中会遇到的问题搜集以及详解-第一章DDA设备以及准备
- Flink 1.12.2 源码浅析 : JobGraph
- 2020BAJT等九大一线大厂的薪资和职级对比
- 线上展厅视觉奇观 广州商迪
- 【Git】如何实现部分提交
- 自助出版网站Lulu.com
- 如何利用canvas画一个圆,并且填充颜色
- 目前最流行的 5 大 Vue 动画库,使用后太炫酷了
- Cutterman插件
- 军事标图计算机软件,基于AreEngine的军事标图系统
热门文章
- 【Python学习教程】Python列表(list)、元组(tuple)、字典(dict)和集合(set)详解
- 基于并行搜索的低信噪比环境下GPS信号检测算法FPGA实现
- XTU1254 Blance 如何实现称出1∼n 克的物品,请问最少需要几颗砝码?
- 智汀如何连接华为智能音箱?
- 安卓手机无法更新Chrome,在谷歌商店点击更新无响应问题解决
- npm install up to date, audited 733 packages in 13s
- 域名解析与nginx配置
- 投影机使用需要了解哪些知识?
- 一中文字转换成拼音的实现方式--基于HanziToPinyin.java类
- js生成token 七牛云_七牛云存储 - 七牛:php 生成带多个策略的 token 的问题