ActionScript® 3.0 Reference for the Adobe® Flash® Platform
Home  |  Show Packages and Classes List |  Packages  |  Classes  |  What's New  |  Index  |  Appendixes
spark.primitives 

Path  - AS3 Flex

Packagespark.primitives
Classpublic class Path
InheritancePath Inheritance FilledElement Inheritance StrokedElement Inheritance GraphicElement Inheritance EventDispatcher Inheritance Object

Language Version: ActionScript 3.0
Product Version: Flex 4
Runtime Versions: Flash Player 10, AIR 1.5

The Path class is a filled graphic element that draws a series of path segments. In vector graphics, a path is a series of points connected by straight or curved line segments. Together the lines form an image. In Flex, you use the Path class to define a complex vector shape constructed from a set of line segments.

Typically, the first element of a path definition is a Move segment to specify the starting pen position of the graphic. You then use the Line, CubicBezier and QuadraticBezier segments to draw the lines of the graphic. When using these classes, you only specify the x and y coordinates of the end point of the line; the x and y coordinate of the starting point is defined by the current pen position.

After drawing a line segment, the current pen position becomes the x and y coordinates of the end point of the line. You can use multiple Move segments in the path definition to reposition the pen.

The syntax used by the Path class to define the shape is the same as the SVG path syntax, which makes it easy to convert SVG paths to Flex paths.

View the examples

More examples

Learn more



Public Properties
 PropertyDefined By
 Inheritedalpha : Number
The level of transparency of the graphic element.
GraphicElement
 InheritedalwaysCreateDisplayObject : Boolean
Specifies that this GraphicElement is to be associated with and be rendered to its own DisplayObject.
GraphicElement
 Inheritedbaseline : Object
The vertical distance in pixels from the anchor target to the control's baseline position.
GraphicElement
 InheritedbaselinePosition : Number
[read-only] The y-coordinate of the baseline of the first line of text of the component.
GraphicElement
 InheritedblendMode : String
A value from the BlendMode class that specifies which blend mode to use.
GraphicElement
 Inheritedbottom : Object
The vertical distance in pixels from the bottom edge of the component to the anchor target's bottom edge.
GraphicElement
 Inheritedconstructor : Object
A reference to the class object or constructor function for a given object instance.
Object
  data : String
A string containing a compact represention of the path segments.
Path
 Inheriteddepth : Number
Determines the order in which items inside of containers are rendered.
GraphicElement
 InheriteddesignLayer : DesignLayer
Specifies the optional DesignLayer instance associated with this visual element.
GraphicElement
 InheriteddisplayObject : DisplayObject
[read-only] The shared DisplayObject where this IGraphicElement is drawn.
GraphicElement
 InheriteddisplayObjectSharingMode : String
Indicates the association between this IGraphicElement and its display objects.
GraphicElement
 InheritedexplicitHeight : Number
Number that specifies the explicit height of the component, in pixels, in the component's coordinates.
GraphicElement
 InheritedexplicitMaxHeight : Number
The maximum recommended height of the component to be considered by the parent during layout.
GraphicElement
 InheritedexplicitMaxWidth : Number
The maximum recommended width of the component to be considered by the parent during layout.
GraphicElement
 InheritedexplicitMinHeight : Number
The minimum recommended height of the component to be considered by the parent during layout.
GraphicElement
 InheritedexplicitMinWidth : Number
The minimum recommended width of the component to be considered by the parent during layout.
GraphicElement
 InheritedexplicitWidth : Number
Number that specifies the explicit width of the component, in pixels, in the component's coordinates.
GraphicElement
 Inheritedfill : IFill
The object that defines the properties of the fill.
FilledElement
 Inheritedfilters : Array
An indexed array that contains each filter object currently associated with the graphic element.
GraphicElement
 InheritedhasLayoutMatrix3D : Boolean
[read-only] Contains true if the element has 3D Matrix.
GraphicElement
 Inheritedheight : Number
The height of the graphic element.
GraphicElement
 InheritedhorizontalCenter : Object
The horizontal distance in pixels from the center of the component to the center of the anchor target's content area.
GraphicElement
 Inheritedid : String
The identity of the component.
GraphicElement
 InheritedincludeInLayout : Boolean
Specifies whether this element is included in the layout of the parent.
GraphicElement
 Inheritedis3D : Boolean
[read-only] Contains true when the element is in 3D.
GraphicElement
 InheritedlayoutDirection : String
Specifies the desired layout direction for an element: one of LayoutDirection.LTR (left to right), LayoutDirection.RTL (right to left), or null (inherit).
GraphicElement
 Inheritedleft : Object
The horizontal distance in pixels from the left edge of the component to the anchor target's left edge.
GraphicElement
 InheritedluminosityClip : Boolean
A property that controls whether the luminosity mask clips the masked content.
GraphicElement
 InheritedluminosityInvert : Boolean
A property that controls the calculation of the RGB color value of a graphic element being masked by a luminosity mask.
GraphicElement
 Inheritedmask : DisplayObject
The calling display object is masked by the specified mask object.
GraphicElement
 InheritedmaskType : String
Defines how the mask is applied to the GraphicElement. The possible values are MaskType.CLIP, MaskType.ALPHA, and MaskType.LUMINOSITY. Clip Masking When masking in clip mode, a clipping masks is reduced to 1-bit.
GraphicElement
 InheritedmaxHeight : Number
The maximum recommended height of the component to be considered by the parent during layout.
GraphicElement
 InheritedmaxWidth : Number
The maximum recommended width of the component to be considered by the parent during layout.
GraphicElement
 InheritedmeasuredHeight : Number
The default height of the component, in pixels.
GraphicElement
 InheritedmeasuredWidth : Number
The default width of the component, in pixels.
GraphicElement
 InheritedmeasuredX : Number
The default measured bounds top-left corner relative to the origin of the element.
GraphicElement
 InheritedmeasuredY : Number
The default measured bounds top-left corner relative to the origin of the element.
GraphicElement
 InheritedminHeight : Number
The minimum recommended height of the component to be considered by the parent during layout.
GraphicElement
 InheritedminWidth : Number
The minimum recommended width of the component to be considered by the parent during layout.
GraphicElement
 Inheritedowner : DisplayObjectContainer
The owner of this IVisualElement object.
GraphicElement
 Inheritedparent : DisplayObjectContainer
[read-only] The parent container or component for this component.
GraphicElement
 InheritedpercentHeight : Number
Specifies the height of a component as a percentage of its parent's size.
GraphicElement
 InheritedpercentWidth : Number
Specifies the width of a component as a percentage of its parent's size.
GraphicElement
 InheritedpostLayoutTransformOffsets : mx.geom:TransformOffsets
Defines a set of adjustments that can be applied to the object's transform in a way that is invisible to its parent's layout.
GraphicElement
 Inheritedright : Object
The horizontal distance in pixels from the right edge of the component to the anchor target's right edge.
GraphicElement
 Inheritedrotation : Number
Indicates the rotation of the element, in degrees, from the transform point.
GraphicElement
 InheritedrotationX : Number
Indicates the x-axis rotation of the element instance, in degrees, from its original orientation relative to the 3D parent container.
GraphicElement
 InheritedrotationY : Number
Indicates the y-axis rotation of the DisplayObject instance, in degrees, from its original orientation relative to the 3D parent container.
GraphicElement
 InheritedrotationZ : Number
Indicates the rotation of the element, in degrees, from the transform point.
GraphicElement
 InheritedscaleX : Number
The horizontal scale (percentage) of the element as applied from the transform point.
GraphicElement
 InheritedscaleY : Number
The vertical scale (percentage) of the element as applied from the transform point.
GraphicElement
 InheritedscaleZ : Number
The z scale (percentage) of the element as applied from the transform point.
GraphicElement
 Inheritedstroke : IStroke
The stroke used by this element.
StrokedElement
 Inheritedtop : Object
The vertical distance in pixels from the top edge of the component to the anchor target's top edge.
GraphicElement
 Inheritedtransform : flash.geom:Transform
An object with properties pertaining to a display object's matrix, color transform, and pixel bounds.
GraphicElement
 InheritedtransformX : Number
The x position transform point of the element.
GraphicElement
 InheritedtransformY : Number
The y position transform point of the element.
GraphicElement
 InheritedtransformZ : Number
The z position transform point of the element.
GraphicElement
 InheritedverticalCenter : Object
The vertical distance in pixels from the center of the component to the center of the anchor target's content area.
GraphicElement
 Inheritedvisible : Boolean
Controls the visibility of this visual element.
GraphicElement
 Inheritedwidth : Number
The width of the graphic element.
GraphicElement
  winding : String
Fill rule for intersecting or overlapping path segments.
Path
 Inheritedx : Number
The x position of the graphic element.
GraphicElement
 Inheritedy : Number
The y position of the graphic element.
GraphicElement
 Inheritedz : Number
The z position of the graphic element.
GraphicElement
Protected Properties
 PropertyDefined By
 InheriteddrawnDisplayObject : DisplayObject
[read-only] The actual DisplayObject that is drawn into by the GraphicElement.
GraphicElement
 InheriteddrawX : Number
[read-only] The x position where the element should be drawn.
GraphicElement
 InheriteddrawY : Number
[read-only] The y position where the element should be drawn.
GraphicElement
 InheritedhasComplexLayoutMatrix : Boolean
[read-only] Returns true if the GraphicElement has any non-translation (x,y) transform properties
GraphicElement
 InheritedlayoutFeatures : AdvancedLayoutFeatures
Contain all of the implementation details of how the GraphicElement implements transform and layering support.
GraphicElement
 InheritedneedsDisplayObject : Boolean
[read-only] True if the element requires an exclusive DisplayObject.
GraphicElement
Public Methods
 MethodDefined By
  
Constructor.
Path
 Inherited
addEventListener(type:String, listener:Function, useCapture:Boolean = false, priority:int = 0, useWeakReference:Boolean = false):void
Registers an event listener object with an EventDispatcher object so that the listener receives notification of an event.
EventDispatcher
 Inherited
Returns true if this IGraphicElement is compatible and can share display objects with the next IGraphicElement in the sequence.
GraphicElement
 Inherited
Returns true if this IGraphicElement is compatible and can share display objects with the previous IGraphicElement in the sequence.
GraphicElement
 Inherited
Creates a new DisplayObject where this IGraphicElement is drawn.
GraphicElement
 Inherited
Dispatches an event into the event flow.
EventDispatcher
  
getBoundsXAtSize(width:Number, height:Number, postLayoutTransform:Boolean = true):Number
[override] Returns the x coordinate of the element's bounds at the specified element size.
Path
  
getBoundsYAtSize(width:Number, height:Number, postLayoutTransform:Boolean = true):Number
[override] Returns the y coordinate of the element's bounds at the specified element size.
Path
 Inherited
getLayoutBoundsHeight(postLayoutTransform:Boolean = true):Number
Returns the element's layout height.
GraphicElement
 Inherited
getLayoutBoundsWidth(postLayoutTransform:Boolean = true):Number
Returns the element's layout width.
GraphicElement
 Inherited
getLayoutBoundsX(postLayoutTransform:Boolean = true):Number
Returns the x coordinate that the element uses to draw on screen.
GraphicElement
 Inherited
getLayoutBoundsY(postLayoutTransform:Boolean = true):Number
Returns the y coordinate that the element uses to draw on screen.
GraphicElement
 Inherited
Returns the transform matrix that is used to calculate the component's layout relative to its siblings.
GraphicElement
 Inherited
Returns the layout transform Matrix3D for this element.
GraphicElement
 Inherited
getMaxBoundsHeight(postLayoutTransform:Boolean = true):Number
Returns the element's maximum height.
GraphicElement
 Inherited
getMaxBoundsWidth(postLayoutTransform:Boolean = true):Number
Returns the element's maximum width.
GraphicElement
 Inherited
getMinBoundsHeight(postLayoutTransform:Boolean = true):Number
Returns the element's minimum height.
GraphicElement
 Inherited
getMinBoundsWidth(postLayoutTransform:Boolean = true):Number
Returns the element's minimum width.
GraphicElement
 Inherited
getPreferredBoundsHeight(postLayoutTransform:Boolean = true):Number
Returns the element's preferred height.
GraphicElement
 Inherited
getPreferredBoundsWidth(postLayoutTransform:Boolean = true):Number
Returns the element's preferred width.
GraphicElement
 Inherited
Checks whether the EventDispatcher object has any listeners registered for a specific type of event.
EventDispatcher
 Inherited
Indicates whether an object has a specified property defined.
Object
 Inherited
Called automatically by the MXML compiler when the GraphicElement is created using an MXML tag.
GraphicElement
 Inherited
Calling this method results in a call to the elements's validateDisplayList() method before the display list is rendered.
GraphicElement
 Inherited
An element must call this method when its layoutDirection changes or when its parent's layoutDirection changes.
GraphicElement
 Inherited
Calling this method results in a call to the elements's validateProperties() method before the display list is rendered.
GraphicElement
 Inherited
Calling this method results in a call to the elements's validateSize() method before the display list is rendered.
GraphicElement
 Inherited
Indicates whether an instance of the Object class is in the prototype chain of the object specified as the parameter.
Object
 Inherited
Converts the point object from the object's (local) coordinates to the Stage (global) coordinates.
GraphicElement
 Inherited
Called by IGraphicElementContainer when an IGraphicElement is added to or removed from the host component.
GraphicElement
 Inherited
Indicates whether the specified property exists and is enumerable.
Object
 Inherited
removeEventListener(type:String, listener:Function, useCapture:Boolean = false):void
Removes a listener from the EventDispatcher object.
EventDispatcher
 Inherited
setLayoutBoundsPosition(newBoundsX:Number, newBoundsY:Number, postLayoutTransform:Boolean = true):void
Sets the coordinates that the element uses to draw on screen.
GraphicElement
 Inherited
setLayoutBoundsSize(width:Number, height:Number, postLayoutTransform:Boolean = true):void
Sets the layout size of the element.
GraphicElement
 Inherited
setLayoutMatrix(value:Matrix, invalidateLayout:Boolean):void
Sets the transform Matrix that is used to calculate the component's layout size and position relative to its siblings.
GraphicElement
 Inherited
setLayoutMatrix3D(value:Matrix3D, invalidateLayout:Boolean):void
Sets the transform Matrix3D that is used to calculate the component's layout size and position relative to its siblings.
GraphicElement
 Inherited
Sets the availability of a dynamic property for loop operations.
Object
 Inherited
Determines whether this element can draw itself to the sharedDisplayObject of the sequence.
GraphicElement
 Inherited
Returns the string representation of this object, formatted according to locale-specific conventions.
Object
 Inherited
Returns the string representation of the specified object.
Object
 Inherited
transformAround(transformCenter:Vector3D, scale:Vector3D = null, rotation:Vector3D = null, translation:Vector3D = null, postLayoutScale:Vector3D = null, postLayoutRotation:Vector3D = null, postLayoutTranslation:Vector3D = null, invalidateLayout:Boolean = true):void
A utility method to update the rotation, scale, and translation of the transform while keeping a particular point, specified in the component's own coordinate space, fixed in the parent's coordinate space.
GraphicElement
 Inherited
transformPointToParent(localPosition:Vector3D, position:Vector3D, postLayoutPosition:Vector3D):void
A utility method to transform a point specified in the local coordinates of this object to its location in the object's parent's coordinates.
GraphicElement
 Inherited
Called by the IGraphicElementContainer to redraw this element in its displayObject property.
GraphicElement
 Inherited
Validates and updates the properties and layout of this object by immediately calling validateProperties(), validateSize(), and validateDisplayList(), if necessary.
GraphicElement
 Inherited
Used by layout logic to validate the properties of a component by calling the commitProperties() method.
GraphicElement
 Inherited
Called by the IGraphicElementContainer to validate the size of this element.
GraphicElement
 Inherited
Returns the primitive value of the specified object.
Object
 Inherited
Checks whether an event listener is registered with this EventDispatcher object or any of its ancestors for the specified event type.
EventDispatcher
Protected Methods
 MethodDefined By
 Inherited
[override] Set up the drawing for this element.
FilledElement
 Inherited
Determines if the call to the measure() method can be skipped.
GraphicElement
 Inherited
Processes the properties set on the element.
GraphicElement
  
[override] Draw the element.
Path
  
[override] Finalize drawing for this element.
Path
 Inherited
getStrokeExtents(postLayoutTransform:Boolean = true):Rectangle
Returns the amount of pixels occupied by the stroke on each side of the element's bounds.
GraphicElement
  
[override] Utility method that notifies the host that this element has changed and needs its layer to be updated.
Path
 Inherited
Helper method to invalidate parent size and display list if this object affects its layout (includeInLayout is true).
GraphicElement
  
[override] Calculates the default size of the element.
Path
 Inherited
Used for the implementation of the ILayoutElement interface, returns the explicit measured height pre-transform.
GraphicElement
 Inherited
Used for the implementation of the ILayoutElement interface, returns the explicit of measured width pre-transform.
GraphicElement
 Inherited
transformHeightForLayout(width:Number, height:Number, postLayoutTransform:Boolean = true):Number
Transform the element's size.
GraphicElement
 Inherited
transformWidthForLayout(width:Number, height:Number, postLayoutTransform:Boolean = true):Number
Transform the element's size.
GraphicElement
 Inherited
updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void
[override] Draws the element and/or sizes and positions its content.
StrokedElement
Events
 Event Summary Defined By
 Inherited[broadcast event] Dispatched when the Flash Player or AIR application gains operating system focus and becomes active.EventDispatcher
 Inherited[broadcast event] Dispatched when the Flash Player or AIR application operating loses system focus and is becoming inactive.EventDispatcher
Property Detail

data

property
data:String

Language Version: ActionScript 3.0
Product Version: Flex 4
Runtime Versions: Flash Player 10, AIR 1.5

A string containing a compact represention of the path segments. This is an alternate way of setting the segments property. Setting this property overrides any values stored in the segments array property.

The value is a space-delimited string describing each path segment. Each segment entry has a single character which denotes the segment type and two or more segment parameters.

If the segment command is upper-case, the parameters are absolute values. If the segment command is lower-case, the parameters are relative values.

The following table shows the syntax for the segments:

Segment TypeCommandParametersExample
MoveM/mx yM 10 20 - Move line to 10, 20.
LineL/lx yL 50 30 - Line to 50, 30.
Horizontal lineH/hxH 40 = Horizontal line to 40.
Vertical lineV/vyV 100 - Vertical line to 100.
QuadraticBezierQ/qcontrolX controlY x yQ 110 45 90 30 - Curve to 90, 30 with the control point at 110, 45.
CubicBezierC/ccontrol1X control1Y control2X control2Y x yC 45 50 20 30 10 20 - Curve to 10, 20 with the first control point at 45, 50 and the second control point at 20, 30.
Close pathZ/zn/aCloses off the path.

The default value is null.



Implementation
    public function get data():String
    public function set data(value:String):void

winding

property 
winding:String

Language Version: ActionScript 3.0
Product Version: Flex 4
Runtime Versions: Flash Player 10, AIR 1.5

Fill rule for intersecting or overlapping path segments. Possible values are GraphicsPathWinding.EVEN_ODD or GraphicsPathWinding.NON_ZERO.

The default value is evenOdd.



Implementation
    public function get winding():String
    public function set winding(value:String):void

Related API Elements

Constructor Detail

Path

()Constructor
public function Path()

Language Version: ActionScript 3.0
Product Version: Flex 4
Runtime Versions: Flash Player 10, AIR 1.5

Constructor.

Method Detail

draw

()method
override protected function draw(g:Graphics):void

Language Version: ActionScript 3.0
Product Version: Flex 4
Runtime Versions: Flash Player 10, AIR 1.5

Draw the element. This is the second of three steps taken during the drawing process. Override this method to implement your drawing. The stroke (and fill, if applicable) have been set in the beginDraw() method. Your override should only contain calls to drawing methods such as moveTo(), curveTo(), and drawRect().

Parameters

g:Graphics — The graphic element to draw.

endDraw

()method 
override protected function endDraw(g:Graphics):void

Language Version: ActionScript 3.0
Product Version: Flex 4
Runtime Versions: Flash Player 10, AIR 1.5

Finalize drawing for this element. This is the final of the three steps taken during the drawing process. In this step, fills are closed.

Parameters

g:Graphics — The graphics element to finish drawing.

getBoundsXAtSize

()method 
override public function getBoundsXAtSize(width:Number, height:Number, postLayoutTransform:Boolean = true):Number

Language Version: ActionScript 3.0
Product Version: Flex 4
Runtime Versions: Flash Player 10, AIR 1.5

Returns the x coordinate of the element's bounds at the specified element size.

This method is typically used by layouts during a call to the measure() method to predict what the element position will be, if the element is resized to particular dimensions.

Parameters

width:Number — The element's bounds width, or NaN to use the preferred width.
 
height:Number — The element's bounds height, or NaN to use the preferred height.
 
postLayoutTransform:Boolean (default = true) — When postLayoutTransform is true, the method returns x coordinate of the element's bounding box top-left corner. The bounding box is in element's parent coordinate space and is calculated from the specified bounds size, layout position and layout transform matrix.

Returns
Number — The x coordinate of the element's bounds at the specified element size.

getBoundsYAtSize

()method 
override public function getBoundsYAtSize(width:Number, height:Number, postLayoutTransform:Boolean = true):Number

Language Version: ActionScript 3.0
Product Version: Flex 4
Runtime Versions: Flash Player 10, AIR 1.5

Returns the y coordinate of the element's bounds at the specified element size. This method is typically used by layouts during a call to the measure() to predict what the element position will be, if the element is resized to particular dimensions.

Parameters

width:Number — The element's bounds width, or NaN to use the preferred width.
 
height:Number — The element's bounds height, or NaN to use the preferred height.
 
postLayoutTransform:Boolean (default = true) — When postLayoutTransform is true, the method returns the y coordinate of the element's bounding box top-left corner. The bounding box is in element's parent coordinate space and is calculated from the specified bounds size, layout position and layout transform matrix.

Returns
Number — The y coordinate of the element's bounds at the specified element size.

invalidateDisplayObjectSharing

()method 
override protected function invalidateDisplayObjectSharing():void

Language Version: ActionScript 3.0
Product Version: Flex 4
Runtime Versions: Flash Player 10, AIR 1.5

Utility method that notifies the host that this element has changed and needs its layer to be updated.

measure

()method 
override protected function measure():void

Language Version: ActionScript 3.0
Product Version: Flex 4
Runtime Versions: Flash Player 10, AIR 1.5

Calculates the default size of the element. This is an advanced method that you might override when creating a subclass of GraphicElement.

You do not call this method directly. Flex calls the measure() method when the element is added to an IGraphicElementContainer container such as Group using the addElement() method, and when the element's invalidateSize() method is called.

By default you set both explicit height and explicit width of an element, Flex does not call the measure() method, even if you explicitly call the invalidateSize() method. To override this behavior, override skipMeasure() method.

In your override of this method, you must set the measuredWidth and measuredHeight properties to define the default size. You can optionally set the measuredX and measuredY properties to define the default measured bounds top-left corner relative to the origin of the element.

The conceptual point of measure() is for the element to provide its own natural or intrinsic bounds as a default. Therefore, the measuredWidth and measuredHeight properties should be determined by factors such as:

  • The amount of text the component needs to display.
  • The size of a JPEG image that the component displays.

In some cases, there is no intrinsic way to determine default values. For example, a simple GreenCircle element might simply set measuredWidth = 100 and measuredHeight = 100 in its measure() method to provide a reasonable default size. In other cases, such as a TextArea, an appropriate computation (such as finding the right width and height that would just display all the text and have the aspect ratio of a Golden Rectangle) might be too time-consuming to be worthwhile.

The default implementation of measure() sets the values of the measuredWidth, measuredHeight, measuredX, and measuredY properties to 0.

ArrowExample.mxml
<?xml version="1.0" encoding="utf-8"?>
<!-- ArrowExample.mxml -->
<s:Application name="ArrowExample"
        xmlns:fx="http://ns.adobe.com/mxml/2009"
        xmlns:s="library://ns.adobe.com/flex/spark"
        xmlns:mx="library://ns.adobe.com/flex/mx">

    <s:Panel title="Arrow Graphic Example"
            width="75%" height="75%"
            horizontalCenter="0" verticalCenter="0">
        <s:Group left="10" right="10" top="10" bottom="10">
            
            <s:Graphic x="100" y="0">
                <!-- Use Use compact syntax with absolute coordinates. -->
                <s:Path data="M 20 0 
                        C 50 0 50 35 20 35
                        L 15 35 
                        L 15 45 
                        L 0 32 
                        L 15 19 
                        L 15 29 
                        L 20 29 
                        C 44 29 44 6 20 6">
                    <!-- Define the border color of the arrow. -->
                    <s:stroke>
                        <s:SolidColorStroke color="0x888888"/>
                    </s:stroke>
                    <!-- Define the fill for the arrow. -->
                    <s:fill>
                        <s:LinearGradient rotation="90">
                            <s:GradientEntry color="0x000000" alpha="0.8"/>
                            <s:GradientEntry color="0xFFFFFF" alpha="0.8"/>
                        </s:LinearGradient>
                    </s:fill>
                </s:Path>
            </s:Graphic>

            <s:Graphic x="200" y="0">
                <!-- Use compact syntax with relative coordinates. -->
                <s:Path data="m 20 0 
                        c 30 0 30 35 0 35 
                        l -5 0
                        l 0 10
                        l -15 -13
                        l 15 -13
                        l 0 10
                        l 5 0
                        c 24 0 24 -23 0 -23">
                    <!-- Define the border color of the arrow. -->
                    <s:stroke>
                        <s:SolidColorStroke color="0x888888"/>
                    </s:stroke>
                    <!-- Define the fill for the arrow. -->
                    <s:fill>
                        <s:LinearGradient rotation="90">
                            <s:GradientEntry color="0x000000" alpha="0.8"/>
                            <s:GradientEntry color="0xFFFFFF" alpha="0.8"/>
                        </s:LinearGradient>
                    </s:fill>
                </s:Path>
            </s:Graphic>
        </s:Group>
    </s:Panel>

</s:Application>