blog.FlexExamples.com

Creating an animated transition when scrolling through items in a Spark HGroup container in Flex 4

Peter deHaan — Wed, 11 Nov 2009 15:17:48 +0000

The following example shows how you can create a simple horizontal list using a HGroup container and do an animated scroll using the Animate and SimpleMotionPath classes and the getHorizontalScrollPositionDelta() method Full code after the jump. <?xml version="1.0" encoding="utf-8"?>  <s:Application name="Spark_HGroup_horizontalScrollPosition_test" xmlns:fx="http://ns.adobe.com/mxml/2009" [...]

Creating a custom component using the Definition tag in Flex 4

Peter deHaan — Fri, 06 Nov 2009 14:35:49 +0000

In a previous example, “Creating a custom component using the Component tag in Flex 4″, we saw how you could create a simple, inline custom component in Flex 4 using the Component tag and className property and then instantiating new instances using ActionScript and MXML. The following example shows how you can create a new custom [...]

Applying styles to specific Spark List controls in Flex 4

Peter deHaan — Thu, 05 Nov 2009 15:21:23 +0000

The following example shows how you can selectively style Spark List controls in Flex 4 using Advanced CSS and the styleName property or the id property. Full code after the jump. 1) The following example uses s|List selector and applies the baseColor style to ALL Spark List component instances in your Flex application: <?xml version="1.0" encoding="utf-8"?>  <s:Application [...]

Creating a custom component using the Component tag in Flex 4

Peter deHaan — Thu, 05 Nov 2009 15:14:15 +0000

The following example shows how you can create a simple, inline custom component in Flex 4 using the Component tag and className property and then instantiating new instances using ActionScript. Full code after the jump. <?xml version="1.0" encoding="utf-8"?>  <s:Application name="Spark_Component_className_test" xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark"> [...]

Setting a custom horizontal scroll bar skin on a Spark List control in Flex 4

Peter deHaan — Thu, 05 Nov 2009 01:14:04 +0000

The following example shows how you can apply a custom horizontal scroll bar skin on the Spark List control in Flex 4 by setting the skinClass style. Full code after the jump. <?xml version="1.0" encoding="utf-8"?>  <s:Application name="Spark_List_HScrollBar_skinClass_test" xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" [...]

Using an XML data provider with the Spark List control in Flex 4

Peter deHaan — Wed, 04 Nov 2009 21:57:39 +0000

The following example shows how you can use an XML document as a data provider for a Spark List control in Flex 4 by using an XMLListCollection. Full code after the jump. <?xml version="1.0"?>  <s:Application name="Spark_List_dataProvider_XML_test" xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" [...]

Styling the horizontal and vertical scroll bars on a Spark List control in Flex 4

Peter deHaan — Wed, 04 Nov 2009 14:40:54 +0000

The following example shows how you can set a base theme color on a Spark List control’s horizontal and vertical scroll bar by setting the baseColor style. Full code after the jump. <?xml version="1.0" encoding="utf-8"?>  <s:Application name="Spark_List_scroller_baseColor_test" xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark"> [...]

Setting the joint style on a Spark Border container in Flex 4

Peter deHaan — Tue, 03 Nov 2009 23:30:13 +0000

The following example shows how you can set the joint style on a Spark Border container in Flex 4 by setting the borderStroke property to a custom stroke object and set the joints property to a static constant from the flash.display.JointStyle class. Full code after the jump. <?xml version="1.0" encoding="utf-8"?>  <s:Application name="Spark_Border_borderStroke_joints_test" [...]

Auto scrolling the contents of a VGroup container in Flex 4

Peter deHaan — Mon, 02 Nov 2009 23:50:34 +0000

The following example shows how you can tab through a series of Spark TextInput controls in Flex 4 and auto-scroll the VGroup container so that the currently focused text field has focus by using the fractionOfElementInView() method, getScrollPositionDeltaToElement() method, and verticalScrollPosition property. Full code after the jump. And a big thanks to Hans Muller for explaining this [...]

Setting the FormItem label width in a Form container in Flex

Peter deHaan — Mon, 02 Nov 2009 07:59:56 +0000

The following example shows how you can set the label width on a Form container in Flex by setting the labelWidth style. Full code after the jump. <?xml version="1.0"?>  <mx:Application name="Form_labelWidth_test" xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" verticalAlign="middle" [...]