spark.filters

# ShaderFilter - AS3 Flex

Package | spark.filters
Class | public dynamic class ShaderFilter
Inheritance | ShaderFilter Proxy
Implements | IBitmapFilter, IEventDispatcher

Language Version: | ActionScript 3.0

Product Version: | Flex 4

Runtime Versions: | Flash Player 10, AIR 1.5

The Flex ShaderFilter class abstracts away many of the details of using the Flash ShaderFilter, Shader, and ShaderData classes to apply a Pixel Bender shader as a filter.

The ShaderFilter class must be initialized with either an instance of a Shader object or Class representative of a Shader (such as from an Embed). The ShaderFilter class then serves as a proxy to the underlying Shader, providing a convenience mechanism for accessing both scalar and multi-dimensional shader input parameters directly as simple named properties.

To set a simple scalar shader input parameter, such as of type FLOAT or INT, you can refer to the property directly, for example, `myFilter.radius`.

To set or animate an individual component of a multidimensional shader input parameter, such as FLOAT2, you can use a property suffix convention to access the individual value directly. The following code shows two ways to set the first and second components of the FLOAT2 property `center`: ``

         // 'center' is an input parameter of type FLOAT2.
         shader.center = [10,20];

`

         // Use property suffix convention to access the first and second component of 'center'.
         shader.center_x = 10;
         shader.center_y = 20;

`

The full set of supported property suffixes that you can use are as follows:

- For shader input parameters of type BOOL2, BOOL3, BOOL4, FLOAT2, FLOAT3, FLOAT4, INT2, INT3, or INT4, you can use "r g b a", "x y z w", or "s t p q" to access the 1st, 2nd, 3rd and 4th component, respectively.
- For shader input parameters of type MATRIX2x2, MATRIX3x3, or MATRIX4x4, you can use "a b c d e f g h i j k l m n o p" to access the 1st - 16th component of a given matrix, respectively.

As properties on the ShaderFilter change (such as during animation), the ShaderFilter automatically reapplies itself to the filters array of the visual component it is applied to.

MXML Syntax Show MXML Syntax
Hide MXML Syntax

The `<s:ShaderFilter>` tag inherits all of the tag attributes of its superclass and adds the following tag attributes:

      <s:ShaderFilter
        Properties
        bottomExtension="0"
        leftExtension="0"
        precisionHint="full"
        rightExtension="0"
        shader="[]"
        topExtension="0"
      />

View the examples

More examples

Using filters with chart controls

Related API Elements

spark.effects.AnimateFilter

Public Properties

| Property | Defined By
--- | --- | ---
|  | bottomExtension : int The growth in pixels on the bottom side of the target object. | ShaderFilter
|  | leftExtension : int The growth in pixels on the left side of the target object. | ShaderFilter
|  | precisionHint : String The precision of math operations performed by the underlying shader. | ShaderFilter
|  | rightExtension : int The growth in pixels on the right side of the target object. | ShaderFilter
|  | shader : Shader A flash.display.Shader instance. | ShaderFilter
|  | topExtension : int The growth in pixels on the top side of the target object. | ShaderFilter

Public Methods

| Method | Defined By
--- | --- | ---
|  | ShaderFilter(shader:Object = null) Constructor. | ShaderFilter

Property Detail

### bottomExtension

property

`bottomExtension:int`

Language Version: | ActionScript 3.0

Product Version: | Flex 4

Runtime Versions: | Flash Player 10, AIR 1.5

The growth in pixels on the bottom side of the target object.

The growth is the area beyond the bounds of the target object that is passed to the shader during execution. At execution time Flash Player or AIR computes the normal bounds of a movie clip and extends the bounds based on the `leftExtension`, `rightExtension`, `topExtension`, and `bottomExtension` values.

The default value is `0.`

Implementation
`public function get bottomExtension():int`
`public function set bottomExtension(value:int):void`

### leftExtension

property

`leftExtension:int`

Language Version: | ActionScript 3.0

Product Version: | Flex 4

Runtime Versions: | Flash Player 10, AIR 1.5

The growth in pixels on the left side of the target object.

The growth is the area beyond the bounds of the target object that is passed to the shader during execution. At execution time Flash Player or AIR computes the normal bounds of a movie clip and extends the bounds based on the `leftExtension`, `rightExtension`, `topExtension`, and `bottomExtension` values.

The default value is `0.`

Implementation
`public function get leftExtension():int`
`public function set leftExtension(value:int):void`

### precisionHint

property

`precisionHint:String`

Language Version: | ActionScript 3.0

Product Version: | Flex 4

Runtime Versions: | Flash Player 10, AIR 1.5

The precision of math operations performed by the underlying shader. The set of possible values for the precisionHint property is defined by the constants in the ShaderPrecision class.

The default value is `ShaderPrecision.FULL.`

Implementation
`public function get precisionHint():String`
`public function set precisionHint(value:String):void`

Related API Elements

flash.display.Shader
flash.display.ShaderPrecision

### rightExtension

property

`rightExtension:int`

Language Version: | ActionScript 3.0

Product Version: | Flex 4

Runtime Versions: | Flash Player 10, AIR 1.5

The growth in pixels on the right side of the target object.

The growth is the area beyond the bounds of the target object that is passed to the shader during execution. At execution time Flash Player or AIR computes the normal bounds of a movie clip and extends the bounds based on the `leftExtension`, `rightExtension`, `topExtension`, and `bottomExtension` values.

The default value is `0.`

Implementation
`public function get rightExtension():int`
`public function set rightExtension(value:int):void`

### shader

property

`shader:Shader`

Language Version: | ActionScript 3.0

Product Version: | Flex 4

Runtime Versions: | Flash Player 10, AIR 1.5

A flash.display.Shader instance.

Implementation
`public function get shader():Shader`
`public function set shader(value:Shader):void`

Related API Elements

flash.display.Shader

### topExtension

property

`topExtension:int`

Language Version: | ActionScript 3.0

Product Version: | Flex 4

Runtime Versions: | Flash Player 10, AIR 1.5

The growth in pixels on the top side of the target object.

The growth is the area beyond the bounds of the target object that is passed to the shader during execution. At execution time Flash Player or AIR computes the normal bounds of a movie clip and extends the bounds based on the `leftExtension`, `rightExtension`, `topExtension`, and `bottomExtension` values.

The default value is `0.`

Implementation
`public function get topExtension():int`
`public function set topExtension(value:int):void`
Constructor Detail

### ShaderFilter

()
Constructor

`public function ShaderFilter(shader:Object = null)`

Language Version: | ActionScript 3.0

Product Version: | Flex 4

Runtime Versions: | Flash Player 10, AIR 1.5

Constructor.

Parameters

| `shader:Object` (default = `null`)`` — Fully realized flash.display.Shader instance, or Class representing a Shader (such as from an Embed).

Examples How to use this example
Simple ShaderFilter example:
Copy

     <?xml version="1.0"?>
     <s:Application
        xmlns:s="library://ns.adobe.com/flex/spark"
        xmlns:fx="http://ns.adobe.com/mxml/2009">

         <!-- The hypothetical 'spherize' shader applied below has two input parameters, 'center' and 'radius'
              with the following attributes:

              parameter 'center' ==<
                  type: float2
                  minValue: float2(-200,-200)
                  maxValue: float2(800,500)
                  defaultValue: float2(400,250)
                  description: "displacement center"

              parameter 'radius' ==<
                  type: float
                  minValue: float(.1)
                  maxValue: float(400)
                  defaultValue: float(200)
                  description: "radius"
         -->

         <s:Label text="ABCDEF">
             <s:filters>
                 <s:ShaderFilter shader="@Embed(source='shaders/spherize.pbj')"
                     radius="25" center_x="50" center_y="15" />
            </s:filters>
         </s:Label>

     </s:Application>

© 2015 Adobe Systems Incorporated. All rights reserved.
Mon Apr 10 2017, 12:28 PM -07:00