首页 > 使用Pixel Bender Toolkit制作特效——多像素采样(Part 4)

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

用户级别

初级

必需产品

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

范例文件

  • pixel_bender_04.zip (5 KB)

其他要求

Pixel Bender Toolkit

在本文中,你会学到如何编写一个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. 修改过代码之后,应该是如下样子:
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

更多相关:

  • THE START更新堪称轻量级MATLAB的一款软件最新版-Maplesoft Maple 2019.2 中文版。Maple是符号和数字计算环境,也是一种多范式编程语言,由Maplesoft开发,还涵盖了技术计算的其他方面,包括可视化,数据分析,矩阵计算和MATLAB连接。MapleSim工具箱添加了用于多域物理建模和代码生成的...

  • 同学们,你们在学习他人的代码,是否见过这样的代码 def main(): def user_info(gender): 当你还是个小萌新时,你一定会认为这是个很牛逼的语法。 当你有了一点基础时,你一定会想要了解这个语法,并且尝试去使用它。 那么今天,我们便来了解这个牛语法。 有了一点点的python基础,我们来看这段代...

  •     自从用了这些快捷键,鼓励师也不需要了,代码开发效率蹭蹭提升!!! ctrl+shift+[折叠代码 (这个比ctrl+k ctrl+l、ctrl+k ctr+j不知道好用多少倍!) ctrl+shift+]展开代码 ctrl+shift+T打开手贱不小心关掉的窗口 【推荐】ctrl+shift+O打开当前文件...

  • 在提交代码之前,建议最好先Fetch代码下来(如果有冲突,系统会提示),然后再操作Merge到本地分支,这样做是为了避免有其他人同时修改了当前分支,如果直接用Ctrl+T(pull代码)极有可能覆盖本地分支最新代码,安全起见先Fetch代码(Ctrl+Alt+Shift+1)——所谓:小心驶得万年船!...

  • 每次复制代码时,如果代码里有 // 这样的注释就容易让格式乱掉,通过下面的设置就可以避免这种情况。 粘贴代码时取消自动缩进 VIM在粘贴代码时会自动缩进,把代码搞得一团糟糕,甚至可能因为某行的一个注释造成后面的代码全部被注释掉,我知道有同学这个时候会用vi去打开文件再粘贴上去(鄙人以前就是这样),其实需要先设置一下 s...

  • 1.卷积神经网络介绍 **卷积神经网络(Convolutional Neural Network,CNN)**是一种前馈神经网络,它的人工神经元可以响应一部分覆盖范围内的周围单元,对于大型图像处理有出色表现。 虽然上图中显示的全连接神经网络结构和卷积神经网络的结构直观上差异比较大,但他们的整体架构是非常相似的。从上图可以看出,卷积神...

  • 业务场景如下:...

  • 在36.211-6.10.1.2有详细的公式,如下:...

  • https://www.cnblogs.com/lovestarfish/p/10628205.html第一步,下载flutter最新版,解压到自己的目录里: 提供网址:https://flutter.io/setup-macos/    第二步,终端配置环境,这里我配知道了IOS,安卓,没有没配到vs code 和Dart。后续会...

  • UIActionSheet在iOS7.0中效果图如下:                                                UIActionSheet在iOS8中效果图如下:                                         造成这样的原因,是因为此控件在iOS8中被弃用了,而使...