要求

用户级别

初级

必需产品

  • Flash Player 10
  • Flash Professional CS4 (下载试用版)

范例文件

  • pixel_bender_04.zip (5 KB)

其他要求

Pixel Bender Toolkit

  • Pixel Bender Toolkit 2.0 for Macintosh (DMG, 77 MB)
  • Pixel Bender Toolkit 2.0 for Windows (ZIP, 48.8 MB)

在本文中,你会学到如何编写一个Pixel Bender内核,将同一图像的像素组合使用。如果你是从本教程的第一篇文章开始学习的话,你已经在每一小节的学习之后,得到了本节所需要的文件。这次,我们将按照 本系列第一篇文章的步骤,创建一种新的过滤器。

这是本系列的第四部分,本系列是讲述如何使用Pixel Bender Toolkit在位图上渲染视觉效果的教程。在前一节中,你已经学习到了如何给过滤器添加参数来创建一个滑动条接口,以及如何使滑动条影响预览窗口中图像的效果。你也了解到如何给参数添加元数据,确保显示特效的一致性。在本节中,你会学习到如何从同一图像中采样多个像素。

设置文件

如果你希望检查一下代码,下载提供的样例文件。按照如下步骤开始我们的学习:

  1. 选择File > New Kernel创建新的过滤器。
  2. 加载YellowFlowers.png,按照第一部分的描述修改内核的元数据。
  3. 点击Run按钮,运行过滤器。
  4. 检查没有语法错误之后,选择File > Save Filter。
  5. 将文件命名为Exercise4.pbk,然后将其存在你的桌面上的pixel_bender文件夹中。

添加浮点参数。

在本节中,你将需要利用你在第三节学到的知识,在代码中加入参数。按照如下步骤:

  1. 找到这行代码:
output pixel4 dst;
  1. >在这行代码之后,添加一个 浮点 参数 amount:
parameter float amount;
  1. 在上行代码之后,将参数的元数据设置为如下值:
< minValue: -5.0; maxValue: 5.0; defaultValue: 0.0; >;

注意: 打开样例文件中的Exercise4FilterB.pbk,你会发现它已经修改完毕了。

  1. 修改过代码之后,应该是如下样子:
<languageVersion : 1.0;> kernel Part4Filter < namespace : "com.adobe.devnet.pixelbender"; vendor : "Kevin's Filter Factory"; version : 2; description : "Playing around with pixels"; > { input image4 src; output pixel4 dst; parameter float amount < minValue: -5.0; maxValue: 5.0; defaultValue: 0.0; >; void evaluatePixel() { dst = sampleNearest(src,outCoord()); } }
  1. 如果你遇到错误,将你的代码和上面的例子进行比较。然后进行必需的修改。

采样第二个像素

在这一节中,你会学到如何编写代码采样第二个像素,并且将值储存在你声明的一个新变量中,按照如下步骤:

  1. 找到采样代码:
dst = sampleNearest(src,outCoord());
  1. 在上行代码之后,加入如下代码:
pixel4 dst2 = sampleNearest(src, outCoord()+float2(amount, amount));
  1. 点击Run按钮,运行过滤器。如果出现语法错误,将你的代码和上述代码进行比较。图像不会发生改变,因此现在你还没有修改存储在变量dst中的输出像素。
  2. 如果你没有遇到语法错误,选择File > Save Filter存储过滤器。

    注意: dst2是一个新变量,它存储的是图像中坐标为(amount,amount)的像素的值。

  3. 将这行代码加入到evaluatePixel 函数之后:
dst += dst2;
  1. 做出这些改变之后,检查你的代码,应该和如下代码类似:
Dst Void evaluatePixel() { dst = sampleNearest(src, outCoord()); pixel4 dst2 = sampleNearest(src, outCoord()+float2(amount, amount)); dst += dst2; }
  1. 点击Run按钮,运行过滤器。
  2. 检查没有语法错误之后,选择File > Save Filter。
  3. 当你将滑动条的游标置于默认位置的时候,图像看起来亮度会是之前的两倍。当你移动游标的时候,它会导致图片看起来像如下的样子(见图1)。
图1.预览窗口中的过饱和的图像

在运行过滤器的时候,图像的两条黑色边显示出来了,因为在图片的边界采样返回的颜色是透明的黑色。

削减像素值

现在的过滤器因为是将像素值相加,所以会导致色彩的过饱和。在这节中,你将会学到如何改正这个问题,将饱和度返回到原来的级别。

按照如下步骤:

  1. 找到如下代码:
dst += dst2;
  1. 在这行代码之后添加如下代码:
dst /= 2.0;
  1. 点击Run按钮,运行过滤器。
  2. 检查没有语法错误之后,选择 File > Save Filter 储存过滤器。

注意,如果你将滑动条的游标置于默认位置,图像是没有发生改变的。只有当你修改代码,将像素值相加并且将其和除以2.0之后(将饱和度削减为原来级别)之后才会看到效果。

当你移动游标的时候,偏移效果如下,颜色看起来并不是很亮(见图2)。

图2.图像的偏移效果

按照本系列第二部分 的教程,将Pixel Bender代码导出,这样你可以在Flash中使用它们,按照如下步骤:

  1. 选择 Build > Turn on Flash Player Warnings and Errors。这个选项能够让Flash Player在运行的时候检查过滤器,帮助你检查问题所在。
  2. 点击Run按钮,运行过滤器。
  3. 检验过滤器能否不报错误地成功运行。
  4. 选择 File > Export Kernel Filter for Flash Player。

在Export对话框中输入过滤器的名字: Exercise4Filter.pbj,然后将其存储在你的桌面上的pixel_bender文件夹中。

转载于:https://www.cnblogs.com/chenhongyu/p/3313825.html

使用Pixel Bender Toolkit制作特效——多像素采样(Part 4)相关推荐

  1. Pixel Bender 之 Flex 特效使用

    Embed 标记指示 ActionScript 编译器在它创建 SWF 文件时嵌入 Pixel Bender 内核即pbj格式文件. 您必须包含 MIME 类型声明, 如以下示例所示: [Embed( ...

  2. Adobe pixel Bender toolkit

    http://www.pixelbender.cn/ 转载于:https://blog.51cto.com/luanlinglu/216580

  3. Pixel Bender 浅尝

    来自:http://chaimzane.iteye.com/blog/344488 Adobe Pixel Bender 是一种编程语言,用于创建或操作图像内容.您可以使用 Pixel Bender ...

  4. html文本效果变大,如何制作特效字幕:缓缓变大显示的文字效果 附缓慢放大字幕效果图...

    如何制作缓慢放大的字幕特效 (如何制作特效字幕:缓缓变大显示的文字效果 附缓慢放大字幕效果图) 今天,小ME要在这里跟ME友们分享一下制作缓慢放大的字幕特效的方法,简单而实用.我们可以先看看缓慢放大字 ...

  5. ps制作20种特效文字_ps技巧:给照片制作特效(刀光剑影)

    哈喽大家好,一段时间没有更新了非常抱歉. 现在努力日更,给大家提供干货学习. 今天我们的ps课程是制作特效. 大家会觉得很难,但是并不是这样的. 大家跟着小编的教程走,反复练习就很快学会啦. 接下来我 ...

  6. 北大青鸟 JQuery制作特效 第二章 (上机练习

    北大青鸟 JQuery制作特效 第二章 (上机练习 练习一丶制作简易的当当购物车页面 <!DOCTYPE html> <html> <head lang="en ...

  7. 如何使用Lumberyard制作特效[【1】——Overview

    最近帮亚马逊项目组的人用Lumberyard制作特效,由于国内(甚至国外)对于这个引擎的运用都不多,所以想要一边学一边和大家分享一下如何更好地使用lumberyard引擎内部的Particle Edi ...

  8. 北大青鸟 JQuery 制作特效 第一章 课后简答题

    北大青鸟 JQuery 制作特效 第一章 课后简答题 简单三丶打印倒正金字塔直线 <!DOCTYPE html> <html> <head lang="en&q ...

  9. 北大青鸟 使用JQuery制作特效 第一章(上机练习

    北大青鸟 使用JQuery制作特效 第一章(上机练习 练习一丶--统计包含"a"或"A"的字符串个数 <!DOCTYPE html> <htm ...

最新文章

  1. 转:centos7 安装与使用 postgreSQL
  2. occ-backend-base-url 的相关代码,如何调试?
  3. java xml 合并_Java中合并XML文档的设计与实现
  4. java集合的添加方法_深入理解java集合框架之---------Arraylist集合 -----添加方法
  5. C语言 函数递归例题解析
  6. Ubuntu下使用cmake结合CmakeLists.txt生成makefile文件并进行编译
  7. 苹果或推中国特色版 iPhone;小米回应萌拍抄袭苹果事件;微软停止审核发布 Windows Phone 8.x | 极客头条...
  8. Python全栈开发之函数
  9. 反射修改jsessionid实现Session共享
  10. JS短文 | 3分钟了解下 JS Sets 集合
  11. Android Studio的安装与配置
  12. 高电压技术重点知识整理
  13. ADOBE全系破解文件(无解压密
  14. 用码云搭建简单的个人个性博客
  15. android读取hex文件格式,轻松解包MIUI备份bak文件 还原出明文数据
  16. Air724开发板GPIO试验
  17. BUGKU-WEB-WEB41
  18. iview table表格单元格的动态合并
  19. 上海交大计算机专业保研夏令营,2018年上海交通大学全校各学院保研夏令营信息大汇总...
  20. Java基础面试常常死在这几个问题上,看这篇足矣了!

热门文章

  1. 超级细分插件_草图大师必装插件
  2. python计算四元素组合算法_python – 算法,列表元素之间的最近点
  3. 日常安排php,PHP日常开发小技巧
  4. linux parted rpm,为Everest Linux构建QtParted的rpm包(四)
  5. java 构建是什么意思_构建的概念
  6. php 长连接心跳_支持gRPC长链接,深度解读Nacos2.0架构设计及新模型
  7. 从0到1 html5 canvas,Html5 Canvas学习之路(五)
  8. Acwing--朴素dijkstra
  9. android studio网上订餐软件_直播软件OBS的使用
  10. 程序员在职场中想快速升职,这4种潜质少不得!