主页 » RIA文档中心 » Flex

在Flash Builder 4 beta中使用Pixel Bender作为数值运算引擎 (四)

Posted 九月 23rd, 2009 by RIAMeeting

使用Pixel BEnder进行更加复杂的运算

Pixel Bender kernel语言同样包括用于更加复杂的数值处理的函数：

·         sin(x) - Returns the sine of x.

·         cos(x) – Returns cosine of x.

·         tan(x) – Returns the tangent of x.

·         asin(x) – Returns the arcsine (inverse sine) of x.

·         acos(x) – Returns the arccosine (inverse cosine) of x.

·         atan(x) – Returns the arctangent (inverse tangent) of x.

·         exp(x) - Returns ex.

·         log(x) – Returns the natural logarithm of x.

·         pow(x, y) - Returns xy.

·         sqrt(x) – Returns the positive square root of x.

第二个例子中，我们会创建并利用一个使用了cos()的kernel。

创建该kernel

与上一节创建 SimpleCalculator.pbj的方式类似，我们使用下面的代码来创建CosCalculator.pbj。

  1. <languageVersion : 1.0;>
  2. kernel CosCalculator
  3. < 
  4.     namespace : "pixelBender";
  5.     vendor : "Elad Elrom";
  6.     version : 1;
  7.     description : "Cos Calculator";
  8. > 
  9. {
  10.     input image1 src;
  11.     output pixel3 result;
  12.  
  13.     void evaluatePixel()
  14.     {
  15.         pixel1 value = pixel1(cos(sample(src, outCoord())));
  16.         result = pixel3(value, 0.0, 0.0);
  17.     }
  18. }
  19.  

建立Flex应用

用下面的代码建立一个新的Flex应用。这些代码和上一节的例子十分相似，主要的不同在于这次只传入了一列数值(上一节是两列)。

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
  3.               xmlns:s="library://ns.adobe.com/flex/spark" 
  4.               xmlns:mx="library://ns.adobe.com/flex/halo" 
  5.               minWidth="1024" minHeight="768">
  6.  
  7.     <fx:Script>
  8.         <![CDATA[
  9.            import mx.collections.IList;
  10.  
  11.            [Embed(source="CosCalculator.pbj", mimeType="application/octet-stream")]
  12.            private var KernelClass:Class;           
  13.  
  14.            private var result:ByteArray;
  15.  
  16.            protected function initializeHandler(list:IList):void
  17.            {
  18.                var byteArray:ByteArray = new ByteArray();
  19.                var shader:Shader = new Shader(new KernelClass());
  20.                var shaderJob:ShaderJob;
  21.                var height:int;
  22.                var width:int;
  23.  
  24.                byteArray = convertListToByteArray( list );
  25.  
  26.                width = byteArray.length >> 2;
  27.                height = 1;
  28.  
  29.                shader.data.src.width = width;
  30.                shader.data.src.height = height;
  31.                shader.data.src.input = byteArray;
  32.  
  33.                result = new ByteArray();
  34.                result.endian = Endian.LITTLE_ENDIAN;
  35.  
  36.                shaderJob = new ShaderJob(shader, result, width, height);
  37.                shaderJob.addEventListener(Event.COMPLETE, onComplete);
  38.                shaderJob.start();
  39.            }
  40.  
  41.            protected function onComplete(event:Event):void
  42.            {
  43.                var length:int = result.length;
  44.                var num:Number;
  45.                var i:int;
  46.  
  47.                result.position = 0;
  48.  
  49.                for(i = 0; i < length; i += 4)
  50.                {
  51.                    num = result.readFloat();
  52.  
  53.                    if(i % 3 == 0)
  54.                        listDest.dataProvider.addItem( num );
  55.                }
  56.            }
  57.  
  58.            /**
  59.             
  60.            * Static method to convert the list object into byte array object.
  61.            *  
  62.            * @param array
  63.            * @return 
  64.            * 
  65.  
  66.            */        
  67.            private static function convertListToByteArray(list:IList):ByteArray
  68.            {
  69.                var retVal:ByteArray = new ByteArray();
  70.                var number:Number;
  71.                var len:int = list.length;
  72.                var i:int;
  73.  
  74.                retVal.endian = Endian.LITTLE_ENDIAN;
  75.  
  76.                for (i; i<len; i++)
  77.                {
  78.                    retVal.writeFloat( Number(list[i]) );
  79.                }
  80.  
  81.                retVal.position = 0;    
  82.                return retVal;            
  83.            }            
  84.  
  85.         ]]>
  86.     </fx:Script>
  87.  
  88.     <s:List id="listSrc" width="57" height="158">
  89.        <s:ArrayCollection>
  90.            <fx:Object>1</fx:Object>
  91.            <fx:Object>2</fx:Object>
  92.            <fx:Object>3</fx:Object>
  93.            <fx:Object>4</fx:Object>
  94.            <fx:Object>5</fx:Object>
  95.            <fx:Object>6</fx:Object>
  96.            <fx:Object>7</fx:Object>
  97.        </s:ArrayCollection>
  98.     </s:List>
  99.  
  100.     <s:Button x="71" y="12" label="Calculate &gt;" click="initializeHandler(listSrc.dataProvider)"/>
  101.  
  102.     <s:List id="listDest" width="200" height="158"  x="160" y="0">
  103.         <s:ArrayCollection />
  104.     </s:List>
  105. </s:Application>
  106.  

 

当你编译好该应用后，在浏览器中运行它并点击Calculate来查看结果(见图5)。

注意：cos()的输入参数代表弧度

The cosine example running in a browser

图5.  运行在浏览器中的使用cos()计算的例子

上一页 / 下一页

riadevID: 
瑞研社区最新地址：http://www.riadev.com/flex-thread-157-1-1.html
您给予的分值: None

发表新评论

  • 网页地址和电子邮件地址将会被自动转换为链接。
  • 行和段被自动切分。
  • 您可以使用下面的标签来高亮显示您的评论内容: <code>, <blockcode>. 可以使用"[foo]".旁边显示标签样式 "<foo>" PHP代码可以用这样的区块来包含<?php ... ?> or <% ... %>

更多格式化选项信息

验证区域
系统验证：请回答下面的问题