http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/controls/DataGridCustomRendererExample.mxml
----------------------------------------------------------------------
diff --git 
a/TourDeFlex/TourDeFlex3/src/spark/controls/DataGridCustomRendererExample.mxml 
b/TourDeFlex/TourDeFlex3/src/spark/controls/DataGridCustomRendererExample.mxml
new file mode 100644
index 0000000..89bd8b5
--- /dev/null
+++ 
b/TourDeFlex/TourDeFlex3/src/spark/controls/DataGridCustomRendererExample.mxml
@@ -0,0 +1,62 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+  Licensed to the Apache Software Foundation (ASF) under one or more
+  contributor license agreements.  See the NOTICE file distributed with
+  this work for additional information regarding copyright ownership.
+  The ASF licenses this file to You under the Apache License, Version 2.0
+  (the "License"); you may not use this file except in compliance with
+  the License.  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+
+-->
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"; 
+                          xmlns:s="library://ns.adobe.com/flex/spark" 
+                          xmlns:mx="library://ns.adobe.com/flex/mx" 
minWidth="955" minHeight="600">
+
+       <fx:Script>
+               import mx.collections.ArrayList;
+       </fx:Script>
+       
+       <fx:Declarations>
+               <s:RemoteObject id="ro" 
endpoint="http://www.jamesward.com/census2-tests/messagebroker/amf"; 
destination="census"/>
+       </fx:Declarations>
+       
+       <s:applicationComplete>
+               ro.getElements(0, 500);
+       </s:applicationComplete>
+       
+       <s:DataGrid width="100%" height="100%" dataProvider="{new 
ArrayList(ro.getElements.lastResult)}">
+               <s:columns>
+                       <s:ArrayList>
+                               <s:GridColumn dataField="id"/>
+                               <s:GridColumn dataField="age">
+                                       <s:itemRenderer>
+                                               <fx:Component>
+                                                       <s:GridItemRenderer>
+                                                               <s:Rect 
percentWidth="{data.age}" top="3" bottom="3">
+                                                                       <s:fill>
+                                                                               
<s:SolidColor color="#0000ff"/>
+                                                                       
</s:fill>
+                                                               </s:Rect>
+                                                       </s:GridItemRenderer>
+                                               </fx:Component>
+                                       </s:itemRenderer>
+                               </s:GridColumn>
+                               <s:GridColumn dataField="classOfWorker"/>
+                               <s:GridColumn dataField="education"/>
+                               <s:GridColumn dataField="maritalStatus"/>
+                               <s:GridColumn dataField="race"/>
+                               <s:GridColumn dataField="sex"/>
+                       </s:ArrayList>
+               </s:columns>
+       </s:DataGrid>
+       
+</s:Application>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/controls/DataGridCustomRendererPrepareExample.mxml
----------------------------------------------------------------------
diff --git 
a/TourDeFlex/TourDeFlex3/src/spark/controls/DataGridCustomRendererPrepareExample.mxml
 
b/TourDeFlex/TourDeFlex3/src/spark/controls/DataGridCustomRendererPrepareExample.mxml
new file mode 100644
index 0000000..81134cb
--- /dev/null
+++ 
b/TourDeFlex/TourDeFlex3/src/spark/controls/DataGridCustomRendererPrepareExample.mxml
@@ -0,0 +1,68 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+  Licensed to the Apache Software Foundation (ASF) under one or more
+  contributor license agreements.  See the NOTICE file distributed with
+  this work for additional information regarding copyright ownership.
+  The ASF licenses this file to You under the Apache License, Version 2.0
+  (the "License"); you may not use this file except in compliance with
+  the License.  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+
+-->
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"; 
+                          xmlns:s="library://ns.adobe.com/flex/spark" 
+                          xmlns:mx="library://ns.adobe.com/flex/mx" 
minWidth="955" minHeight="600">
+
+       <fx:Script>
+               import mx.collections.ArrayList;
+       </fx:Script>
+       
+       <fx:Declarations>
+               <s:RemoteObject id="ro" 
endpoint="http://www.jamesward.com/census2-tests/messagebroker/amf"; 
destination="census"/>
+       </fx:Declarations>
+       
+       <s:applicationComplete>
+               ro.getElements(0, 500);
+       </s:applicationComplete>
+       
+       <s:DataGrid width="100%" height="100%" dataProvider="{new 
ArrayList(ro.getElements.lastResult)}">
+               <s:columns>
+                       <s:ArrayList>
+                               <s:GridColumn dataField="id"/>
+                               <s:GridColumn dataField="age">
+                                       <s:itemRenderer>
+                                               <fx:Component>
+                                                       <s:GridItemRenderer>
+                                                               <fx:Script>
+                                                                       
override public function prepare(hasBeenRecycled:Boolean):void
+                                                                       {
+                                                                               
r.percentWidth = data.age;
+                                                                       }
+                                                               </fx:Script>
+                                                               <s:Rect id="r" 
top="3" bottom="3">
+                                                                       <s:fill>
+                                                                               
<s:SolidColor color="#0000ff"/>
+                                                                       
</s:fill>
+                                                               </s:Rect>
+                                                       </s:GridItemRenderer>
+                                               </fx:Component>
+                                       </s:itemRenderer>
+                               </s:GridColumn>
+                               <s:GridColumn dataField="classOfWorker"/>
+                               <s:GridColumn dataField="education"/>
+                               <s:GridColumn dataField="maritalStatus"/>
+                               <s:GridColumn dataField="race"/>
+                               <s:GridColumn dataField="sex"/>
+                       </s:ArrayList>
+               </s:columns>
+       </s:DataGrid>
+       
+</s:Application>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/controls/DataGridCustomSkinExample.mxml
----------------------------------------------------------------------
diff --git 
a/TourDeFlex/TourDeFlex3/src/spark/controls/DataGridCustomSkinExample.mxml 
b/TourDeFlex/TourDeFlex3/src/spark/controls/DataGridCustomSkinExample.mxml
new file mode 100644
index 0000000..3bf97ff
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/controls/DataGridCustomSkinExample.mxml
@@ -0,0 +1,39 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+  Licensed to the Apache Software Foundation (ASF) under one or more
+  contributor license agreements.  See the NOTICE file distributed with
+  this work for additional information regarding copyright ownership.
+  The ASF licenses this file to You under the Apache License, Version 2.0
+  (the "License"); you may not use this file except in compliance with
+  the License.  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+
+-->
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"; 
+                          xmlns:s="library://ns.adobe.com/flex/spark">
+       
+       <fx:Script>
+               import mx.collections.ArrayList;
+       </fx:Script>
+       
+       <fx:Declarations>
+               <s:RemoteObject id="ro" 
endpoint="http://www.jamesward.com/census2-tests/messagebroker/amf"; 
destination="census"/>
+       </fx:Declarations>
+       
+       <s:applicationComplete>
+               ro.getElements(0, 500);
+       </s:applicationComplete>
+       
+       <s:DataGrid width="100%" height="100%"
+                               dataProvider="{new 
ArrayList(ro.getElements.lastResult)}"
+                               skinClass="CustomDataGridSkin"/>
+       
+</s:Application>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/controls/DataGridExample2.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/controls/DataGridExample2.mxml 
b/TourDeFlex/TourDeFlex3/src/spark/controls/DataGridExample2.mxml
new file mode 100644
index 0000000..d596f9b
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/controls/DataGridExample2.mxml
@@ -0,0 +1,47 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+  Licensed to the Apache Software Foundation (ASF) under one or more
+  contributor license agreements.  See the NOTICE file distributed with
+  this work for additional information regarding copyright ownership.
+  The ASF licenses this file to You under the Apache License, Version 2.0
+  (the "License"); you may not use this file except in compliance with
+  the License.  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+
+-->
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009";
+                          xmlns:s="library://ns.adobe.com/flex/spark"
+                          
applicationComplete="application1_applicationCompleteHandler(event)">
+       
+       <fx:Script>
+               <![CDATA[
+                       import mx.collections.ArrayList;
+                       import mx.events.FlexEvent;     
+
+                       protected function 
application1_applicationCompleteHandler(event:FlexEvent):void
+                       {
+                               ro.getElements(0, 500);
+                       }
+               ]]>
+       </fx:Script>
+       <s:applicationComplete>
+               
Security.loadPolicyFile("http://www.jamesward.com/census2-tests/crossdomain.xml";);
+               ro.getElements(0, 500);
+       </s:applicationComplete>
+
+       
+       <fx:Declarations>
+               <s:RemoteObject id="ro" 
endpoint="http://www.jamesward.com/census2-tests/messagebroker/amf"; 
destination="census"/>
+       </fx:Declarations>
+       
+       <s:DataGrid width="100%" height="100%" dataProvider="{new 
ArrayList(ro.getElements.lastResult)}"/>
+       
+</s:Application>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/controls/DataGridSimpleColumnsExample.mxml
----------------------------------------------------------------------
diff --git 
a/TourDeFlex/TourDeFlex3/src/spark/controls/DataGridSimpleColumnsExample.mxml 
b/TourDeFlex/TourDeFlex3/src/spark/controls/DataGridSimpleColumnsExample.mxml
new file mode 100644
index 0000000..d97b5d6
--- /dev/null
+++ 
b/TourDeFlex/TourDeFlex3/src/spark/controls/DataGridSimpleColumnsExample.mxml
@@ -0,0 +1,49 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+  Licensed to the Apache Software Foundation (ASF) under one or more
+  contributor license agreements.  See the NOTICE file distributed with
+  this work for additional information regarding copyright ownership.
+  The ASF licenses this file to You under the Apache License, Version 2.0
+  (the "License"); you may not use this file except in compliance with
+  the License.  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+
+-->
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"; 
+                          xmlns:s="library://ns.adobe.com/flex/spark">
+       
+       <fx:Script>
+               import mx.collections.ArrayList;
+       </fx:Script>
+       
+       <fx:Declarations>
+               <s:RemoteObject id="ro" 
endpoint="http://www.jamesward.com/census2-tests/messagebroker/amf"; 
destination="census"/>
+       </fx:Declarations>
+       
+       <s:applicationComplete>
+               ro.getElements(0, 500);
+       </s:applicationComplete>
+       
+       <s:DataGrid width="100%" height="100%" dataProvider="{new 
ArrayList(ro.getElements.lastResult)}">
+               <s:columns>
+                       <s:ArrayList id="columns">
+                               <s:GridColumn dataField="id"/>
+                               <s:GridColumn dataField="age" minWidth="45"/>
+                               <s:GridColumn dataField="classOfWorker" 
minWidth="100"/>
+                               <s:GridColumn dataField="education" 
minWidth="100"/>
+                               <s:GridColumn dataField="maritalStatus" 
minWidth="100"/>
+                               <s:GridColumn dataField="race" minWidth="100"/>
+                               <s:GridColumn dataField="sex" minWidth="60"/>
+                       </s:ArrayList>
+               </s:columns>
+       </s:DataGrid>
+       
+</s:Application>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/controls/DataGridSimpleNoWrapExample.mxml
----------------------------------------------------------------------
diff --git 
a/TourDeFlex/TourDeFlex3/src/spark/controls/DataGridSimpleNoWrapExample.mxml 
b/TourDeFlex/TourDeFlex3/src/spark/controls/DataGridSimpleNoWrapExample.mxml
new file mode 100644
index 0000000..02b5f9e
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/controls/DataGridSimpleNoWrapExample.mxml
@@ -0,0 +1,37 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+  Licensed to the Apache Software Foundation (ASF) under one or more
+  contributor license agreements.  See the NOTICE file distributed with
+  this work for additional information regarding copyright ownership.
+  The ASF licenses this file to You under the Apache License, Version 2.0
+  (the "License"); you may not use this file except in compliance with
+  the License.  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+
+-->
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"; 
+                          xmlns:s="library://ns.adobe.com/flex/spark">
+       
+       <fx:Script>
+               import mx.collections.ArrayList;
+       </fx:Script>
+       
+       <fx:Declarations>
+               <s:RemoteObject id="ro" 
endpoint="http://www.jamesward.com/census2-tests/messagebroker/amf"; 
destination="census" />
+       </fx:Declarations>
+       
+       <s:applicationComplete>
+               ro.getElements(0, 500);
+       </s:applicationComplete>
+       
+       <s:DataGrid width="100%" height="100%" dataProvider="{new 
ArrayList(ro.getElements.lastResult)}" />
+       
+</s:Application>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/controls/DataGridSizingExample.mxml
----------------------------------------------------------------------
diff --git 
a/TourDeFlex/TourDeFlex3/src/spark/controls/DataGridSizingExample.mxml 
b/TourDeFlex/TourDeFlex3/src/spark/controls/DataGridSizingExample.mxml
new file mode 100644
index 0000000..f919ef3
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/controls/DataGridSizingExample.mxml
@@ -0,0 +1,47 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+  Licensed to the Apache Software Foundation (ASF) under one or more
+  contributor license agreements.  See the NOTICE file distributed with
+  this work for additional information regarding copyright ownership.
+  The ASF licenses this file to You under the Apache License, Version 2.0
+  (the "License"); you may not use this file except in compliance with
+  the License.  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+
+-->
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"; 
+                          xmlns:s="library://ns.adobe.com/flex/spark"
+                          xmlns="*">
+
+       <fx:Declarations>
+               <s:RemoteObject id="ro" 
endpoint="http://www.jamesward.com/census2-tests/messagebroker/amf"; 
destination="census"/>
+               <s:ArrayList id="columns">
+                       <s:GridColumn dataField="id" minWidth="30"/>
+                       <s:GridColumn dataField="age" minWidth="45"/>
+                       <s:GridColumn dataField="classOfWorker" minWidth="100"/>
+                       <s:GridColumn dataField="education" minWidth="100"/>
+                       <s:GridColumn dataField="maritalStatus" minWidth="100"/>
+                       <s:GridColumn dataField="race" minWidth="100"/>
+                       <s:GridColumn dataField="sex" minWidth="60"/>
+               </s:ArrayList>
+       </fx:Declarations>
+       
+       <s:applicationComplete>
+               ro.getElements(0, 500);
+       </s:applicationComplete>
+       
+       <s:HGroup width="100%">
+               <s:DataGrid requestedRowCount="5" width="100%" 
dataProvider="{new ArrayList(ro.getElements.lastResult)}" columns="{columns}" />
+               <s:DataGrid requestedRowCount="7" width="100%" 
dataProvider="{new ArrayList(ro.getElements.lastResult)}" columns="{columns}" />
+               <s:DataGrid requestedRowCount="9" width="100%" 
dataProvider="{new ArrayList(ro.getElements.lastResult)}" columns="{columns}" />
+       </s:HGroup>
+       
+</s:Application>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/controls/DropdownExample.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/controls/DropdownExample.mxml 
b/TourDeFlex/TourDeFlex3/src/spark/controls/DropdownExample.mxml
new file mode 100644
index 0000000..abe34ae
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/controls/DropdownExample.mxml
@@ -0,0 +1,90 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+  Licensed to the Apache Software Foundation (ASF) under one or more
+  contributor license agreements.  See the NOTICE file distributed with
+  this work for additional information regarding copyright ownership.
+  The ASF licenses this file to You under the Apache License, Version 2.0
+  (the "License"); you may not use this file except in compliance with
+  the License.  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+
+-->
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"; 
+                          xmlns:s="library://ns.adobe.com/flex/spark" 
+                          xmlns:mx="library://ns.adobe.com/flex/mx"
+                          viewSourceURL="srcview/index.html">
+       
+       <fx:Script>
+               <![CDATA[
+                       import spark.events.IndexChangeEvent;
+                       import mx.collections.ArrayCollection;
+                       
+                       [Bindable]
+                       public var depts:ArrayCollection = new ArrayCollection([
+                               {label:"Electronics", data:1}, 
+                               {label:"Home Goods", data:2}, 
+                               {label:"Toys", data:3} ]);
+                       
+                       [Bindable]
+                       public var elecItems:ArrayCollection = new 
ArrayCollection([
+                               {label:"Samsung 25in TV", data:299}, 
+                               {label:"Panasonic Plasma", data:999}, 
+                               {label:"Sony LCD", data:899} ]);
+                       
+                       [Bindable]
+                       public var homeItems:ArrayCollection = new 
ArrayCollection([
+                               {label:"Blendtec Blender", data:399}, 
+                               {label:"Hoover Vaccuum", data:599}, 
+                               {label:"Black & Decker Toaster", data:99} ]);
+                       
+                       [Bindable]
+                       public var toyItems:ArrayCollection = new 
ArrayCollection([
+                               {label:"Nintendo DS", data:120}, 
+                               {label:"Lego's Star Wars Set", data:50}, 
+                               {label:"Leapfrog Leapster", data:30} ]);
+                       
+                       private function 
handleDepartmentSelected(event:IndexChangeEvent):void
+                       {
+                               list2.prompt="Select Item";
+                               list2.selectedIndex=-1; // reset so prompt shows
+                               if (list1.selectedIndex==0)
+                                       list2.dataProvider=elecItems;
+                               else if (list1.selectedIndex==1)
+                                       list2.dataProvider=homeItems;
+                               else if (list1.selectedIndex==2)
+                                       list2.dataProvider=toyItems;
+                               
+                       }
+                       
+               ]]>
+       </fx:Script>
+       
+       <!-- Note: A custom panel skin is used for the Tour de Flex samples and 
is included in the
+       source tabs for each sample.    -->
+       <s:Panel title="DropDownList Sample" 
+                        width="100%" height="100%" 
+                        skinClass="skins.TDFPanelSkin">
+               <s:VGroup width="100%" height="100%" left="120" top="5">
+                       <s:Label text="RJ's Warehouse Price Checker" 
fontSize="18" color="0x014f9f"/>
+                       <s:DropDownList id="list1" width="50%" 
dataProvider="{depts}" labelField="label" 
+                                                       prompt="Select Category"
+                                                       
change="handleDepartmentSelected(event)"/>
+                       <s:Label id="text2"/>
+                       <s:DropDownList id="list2" width="50%" 
labelField="label" prompt="None"/>
+                       <mx:Spacer height="10"/>
+                       <s:Label fontSize="14" color="0x336699" text="The price 
of item: {list2.selectedItem.label} is: ${list1.selectedItem.data}" 
verticalAlign="bottom"/>
+               </s:VGroup>
+               <s:Label top="10" right="10" width="250" 
verticalAlign="justify" color="#323232" 
+                                         text="The DropDownList control 
contains a drop-down list from which the user can select a single value. Its 
functionality is very similar to that of the SELECT form element in HTML.
+The DropDownList control consists of the anchor button, prompt area, and 
drop-down-list, Use the anchor button to open and close the drop-down-list. The 
prompt area displays a prompt String, or the selected item in the 
drop-down-list."/>
+       </s:Panel>
+       
+</s:Application>

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/controls/Item.as
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/controls/Item.as 
b/TourDeFlex/TourDeFlex3/src/spark/controls/Item.as
new file mode 100644
index 0000000..f5f0a30
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/controls/Item.as
@@ -0,0 +1,62 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+//  Licensed to the Apache Software Foundation (ASF) under one or more
+//  contributor license agreements.  See the NOTICE file distributed with
+//  this work for additional information regarding copyright ownership.
+//  The ASF licenses this file to You under the Apache License, Version 2.0
+//  (the "License"); you may not use this file except in compliance with
+//  the License.  You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+//  Unless required by applicable law or agreed to in writing, software
+//  distributed under the License is distributed on an "AS IS" BASIS,
+//  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+//  See the License for the specific language governing permissions and
+//  limitations under the License.
+//
+////////////////////////////////////////////////////////////////////////////////
+package
+{
+    [Bindable]
+    public class Item
+    {
+        private var _name:String;
+        private var _photo:String;
+               private var _price:String;
+        
+        public function Item()
+        {
+        }
+        
+        public function get name():String
+        {
+            return _name;
+        }
+               
+               public function set name(name:String):void
+               {
+                       _name = name;
+               }
+
+               public function get photo():String
+        {
+            return _photo;
+        }
+               
+               public function set photo(photo:String):void
+               {
+                       _photo = photo;
+               }
+        
+               public function get price():String
+               {
+                       return _price;
+               }
+               public function set price(price:String):void
+               {
+                       _price = price;
+               }
+
+    }
+}
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/controls/ListDataPagingExample.mxml
----------------------------------------------------------------------
diff --git 
a/TourDeFlex/TourDeFlex3/src/spark/controls/ListDataPagingExample.mxml 
b/TourDeFlex/TourDeFlex3/src/spark/controls/ListDataPagingExample.mxml
new file mode 100644
index 0000000..75aeb35
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/controls/ListDataPagingExample.mxml
@@ -0,0 +1,80 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+  Licensed to the Apache Software Foundation (ASF) under one or more
+  contributor license agreements.  See the NOTICE file distributed with
+  this work for additional information regarding copyright ownership.
+  The ASF licenses this file to You under the Apache License, Version 2.0
+  (the "License"); you may not use this file except in compliance with
+  the License.  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+
+-->
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009";
+                          xmlns:s="library://ns.adobe.com/flex/spark"
+                          xmlns:local="*"
+                          initialize="loadSecurity();">
+       
+       <fx:Script>
+               <![CDATA[
+                       import mx.collections.IList;
+                       import mx.collections.errors.ItemPendingError;
+                       import mx.rpc.AsyncResponder;
+                       import mx.rpc.AsyncToken;
+                       import mx.rpc.events.FaultEvent;
+                       import mx.rpc.events.ResultEvent;
+                       
+                       private function loadSecurity():void 
+                       {
+                               
Security.loadPolicyFile("http://www.jamesward.com/census2-tests/crossdomain.xml";);
+                       }
+                       
+                       private function 
handleCreatePendingItemFunction(index:int, ipe:ItemPendingError):Object {
+                               return {};
+                       }
+                       
+                       private function loadItems(list:IList, start:uint, 
count:uint):void
+                       {
+                               var asyncToken:AsyncToken = 
ro.getElements(start, count);
+                               asyncToken.addResponder(new 
AsyncResponder(function result(event:ResultEvent, token:Object = null):void {
+                                       var v:Vector.<Object> = new 
Vector.<Object>();
+                                       for each (var i:Object in event.result)
+                                       {
+                                               v.push(i);
+                                       }
+                                       pagedList.storeItemsAt(v, token as int);
+                               }, function fault(event:FaultEvent, 
token:Object = null):void {
+                                       trace(event.fault.faultString);
+                               }, start));
+                       }
+               ]]>
+       </fx:Script>
+       
+       <fx:Declarations>
+               <local:PagedList id="pagedList" pageSize="100" length="100000" 
loadItemsFunction="loadItems"/>
+               <s:AsyncListView id="asyncListView" list="{pagedList}" 
createPendingItemFunction="handleCreatePendingItemFunction"/>
+               <s:RemoteObject id="ro" destination="census" 
endpoint="http://www.jamesward.com/census2-tests/messagebroker/amf"/>
+       </fx:Declarations>
+       
+       <s:DataGrid dataProvider="{asyncListView}" width="100%" height="100%">
+               <s:columns>
+                       <s:ArrayList>
+                               <s:GridColumn dataField="id"/>
+                               <s:GridColumn dataField="age"/>
+                               <s:GridColumn dataField="classOfWorker"/>
+                               <s:GridColumn dataField="education"/>
+                               <s:GridColumn dataField="maritalStatus"/>
+                               <s:GridColumn dataField="race"/>
+                               <s:GridColumn dataField="sex"/>
+                       </s:ArrayList>
+               </s:columns>
+       </s:DataGrid>
+       
+</s:Application>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/controls/ListExample.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/controls/ListExample.mxml 
b/TourDeFlex/TourDeFlex3/src/spark/controls/ListExample.mxml
new file mode 100644
index 0000000..805c346
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/controls/ListExample.mxml
@@ -0,0 +1,102 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+  Licensed to the Apache Software Foundation (ASF) under one or more
+  contributor license agreements.  See the NOTICE file distributed with
+  this work for additional information regarding copyright ownership.
+  The ASF licenses this file to You under the Apache License, Version 2.0
+  (the "License"); you may not use this file except in compliance with
+  the License.  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+
+-->
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"; 
+                          xmlns:s="library://ns.adobe.com/flex/spark" 
+                          xmlns:mx="library://ns.adobe.com/flex/mx"
+                          xmlns:local="*" viewSourceURL="srcview/index.html">
+       <fx:Script>
+               <![CDATA[
+                       import spark.events.IndexChangeEvent;
+                       
+                       [Bindable]
+                       private var totalPrice:Number = 0.00;
+                       
+                       protected function 
itemIndexChangeHandler(event:IndexChangeEvent):void
+                       {
+                               if (ta.text.length!=0) 
+                                       
ta.text=ta.text+"\n"+myList.selectedItem.name + " $"+myList.selectedItem.price;
+                               else ta.text=myList.selectedItem.name+ " 
$"+myList.selectedItem.price;
+                               totalPrice += Number(myList.selectedItem.price);
+                       }
+                       protected function 
buyBtn_clickHandler(event:MouseEvent):void
+                       {
+                               txtResponse.text="Thank you for your order 
totaling: " + usdFormatter.format(totalPrice) + "\nItems will ship in 3 days.";
+                       }
+
+               ]]>
+       </fx:Script>
+       <fx:Declarations>
+               <mx:CurrencyFormatter id="usdFormatter" precision="2" 
currencySymbol="$"
+                                                         
decimalSeparatorFrom="." decimalSeparatorTo="." useNegativeSign="true"
+                                                         
useThousandsSeparator="true" alignSymbol="left"/>
+       </fx:Declarations>
+       <fx:Style>
+               @namespace "library://ns.adobe.com/flex/spark";
+               #vGrp { 
+                       color: #000000; 
+                       fontFamily: "Arial";
+                       fontSize: "12";
+               }
+       </fx:Style>
+               
+       <s:Panel title="List Sample" 
+                        width="100%" height="100%"  
+                        skinClass="skins.TDFPanelSkin">
+               <s:VGroup id="vGrp" horizontalCenter="0" top="3" 
+                                 width="80%" height="75%">
+                       <s:HGroup verticalAlign="middle">
+                               <s:Label text="Select items to add, price will 
be shown when added:" 
+                                                         
verticalAlign="bottom"/>
+                       </s:HGroup>
+                       <s:HGroup >
+                               <s:List id="myList" height="157" width="160" 
+                                               
itemRenderer="MyListItemRenderer" 
+                                               
change="itemIndexChangeHandler(event)">
+                                       <s:dataProvider>
+                                               <s:ArrayCollection>
+                                                       <local:Item 
name="Backpack" photo="assets/ApacheFlexLogo.png" price="29.99"/>
+                                                       <local:Item 
name="Boots" photo="assets/ApacheFlexLogo.png" price="69.99"/>
+                                                       <local:Item 
name="Compass" photo="assets/ApacheFlexLogo.png" price="12.99"/>
+                                                       <local:Item 
name="Goggles" photo="assets/ApacheFlexLogo.png" price="14.99"/>
+                                                       <local:Item 
name="Helmet" photo="assets/ApacheFlexLogo.png" price="47.99"/>
+                                               </s:ArrayCollection>
+                                       </s:dataProvider>
+                               </s:List>
+                               <s:TextArea id="ta" width="{myList.width}" 
height="{myList.height}" 
+                                                       color="0xAE0A0A" 
fontWeight="bold"/>
+                               <s:VGroup>
+                                       <mx:Spacer height="10"/>
+                                       <s:Label text="Total of Items selected: 
{usdFormatter.format(this.totalPrice)}"/> 
+                                       <s:Button id="buyBtn" 
horizontalCenter="0" bottom="30" label="Buy Now!" 
+                                                         fontWeight="bold" 
+                                                         
click="buyBtn_clickHandler(event)"/>
+                                       <s:Label id="txtResponse"/>
+                               </s:VGroup>
+                       </s:HGroup>
+               </s:VGroup>
+               <s:Label bottom="15" horizontalCenter="0" width="95%" 
verticalAlign="justify" color="#323232" 
+                                         text="The Spark List control displays 
a list of data items. Its functionality is
+very similar to that of the SELECT form element in HTML. The user can select 
one or more items from the list. 
+The List control automatically displays horizontal and vertical scroll bar 
when the list items do not fit 
+the size of the control."/>
+       </s:Panel>
+       
+       
+</s:Application>

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/controls/MyListItemRenderer.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/controls/MyListItemRenderer.mxml 
b/TourDeFlex/TourDeFlex3/src/spark/controls/MyListItemRenderer.mxml
new file mode 100644
index 0000000..73228d6
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/controls/MyListItemRenderer.mxml
@@ -0,0 +1,39 @@
+<!--
+
+Licensed to the Apache Software Foundation (ASF) under one or more
+contributor license agreements.  See the NOTICE file distributed with
+this work for additional information regarding copyright ownership.
+The ASF licenses this file to You under the Apache License, Version 2.0
+(the "License"); you may not use this file except in compliance with
+the License.  You may obtain a copy of the License at
+
+http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+-->
+<s:ItemRenderer
+       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:states>
+               <s:State name="normal"/>
+               <s:State name="hovered"/>
+               <s:State name="selected" />
+       </s:states>
+       
+       <s:layout>
+               <s:VerticalLayout/>
+       </s:layout>
+       
+       <s:HGroup verticalAlign="middle" paddingTop="0" paddingBottom="0">
+               <mx:Image source="{data.photo}" width="50" height="40" 
alpha.hovered=".5"/>
+               <s:Label text="{data.name}" color.hovered="0x1313cd" 
color.selected="0x000000" verticalAlign="bottom"/>
+       </s:HGroup>
+       
+</s:ItemRenderer>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/controls/NumericStepperExample.mxml
----------------------------------------------------------------------
diff --git 
a/TourDeFlex/TourDeFlex3/src/spark/controls/NumericStepperExample.mxml 
b/TourDeFlex/TourDeFlex3/src/spark/controls/NumericStepperExample.mxml
new file mode 100644
index 0000000..b4d2667
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/controls/NumericStepperExample.mxml
@@ -0,0 +1,92 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+  Licensed to the Apache Software Foundation (ASF) under one or more
+  contributor license agreements.  See the NOTICE file distributed with
+  this work for additional information regarding copyright ownership.
+  The ASF licenses this file to You under the Apache License, Version 2.0
+  (the "License"); you may not use this file except in compliance with
+  the License.  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+
+-->
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"; 
+                          xmlns:s="library://ns.adobe.com/flex/spark" 
+                          xmlns:mx="library://ns.adobe.com/flex/mx" 
+                          viewSourceURL="srcview/index.html">
+
+       <fx:Script>
+               <![CDATA[
+                       protected function clickHandler(event:MouseEvent):void
+                       {
+                               responseText.text = "Thank you for your 
purchase of " +this.numStepper.value + " tickets!";
+                       }
+               ]]>
+       </fx:Script>
+
+       <fx:Style>
+               @namespace "library://ns.adobe.com/flex/spark";
+               @namespace mx "library://ns.adobe.com/flex/mx";
+               #formHead { 
+                       fontSize: 18;
+                       fontFamily: Arial;
+                       fontWeight: bold;
+               }
+               mx|FormItem { 
+                       fontSize: 12;
+                       fontFamily: Arial;
+                       fontWeight: bold;
+               }       
+                       
+       </fx:Style>
+       
+       <!-- Note: A custom panel skin is used for the Tour de Flex samples and 
is included in the
+       source tabs for each sample.    -->
+       <s:Panel title="NumericStepper Sample" 
+                        width="100%" height="100%" 
+                        skinClass="skins.TDFPanelSkin">
+                       
+                       <s:HGroup left="15" top="10">
+                               <s:Label width="250" verticalAlign="justify" 
color="#323232" 
+                                                text="The NumericStepper 
control allows you to select a number from an
+ordered set. The NumericStepper control consists of a single-line input text 
field and a pair of arrow buttons
+for stepping through the valid values. You can use the Up Arrow and Down arrow 
keys to cycle through the values."/>
+                               
+                               <mx:Form >
+                                       <mx:FormHeading id="formHead" 
label="Welcome to Ticket Grabber!"/>
+                                       <mx:FormItem label="Name:">
+                                               <s:TextInput id="nameTxt" 
widthInChars="20"/>
+                                       </mx:FormItem>
+                                       <mx:FormItem label="Address:">
+                                               <s:TextArea widthInChars="20" 
heightInLines="2"/>
+                                       </mx:FormItem>
+                                       <mx:FormItem label="Phone:">
+                                               <s:TextInput id="phoneTxt" 
widthInChars="20"/>  
+                                       </mx:FormItem>
+                                       <mx:FormItem label="Select # of 
tickets:">
+                                               <s:NumericStepper 
id="numStepper" width="55" 
+                                                                               
  value="0" snapInterval="2"/>
+                                       </mx:FormItem>
+                                       <mx:FormItem>
+                                               <s:Button label="Buy Now!" 
click="clickHandler(event)"/>
+                                       </mx:FormItem>
+                                       <mx:FormItem>
+                                               <s:Group>
+                                                       <s:Label 
id="responseText"/>    
+                                               </s:Group>
+                                       </mx:FormItem>
+                               </mx:Form>
+                       </s:HGroup>
+               
+               
+               </s:Panel>
+
+       
+</s:Application>

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/controls/OSMFExample.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/controls/OSMFExample.mxml 
b/TourDeFlex/TourDeFlex3/src/spark/controls/OSMFExample.mxml
new file mode 100644
index 0000000..16a2c2c
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/controls/OSMFExample.mxml
@@ -0,0 +1,27 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+  Licensed to the Apache Software Foundation (ASF) under one or more
+  contributor license agreements.  See the NOTICE file distributed with
+  this work for additional information regarding copyright ownership.
+  The ASF licenses this file to You under the Apache License, Version 2.0
+  (the "License"); you may not use this file except in compliance with
+  the License.  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+
+-->
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009";
+                          xmlns:s="library://ns.adobe.com/flex/spark">
+       
+       <s:VideoPlayer horizontalCenter="0" verticalCenter="0"
+               
source="http://mediapm.edgesuite.net/osmf/content/test/manifest-files/dynamic_Streaming.f4m";
 
+               autoPlay="true"/>
+       
+</s:Application>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/controls/PagedList.as
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/controls/PagedList.as 
b/TourDeFlex/TourDeFlex3/src/spark/controls/PagedList.as
new file mode 100644
index 0000000..19e87df
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/controls/PagedList.as
@@ -0,0 +1,510 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+//  Licensed to the Apache Software Foundation (ASF) under one or more
+//  contributor license agreements.  See the NOTICE file distributed with
+//  this work for additional information regarding copyright ownership.
+//  The ASF licenses this file to You under the Apache License, Version 2.0
+//  (the "License"); you may not use this file except in compliance with
+//  the License.  You may obtain a copy of the License at
+//
+//      http://www.apache.org/licenses/LICENSE-2.0
+//
+//  Unless required by applicable law or agreed to in writing, software
+//  distributed under the License is distributed on an "AS IS" BASIS,
+//  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+//  See the License for the specific language governing permissions and
+//  limitations under the License.
+//
+////////////////////////////////////////////////////////////////////////////////
+package  
+{
+       import flash.events.Event;
+       import flash.events.EventDispatcher;
+       
+       import mx.collections.IList;
+       import mx.collections.errors.ItemPendingError;
+       import mx.events.CollectionEvent;
+       import mx.events.CollectionEventKind;
+       import mx.events.PropertyChangeEvent;
+       import mx.events.PropertyChangeEventKind;
+       import mx.resources.IResourceManager;
+       import mx.resources.ResourceManager;
+       import mx.rpc.IResponder;
+       
+       [Event(name="collectionChange", type="mx.events.CollectionEvent")]
+       
+       /**
+        *  An IList whose items are fetched asynchronously by a user provided 
function.   The 
+        *  loadItemsFunction initiates an asynchronous request for a pageSize 
block items, typically
+        *  from a web service.  When the request sucessfully completes, the 
storeItemsAt() method
+        *  must be called. If the request fails, then failItemsAt().
+        * 
+        *  <p>PagedList divides its <code>length</code> items into 
<code>pageSize</code> blocks or 
+        *  "pages".  It tracks which items exist locally, typically because 
they've been stored with
+        *  storeItemsAt().  When an item that does not exist locally is 
requested with getItemAt(),
+        *  the loadItemsFunction is called and then an IPE is thrown.  When 
the loadItemsFunction
+        *  either completes or fails, it must call storeItemsAt() or 
failItemsAt() which causes
+        *  the IPE's responders to run and a "replace" CollectionEvent to be 
dispatched for the 
+        *  updated page.  The failItemsAt() method resets the corresponding 
items to undefined, 
+        *  which means that subsequent calls to getItemAt() will cause an IPE 
to be thrown.</p>
+        * 
+        *  <p>Unlike some other IList implementations, the only method here 
that can thrown an
+        *  IPE is getItemAt().   Methods like getItemIndex() and toArray() 
just report items
+        *  that aren't local as null.</p>
+        * 
+        *  <p>This class is intended to be used as the "list" source for an 
ASyncListView.</p>
+        */
+       public class PagedList  extends EventDispatcher implements IList
+       {
+               /**
+                *  @private
+                */
+               private static function get resourceManager():IResourceManager
+               {
+                       return ResourceManager.getInstance();
+               }
+               
+               /**
+                *  @private
+                */    
+               private static function checkItemIndex(index:int, 
listLength:int):void
+               {
+                       if (index < 0 || (index >= listLength)) 
+                       {
+                               const message:String = 
resourceManager.getString("collections", "outOfBounds", [ index ]);
+                               throw new RangeError(message);
+                       }
+               }
+               
+               /**
+                *  @private
+                *  The IList's items.
+                */
+               private const data:Vector.<*> = new Vector.<*>();
+               
+               /**
+                *  Construct a PagedList with the specified length and 
pageSize.
+                */    
+               public function PagedList(length:int=1000, pageSize:int=10)
+               {
+                       this.data.length = length;
+                       this.pageSize = pageSize;
+                       
+                       for (var i:int = 0; i < data.length; i++)
+                               data[i] = undefined;
+               }
+               
+               //----------------------------------
+               //  loadItemsFunction
+               //---------------------------------- 
+               
+               private var _loadItemsFunction:Function = null;
+               
+               /**
+                *  The value of this property must be a function that loads a 
contiguous 
+                *  block of items and then calls <code>storeItemsAt()</code> 
or 
+                *  <code>failItemsAt()</code>.  A loadItemsFunction must be 
defined as follows:
+                *  <pre>
+                *  myLoadItems(list:PagedList, index:int, count:int):void 
+                *  </pre>
+                *  
+                *  <p>Typically the loadItemsFunction will make one or more 
network requests
+                *  to retrieve the items.   It must do all of its work 
asynchronously to avoid
+                *  blocking the application's GUI.
+                *  
+                */
+               public function get loadItemsFunction():Function
+               {
+                       return _loadItemsFunction;
+               }
+               
+               /**
+                *  @private
+                */
+               public function set loadItemsFunction(value:Function):void
+               {
+                       _loadItemsFunction = value;
+               }
+               
+               //----------------------------------
+               //  length
+               //---------------------------------- 
+               
+               [Bindable("collectionChange")]    
+               
+               /**
+                *  The number of items in the list.
+                *  
+                *  <p>The length of the list can be changed directly however 
the "-1" indeterminate 
+                *  length value is not supported.</p>
+                */
+               public function get length():int
+               {
+                       return data.length;
+               }
+               
+               /**
+                *  @private
+                */
+               public function set length(value:int):void
+               {
+                       const oldLength:int = data.length;
+                       const newLength:int = value;
+                       
+                       if (oldLength == newLength)
+                               return;
+                       
+                       var ce:CollectionEvent = null;
+                       if (hasEventListener(CollectionEvent.COLLECTION_CHANGE))
+                               ce = new 
CollectionEvent(CollectionEvent.COLLECTION_CHANGE);
+                       
+                       if (oldLength < newLength)
+                       {
+                               if (ce)
+                               {
+                                       ce.location = Math.max(oldLength - 1, 
0);
+                                       ce.kind = CollectionEventKind.ADD;
+                                       const itemsLength:int = newLength - 
oldLength;
+                                       for (var i:int = 0; i < itemsLength; 
i++)
+                                               ce.items.push(undefined);
+                               }
+                               
+                               data.length = newLength;
+                               for (var newIndex:int = Math.max(oldLength - 1, 
0); newIndex < newLength; newIndex++)
+                                       data[newIndex] = undefined;
+                       }
+                       else // oldLength > newLength
+                       {
+                               if (ce)
+                               {
+                                       ce.location = Math.max(newLength - 1, 
0);
+                                       ce.kind = CollectionEventKind.REMOVE;
+                                       for (var oldIndex:int = 
Math.max(newLength - 1, 0); oldIndex < oldLength; oldIndex++)
+                                               ce.items.push(data[oldIndex]);
+                               }
+                               
+                               data.length = newLength; 
+                       }
+                       
+                       if (ce)
+                               dispatchEvent(ce);
+               }
+               
+               //----------------------------------
+               //  pageSize
+               //---------------------------------- 
+               
+               private var _pageSize:int = 10;
+               
+               /** 
+                *  Items are loaded in contiguous pageSize blocks.  The value 
of this property should be greater than  
+                *  zero, smaller than the PageList's length, and a reasonable 
working size for the loadItemsFunction.   
+                */
+               public function get pageSize():int
+               {
+                       return _pageSize;
+               }
+               
+               /**
+                *  @private
+                */
+               public function set pageSize(value:int):void
+               {
+                       _pageSize = value;    
+               }
+               
+               /**
+                *  Resets the entire list to its initial state.  All local and 
pending items are 
+                *  cleared.
+                */
+               public function clearItems():void
+               {
+                       var index:int = 0;
+                       for each (var item:Object in data)
+                       data[index++] = undefined;
+                       
+                       if (hasEventListener(CollectionEvent.COLLECTION_CHANGE))
+                       {
+                               var ce:CollectionEvent = new 
CollectionEvent(CollectionEvent.COLLECTION_CHANGE);
+                               ce.kind = CollectionEventKind.RESET;
+                               dispatchEvent(ce);
+                       }            
+               }
+               
+               /**
+                *  @private
+                */
+               private static function createUpdatePCE(itemIndex:Object, 
oldValue:Object, newValue:Object):PropertyChangeEvent
+               {
+                       const pce:PropertyChangeEvent = new 
PropertyChangeEvent(PropertyChangeEvent.PROPERTY_CHANGE);
+                       pce.kind = PropertyChangeEventKind.UPDATE;
+                       pce.property = itemIndex;
+                       pce.oldValue = oldValue;
+                       pce.newValue = newValue;
+                       return pce;
+               }
+               
+               /**
+                *  @private
+                */    
+               private static function createCE(kind:String, location:int, 
item:Object):CollectionEvent
+               {
+                       const ce:CollectionEvent = new 
CollectionEvent(CollectionEvent.COLLECTION_CHANGE);
+                       ce.kind = kind;
+                       ce.location = location;
+                       
+                       if (item is Array)
+                               ce.items = item as Array;
+                       else
+                               ce.items.push(item);
+                       
+                       return ce;
+               }
+               
+               /**
+                *  This method must be called by the loadItemsFunction after a 
block of requested
+                *  items have been successfully retrieved.  It stores the 
specified items in the 
+                *  internal data vector and clears the "pending" state 
associated with the original
+                *  request.
+                */
+               public function storeItemsAt(items:Vector.<Object>, 
index:int):void
+               {
+                       if (index < 0 || (index + items.length) > length) 
+                       {
+                               const message:String = 
resourceManager.getString("collections", "outOfBounds", [ index ]);
+                               throw new RangeError(message);
+                       }
+                       
+                       var item:Object;
+                       var itemIndex:int;
+                       var pce:PropertyChangeEvent;
+                       
+                       // copy the new items into the internal items vector 
and run the IPE responders
+                       
+                       itemIndex = index;
+                       for each (item in items)
+                       {
+                               var ipe:ItemPendingError = data[itemIndex] as 
ItemPendingError;
+                               if (ipe && ipe.responders)
+                               {
+                                       for each (var responder:IResponder in 
ipe.responders)
+                                       responder.result(null);
+                               }
+                               
+                               data[itemIndex++] = item;
+                       }
+                       
+                       // dispatch collection and property change events
+                       
+                       const hasCollectionListener:Boolean = 
hasEventListener(CollectionEvent.COLLECTION_CHANGE);
+                       const hasPropertyListener:Boolean = 
hasEventListener(PropertyChangeEvent.PROPERTY_CHANGE);
+                       var propertyChangeEvents:Array = new Array();  // Array 
of PropertyChangeEvents; 
+                       
+                       if (hasCollectionListener || hasPropertyListener)
+                       {   
+                               itemIndex = index;
+                               for each (item in items)
+                               
propertyChangeEvents.push(createUpdatePCE(itemIndex++, null, item));
+                       }
+                       
+                       if (hasCollectionListener)
+                               
dispatchEvent(createCE(CollectionEventKind.REPLACE, index, 
propertyChangeEvents));
+                       
+                       if (hasPropertyListener)
+                       {
+                               for each (pce in propertyChangeEvents)
+                               dispatchEvent(pce);
+                       }
+               }
+               
+               public function failItemsAt(index:int, count:int):void
+               {
+                       if (index < 0 || (index + count) > length) 
+                       {
+                               const message:String = 
resourceManager.getString("collections", "outOfBounds", [ index ]);
+                               throw new RangeError(message);
+                       }
+                       
+                       for (var i:int = 0; i < count; i++)
+                       {
+                               var itemIndex:int = i + index;
+                               var ipe:ItemPendingError = data[itemIndex] as 
ItemPendingError;
+                               if (ipe && ipe.responders)
+                               {
+                                       for each (var responder:IResponder in 
ipe.responders)
+                                       responder.fault(null);
+                               }
+                               data[itemIndex] = undefined;
+                       }        
+                       
+                       
+                       
+               }
+               
+               
//--------------------------------------------------------------------------
+               //
+               //  IList Implementation (length appears above)
+               //
+               
//--------------------------------------------------------------------------
+               
+               /**
+                *  @inheritDoc
+                */    
+               public function addItem(item:Object):void
+               {
+                       addItemAt(item, length);        
+               }
+               
+               /**
+                *  @inheritDoc
+                */   
+               public function addItemAt(item:Object, index:int):void
+               {
+                       checkItemIndex(index, length + 1);
+                       data.splice(index, index, item);
+                       
+                       if (hasEventListener(CollectionEvent.COLLECTION_CHANGE))
+                               dispatchEvent(createCE(CollectionEventKind.ADD, 
index, item));
+               }
+               
+               /**
+                *  @inheritDoc
+                */   
+               public function getItemAt(index:int, prefetch:int=0):Object
+               {
+                       checkItemIndex(index, length);
+                       
+                       var item:* = data[index];
+                       if (item is ItemPendingError)
+                       {
+                               throw item as ItemPendingError;
+                       }
+                       else if (item === undefined)
+                       {
+                               const ipe:ItemPendingError = new 
ItemPendingError(String(index));
+                               const pageStartIndex:int = Math.floor(index / 
pageSize) * pageSize;
+                               const count:int = Math.min(pageSize, 
data.length - pageStartIndex);
+                               
+                               for (var i:int = 0; i < count; i++)
+                                       data[pageStartIndex + i] = ipe;
+                               
+                               if (loadItemsFunction !== null)
+                                       loadItemsFunction(this, pageStartIndex, 
count);
+                               
+                               // Allow for the possibility that 
loadItemsFunction has synchronously
+                               // loaded the requested data item.
+                               
+                               if (data[index] == ipe)
+                                       throw ipe;
+                               else
+                                       item = data[index];
+                       }
+                       
+                       return item;
+               }
+               
+               /**
+                *  Return the index of of the specified item, if it currently 
exists in the list.
+                *  This method does not cause additional items to be loaded.
+                */   
+               public function getItemIndex(item:Object):int
+               {
+                       return data.indexOf(item);
+               }
+               
+               /**
+                *  @inheritDoc
+                */   
+               public function itemUpdated(item:Object, property:Object=null, 
oldValue:Object=null, newValue:Object=null):void
+               {
+                       const hasCollectionListener:Boolean = 
hasEventListener(CollectionEvent.COLLECTION_CHANGE);
+                       const hasPropertyListener:Boolean = 
hasEventListener(PropertyChangeEvent.PROPERTY_CHANGE);
+                       var pce:PropertyChangeEvent = null;
+                       
+                       if (hasCollectionListener || hasPropertyListener)
+                               pce = createUpdatePCE(property, oldValue, 
newValue);
+                       
+                       if (hasCollectionListener)
+                               
dispatchEvent(createCE(CollectionEventKind.UPDATE, -1, pce));
+                       
+                       if (hasPropertyListener)
+                               dispatchEvent(pce);
+               }
+               
+               /**
+                *  @inheritDoc
+                */   
+               public function removeAll():void
+               {
+                       length = 0;
+                       
+                       if (hasEventListener(CollectionEvent.COLLECTION_CHANGE))
+                       {
+                               const ce:CollectionEvent = new 
CollectionEvent(CollectionEvent.COLLECTION_CHANGE);
+                               ce.kind = CollectionEventKind.RESET;
+                               dispatchEvent(ce);
+                       }
+               }
+               
+               /**
+                *  @inheritDoc
+                */   
+               public function removeItemAt(index:int):Object
+               {
+                       checkItemIndex(index, length);
+                       
+                       const item:Object = data[index];
+                       
+                       data.splice(index, 1);
+                       if (hasEventListener(CollectionEvent.COLLECTION_CHANGE))
+                               
dispatchEvent(createCE(CollectionEventKind.REMOVE, index, item));    
+                       
+                       return item;
+               }
+               
+               /**
+                *  @inheritDoc
+                */   
+               public function setItemAt(item:Object, index:int):Object
+               {
+                       checkItemIndex(index, length);
+                       
+                       const oldItem:Object = data[index];
+                       
+                       if (item !== oldItem)
+                       {
+                               const hasCollectionListener:Boolean = 
hasEventListener(CollectionEvent.COLLECTION_CHANGE);
+                               const hasPropertyListener:Boolean = 
hasEventListener(PropertyChangeEvent.PROPERTY_CHANGE);
+                               var pce:PropertyChangeEvent = null;
+                               
+                               if (hasCollectionListener || 
hasPropertyListener)
+                                       pce = createUpdatePCE(index, oldItem, 
item);
+                               
+                               if (hasCollectionListener)
+                                       
dispatchEvent(createCE(CollectionEventKind.REPLACE, index, pce));
+                               
+                               if (hasPropertyListener)
+                                       dispatchEvent(pce);
+                       }
+                       
+                       return oldItem;
+               }
+               
+               /**
+                *  Returns an array with the same length as this list, that 
contains all of
+                *  the items successfully loaded so far.  
+                * 
+                *  <p>Calling this method does not force additional items to 
be loaded.</p>
+                */   
+               public function toArray():Array
+               {
+                       const rv:Array = new Array(data.length);
+                       
+                       var index:int = 0;
+                       for each (var item:* in data)
+                       rv[index++] = (item is ItemPendingError) ? undefined : 
item;
+                       
+                       return rv;
+               }
+       }
+}

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/controls/PopUpAnchor1Example.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/controls/PopUpAnchor1Example.mxml 
b/TourDeFlex/TourDeFlex3/src/spark/controls/PopUpAnchor1Example.mxml
new file mode 100644
index 0000000..7c2c42b
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/controls/PopUpAnchor1Example.mxml
@@ -0,0 +1,81 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+  Licensed to the Apache Software Foundation (ASF) under one or more
+  contributor license agreements.  See the NOTICE file distributed with
+  this work for additional information regarding copyright ownership.
+  The ASF licenses this file to You under the Apache License, Version 2.0
+  (the "License"); you may not use this file except in compliance with
+  the License.  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+
+-->
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"; 
+                          xmlns:s="library://ns.adobe.com/flex/spark" 
+                          xmlns:mx="library://ns.adobe.com/flex/mx" 
viewSourceURL="srcview/index.html">
+       
+       
+       <fx:Script>
+               <![CDATA[
+                       import mx.controls.Alert;
+                       protected function handleClose(event:MouseEvent):void
+                       {
+                               Alert.show("TEST");
+                               this.currentState="normal";
+                       }
+               ]]>
+       </fx:Script>
+       
+       <s:states>
+               <s:State name="normal" />
+               <s:State name="infoOpen" />
+       </s:states>
+       
+       <s:transitions>
+               <mx:Transition fromState="*" toState="*">
+                       <mx:Sequence>
+                               <s:Fade target="{infoPopUp.popUp}" 
duration="1500"/>
+                       </mx:Sequence>
+               </mx:Transition> 
+       </s:transitions>
+       
+       <fx:Declarations>
+               <s:LinearGradient rotation="90" id="fill1">
+                       <s:GradientEntry color="0xFFFFFF" />
+                       <s:GradientEntry color="0x336699" />
+               </s:LinearGradient>
+       </fx:Declarations>
+       
+       <s:Panel width="100%" height="100%" title="PopUpAnchor Sample" 
skinClass="skins.TDFPanelSkin">  
+               <s:HGroup horizontalCenter="0" top="5">
+                       <s:VGroup top="0">
+                               <s:Label width="200" height="200" 
color="0x323232" 
+                                                text="The PopUpAnchor control 
displays a pop-up component in a layout. It has 
+                                                no visual appearance, but it 
has dimensions. The PopUpAnchor control is used in the DropDownList and 
VolumeBar controls. The PopUpAnchor displays the pop-up component by adding it 
to the PopUpManager, and then sizes and positions the pop-up component relative 
to itself."/>
+                               <s:Label text=" Click the Information icon to 
see the PopUpAnchor in action."/>
+                               <mx:Spacer width="60"/> 
+                       </s:VGroup>
+                       <s:VGroup>
+                               <mx:LinkButton label="Information" 
click="currentState = 'infoOpen'" icon="@Embed('iconinfo.gif')"/>
+                               <s:PopUpAnchor id="infoPopUp" left="0" 
bottom="0" popUpPosition="below"  
+                                                          includeIn="infoOpen" 
displayPopUp.normal="false" 
+                                                          
displayPopUp.infoOpen="true">
+                                       <s:BorderContainer cornerRadius="5" 
backgroundFill="{fill1}" height="160" width="180" 
+                                                         
dropShadowVisible="true">
+                                               <s:Label horizontalCenter="0" 
top="20" width="170" height="155" color="0x323232" 
+                                                                text="Lorem 
ipsum dolor sit amet, consectetur adipiscing elit. Nam laoreet urna fringilla 
risus fermentum sed aliquam lorem aliquam. Maecenas egestas, risus at 
adipiscing faucibus, nisl dui dignissim turpis, at consectetur magna erat in 
ligula."/>
+                                               
+                                               <s:Button top="2" right="2" 
width="16" height="16" skinClass="skins.CloseButtonSkin" 
click="handleClose(event)"/>
+                                       </s:BorderContainer>
+                               </s:PopUpAnchor>
+                       </s:VGroup>
+               </s:HGroup>
+       </s:Panel>
+</s:Application>

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/controls/PopUpAnchor2Example.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/controls/PopUpAnchor2Example.mxml 
b/TourDeFlex/TourDeFlex3/src/spark/controls/PopUpAnchor2Example.mxml
new file mode 100644
index 0000000..0bde928
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/controls/PopUpAnchor2Example.mxml
@@ -0,0 +1,80 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+  Licensed to the Apache Software Foundation (ASF) under one or more
+  contributor license agreements.  See the NOTICE file distributed with
+  this work for additional information regarding copyright ownership.
+  The ASF licenses this file to You under the Apache License, Version 2.0
+  (the "License"); you may not use this file except in compliance with
+  the License.  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+
+-->
+<s:Application 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:states>
+               <s:State name="normal" />
+               <s:State name="emailOpen" />
+               <s:State name="aboutOpen" />
+               <s:State name="infoOpen" />
+       </s:states>
+       
+       <s:transitions>
+               <mx:Transition fromState="*" toState="*">
+                       <mx:Sequence>
+                               <s:Fade target="{emailPopUp.popUp}" 
duration="1000"/>
+                       </mx:Sequence>
+               </mx:Transition> 
+       </s:transitions>
+       
+       <s:Panel width="100%" height="100%" 
+                        title="PopUpAnchor with Form" 
+                        skinClass="skins.TDFPanelSkin">
+               
+               <s:VGroup horizontalCenter="0" top="20">
+                       <s:HGroup>
+                               <mx:LinkButton label="Home" color="0x336699" 
click="currentState = 'normal'"/>
+                               <mx:LinkButton label="About" color="0x336699" 
click="currentState = 'aboutOpen'"/>
+                               <mx:LinkButton label="Information" 
color="0x336699" click="currentState = 'infoOpen'"/>
+                               <mx:LinkButton label="Contact Us" 
color="0x336699" click="currentState = 'emailOpen'"/>
+                       </s:HGroup>
+                       <s:BorderContainer id="border1" excludeFrom="emailOpen" 
width="290" height="200" 
+                                         backgroundColor="0x000000" 
color="0xFFFFFF" cornerRadius="7">
+                               <s:Label width="200" height="200" top="20" 
left="5" 
+                                                text.normal="Welcome to Tour 
de Flex!" 
+                                                text.aboutOpen="Tour de Flex 
is constantly being updated with more cool samples!" 
+                                                text.infoOpen="Check back for 
more Flex 4 samples weekly!"/>
+                       </s:BorderContainer>
+                       <s:PopUpAnchor id="emailPopUp" left="0" bottom="0" 
popUpPosition="below"  
+                                                  includeIn="emailOpen" 
displayPopUp.normal="false" displayPopUp.emailOpen="true">
+                               <mx:Form id="form1" backgroundColor="0x000000" 
color="0xFFFFFF">
+                                       <mx:FormItem label="From :">
+                                               <s:TextInput/>
+                                       </mx:FormItem>
+                                       <mx:FormItem label="To :">
+                                               <s:TextInput/>
+                                       </mx:FormItem>
+                                       <mx:FormItem label="Subject :">
+                                               <s:TextInput/>
+                                       </mx:FormItem>
+                                       <mx:FormItem label="Message :">
+                                               <s:TextArea width="100%" 
height="60" maxChars="60"/>
+                                       </mx:FormItem>
+                                       <mx:FormItem direction="horizontal">
+                                               <s:Button label="Send" 
click="currentState = 'normal'" color="0x000000"/>  
+                                               <s:Button label="Cancel" 
click="currentState = 'normal'" color="0x000000"/>
+                                       </mx:FormItem>
+                               </mx:Form>
+                       </s:PopUpAnchor>
+               </s:VGroup>
+       </s:Panel>
+</s:Application>

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/controls/RadioButtonExample.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/controls/RadioButtonExample.mxml 
b/TourDeFlex/TourDeFlex3/src/spark/controls/RadioButtonExample.mxml
new file mode 100644
index 0000000..0ce17bf
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/controls/RadioButtonExample.mxml
@@ -0,0 +1,95 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+  Licensed to the Apache Software Foundation (ASF) under one or more
+  contributor license agreements.  See the NOTICE file distributed with
+  this work for additional information regarding copyright ownership.
+  The ASF licenses this file to You under the Apache License, Version 2.0
+  (the "License"); you may not use this file except in compliance with
+  the License.  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+
+-->
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"; 
+                          xmlns:s="library://ns.adobe.com/flex/spark" 
+                          xmlns:mx="library://ns.adobe.com/flex/mx" 
+                          viewSourceURL="srcview/index.html">
+
+       <fx:Script>
+               <![CDATA[
+                       protected function 
scoreClickHandler(event:MouseEvent):void
+                       {
+                               var score:Number = 0.0;
+                               
+                               if (group1.selectedValue=="True")
+                                       score=33.34;
+                               if (group2.selectedValue=="South Africa")
+                                       score=score+33.34;
+                               if (group3.selectedValue=="False")
+                                       score=score+33.34;
+                               scoreText.text = "You scored " + 
numberFormatter.format(score).toString()+"%";
+                       }
+               ]]>
+       </fx:Script>
+       <fx:Declarations>
+               <s:RadioButtonGroup id="group1"/>
+               <s:RadioButtonGroup id="group2"/>
+               <s:RadioButtonGroup id="group3"/>
+               <mx:NumberFormatter id="numberFormatter"
+                                                       precision="0"
+                                                       rounding="nearest"/>
+       </fx:Declarations>
+       <fx:Style>
+               @namespace "library://ns.adobe.com/flex/spark";
+               
+               RadioButton{ 
+                       baseColor: #FFFFFF; 
+               }
+               
+       </fx:Style>
+       
+       <!-- Note: A custom panel skin is used for the Tour de Flex samples and 
is included in the
+       source tabs for each sample.    -->
+       <s:Panel title="RadioButton Sample" 
+                        width="100%" height="100%" 
+                        skinClass="skins.TDFPanelSkin">
+               
+               <s:HGroup horizontalCenter="0" top="10">
+                       <s:VGroup>
+                               <s:Label text="1) The sky is blue:"/>
+                               <s:RadioButton id="trueRadioBtn" label="True" 
groupName="group1"/>
+                               <s:RadioButton id="falseRadioBtn" label="False" 
groupName="group1"/>
+                       </s:VGroup>     
+                       <s:VGroup paddingLeft="20">
+                               <s:Label text="2) Which of the following is not 
a continent?"/>
+                               <s:RadioButton id="multiRadioBtnA" label="North 
America" groupName="group2"/>
+                               <s:RadioButton id="multiRadioBtnB" 
label="Europe" groupName="group2"/>
+                               <s:RadioButton id="multiRadioBtnC" label="Asia" 
groupName="group2"/>
+                               <s:RadioButton id="multiRadioBtnD" label="South 
Africa" groupName="group2"/>
+                       </s:VGroup>
+                       <s:VGroup paddingLeft="20">
+                               <s:Label text="3) Tallahasee is the capital of 
Alabama:"/>
+                               <s:RadioButton id="trueRadioBtn3" label="True" 
groupName="group3" />
+                               <s:RadioButton id="falseRadioBtn3" 
label="False" groupName="group3"/>
+                       </s:VGroup>
+                       <s:VGroup horizontalAlign="contentJustify">
+                               <s:Button id="scoreBtn" label="Score Me!" 
click="scoreClickHandler(event)"/>
+                               <s:Label id="scoreText"/>
+                       </s:VGroup>
+               </s:HGroup>
+               
+               <s:Label bottom="20" left="5" width="100%" 
verticalAlign="justify" color="#323232" 
+                                         text="The RadioButton control is a 
single choice in a set of mutually 
+exclusive choices. A RadioButton group is composed of two or more RadioButton 
controls with
+the same group name. Only one member of the group can be selected at any given 
time." />
+       </s:Panel>
+       
+               
+</s:Application>

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/controls/SampleHelpFormExample.mxml
----------------------------------------------------------------------
diff --git 
a/TourDeFlex/TourDeFlex3/src/spark/controls/SampleHelpFormExample.mxml 
b/TourDeFlex/TourDeFlex3/src/spark/controls/SampleHelpFormExample.mxml
new file mode 100644
index 0000000..979187f
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/controls/SampleHelpFormExample.mxml
@@ -0,0 +1,44 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+  Licensed to the Apache Software Foundation (ASF) under one or more
+  contributor license agreements.  See the NOTICE file distributed with
+  this work for additional information regarding copyright ownership.
+  The ASF licenses this file to You under the Apache License, Version 2.0
+  (the "License"); you may not use this file except in compliance with
+  the License.  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+
+-->
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"; 
+                          xmlns:s="library://ns.adobe.com/flex/spark" 
+                          xmlns:mx="library://ns.adobe.com/flex/mx" 
backgroundColor="haloSilver" fontSize="14">
+       
+       <s:Form horizontalCenter="0">
+               <s:FormItem label="Enter some text">
+                       <s:TextInput/>
+                       <s:helpContent>
+                               <s:Label text="I've fallen and I can't get 
up!"/>
+                       </s:helpContent>
+               </s:FormItem>
+               <s:FormItem label="Check a box">
+                       <s:CheckBox label="option 1"/>
+                       <s:CheckBox label="option 2"/>
+                       <s:helpContent>
+                               <s:Label text="What does it mean?"/>
+                               <s:Button label="?" width="30" x="120"/>
+                       </s:helpContent>
+               </s:FormItem>
+               <s:FormItem>
+                       <s:Button label="Submit!"/>
+               </s:FormItem>
+       </s:Form>
+       
+</s:Application>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/controls/SampleSequenceFormExample.mxml
----------------------------------------------------------------------
diff --git 
a/TourDeFlex/TourDeFlex3/src/spark/controls/SampleSequenceFormExample.mxml 
b/TourDeFlex/TourDeFlex3/src/spark/controls/SampleSequenceFormExample.mxml
new file mode 100644
index 0000000..eeb27f2
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/controls/SampleSequenceFormExample.mxml
@@ -0,0 +1,37 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+  Licensed to the Apache Software Foundation (ASF) under one or more
+  contributor license agreements.  See the NOTICE file distributed with
+  this work for additional information regarding copyright ownership.
+  The ASF licenses this file to You under the Apache License, Version 2.0
+  (the "License"); you may not use this file except in compliance with
+  the License.  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+
+-->
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"; 
+                          xmlns:s="library://ns.adobe.com/flex/spark" 
+                          xmlns:mx="library://ns.adobe.com/flex/mx" 
backgroundColor="haloSilver" fontSize="14">
+       
+       <s:Form horizontalCenter="0">
+               <s:FormItem sequenceLabel="1." label="Enter some text">
+                       <s:TextInput/>
+               </s:FormItem>
+               <s:FormItem sequenceLabel="2." label="Check a box">
+                       <s:CheckBox label="option 1"/>
+                       <s:CheckBox label="option 2"/>
+               </s:FormItem>
+               <s:FormItem>
+                       <s:Button label="Submit it!"/>
+               </s:FormItem>
+       </s:Form>
+       
+</s:Application>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/controls/SampleSimpleFormExample.mxml
----------------------------------------------------------------------
diff --git 
a/TourDeFlex/TourDeFlex3/src/spark/controls/SampleSimpleFormExample.mxml 
b/TourDeFlex/TourDeFlex3/src/spark/controls/SampleSimpleFormExample.mxml
new file mode 100644
index 0000000..4d5887c
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/controls/SampleSimpleFormExample.mxml
@@ -0,0 +1,38 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+  Licensed to the Apache Software Foundation (ASF) under one or more
+  contributor license agreements.  See the NOTICE file distributed with
+  this work for additional information regarding copyright ownership.
+  The ASF licenses this file to You under the Apache License, Version 2.0
+  (the "License"); you may not use this file except in compliance with
+  the License.  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+
+-->
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009";
+                          xmlns:s="library://ns.adobe.com/flex/spark"
+                          xmlns:mx="library://ns.adobe.com/flex/mx"
+                          backgroundColor="haloSilver" fontSize="14">
+       
+       <s:Form horizontalCenter="0">
+               <s:FormItem label="Enter some text">
+                       <s:TextInput/>
+               </s:FormItem>
+               <s:FormItem label="Check a box">
+                       <s:CheckBox label="option 1"/>
+                       <s:CheckBox label="option 2"/>
+               </s:FormItem>
+               <s:FormItem>
+                       <s:Button label="Submit it!"/>
+               </s:FormItem>
+       </s:Form>
+
+</s:Application>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/controls/SampleStackedFormExample.mxml
----------------------------------------------------------------------
diff --git 
a/TourDeFlex/TourDeFlex3/src/spark/controls/SampleStackedFormExample.mxml 
b/TourDeFlex/TourDeFlex3/src/spark/controls/SampleStackedFormExample.mxml
new file mode 100644
index 0000000..0203cf9
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/controls/SampleStackedFormExample.mxml
@@ -0,0 +1,38 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+  Licensed to the Apache Software Foundation (ASF) under one or more
+  contributor license agreements.  See the NOTICE file distributed with
+  this work for additional information regarding copyright ownership.
+  The ASF licenses this file to You under the Apache License, Version 2.0
+  (the "License"); you may not use this file except in compliance with
+  the License.  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+
+-->
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"; 
+                          xmlns:s="library://ns.adobe.com/flex/spark" 
+                          xmlns:mx="library://ns.adobe.com/flex/mx" 
backgroundColor="haloSilver" fontSize="14">
+       
+       <s:Form skinClass="spark.skins.spark.StackedFormSkin" 
horizontalCenter="0">
+               <s:FormHeading label="Do some data entry" 
skinClass="spark.skins.spark.StackedFormHeadingSkin"/>
+               <s:FormItem label="Enter some text" 
skinClass="spark.skins.spark.StackedFormItemSkin">
+                       <s:TextInput/>
+               </s:FormItem>
+               <s:FormItem label="Check a box" 
skinClass="spark.skins.spark.StackedFormItemSkin">
+                       <s:CheckBox label="option 1"/>
+                       <s:CheckBox label="option 2"/>
+               </s:FormItem>
+               <s:FormItem skinClass="spark.skins.spark.StackedFormItemSkin">
+                       <s:Button label="Submit it!"/>
+               </s:FormItem>
+       </s:Form>
+       
+</s:Application>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/controls/ScrollBarExample.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/controls/ScrollBarExample.mxml 
b/TourDeFlex/TourDeFlex3/src/spark/controls/ScrollBarExample.mxml
new file mode 100644
index 0000000..21b08df
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/controls/ScrollBarExample.mxml
@@ -0,0 +1,90 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+  Licensed to the Apache Software Foundation (ASF) under one or more
+  contributor license agreements.  See the NOTICE file distributed with
+  this work for additional information regarding copyright ownership.
+  The ASF licenses this file to You under the Apache License, Version 2.0
+  (the "License"); you may not use this file except in compliance with
+  the License.  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+
+-->
+
+<s:Application 
+       xmlns:fx="http://ns.adobe.com/mxml/2009";
+       xmlns:mx="library://ns.adobe.com/flex/mx"
+       xmlns:s="library://ns.adobe.com/flex/spark"  
viewSourceURL="srcview/index.html">
+       
+       <s:Panel width="100%" height="100%"
+                        skinClass="skins.TDFPanelSkin"
+                        title="ScrollBar Sample">
+               
+               <s:layout>
+                               <s:HorizontalLayout paddingLeft="80" 
paddingTop="15"/>
+               </s:layout>
+               <mx:Box borderStyle="solid">
+                       <s:HGroup>
+                               <s:DataGroup id="vertView" left="10" top="20"
+                                                        
clipAndEnableScrolling="true"
+                                                        
itemRenderer="spark.skins.spark.DefaultItemRenderer">
+                                       <s:layout> 
+                                               <s:VerticalLayout 
requestedRowCount="4"/> 
+                                       </s:layout> 
+                                       <s:dataProvider> 
+                                               <s:ArrayCollection> 
+                                                       
<fx:String>Photoshop</fx:String>                
+                                                       
<fx:String>Illustrator</fx:String>                
+                                                       <fx:String>LiveCycle 
ES</fx:String>                
+                                                       
<fx:String>Flash</fx:String>                
+                                                       
<fx:String>Acrobat</fx:String>                
+                                                       
<fx:String>Elements</fx:String>                
+                                                       <fx:String>Creative 
Suite</fx:String>     
+                                                       <fx:String>Premiere 
Pro</fx:String>     
+                                               </s:ArrayCollection>
+                                       </s:dataProvider> 
+                               </s:DataGroup> 
+                               <s:VScrollBar viewport="{vertView}" 
+                                                         top="10" 
+                                                         left="{vertView.x + 
vertView.width + 10}" 
+                                                         
height="{vertView.height}"/>
+                       </s:HGroup>
+               </mx:Box> 
+               <mx:Box borderStyle="solid">
+                       <s:HGroup>
+                               <s:DataGroup id="horizView" right="200" top="10"
+                                                        
clipAndEnableScrolling="true"
+                                                        
itemRenderer="spark.skins.spark.DefaultItemRenderer">
+                                       <s:layout> 
+                                               <s:HorizontalLayout 
requestedColumnCount="3"/> 
+                                       </s:layout> 
+                                       <s:dataProvider> 
+                                               <s:ArrayCollection> 
+                                                       
<fx:String>Photoshop</fx:String>                
+                                                       
<fx:String>Illustrator</fx:String>                
+                                                       <fx:String>LiveCycle 
ES</fx:String>                
+                                                       
<fx:String>Flash</fx:String>                
+                                                       
<fx:String>Acrobat</fx:String>     
+                                               </s:ArrayCollection>
+                                       </s:dataProvider> 
+                               </s:DataGroup> 
+                               
+                       </s:HGroup>
+                       <s:HScrollBar viewport="{horizView}" 
+                                                 left="{horizView.left}" 
+                                                 bottom="{horizView.bottom}" 
+                                                 width ="{horizView.width}"/>
+               </mx:Box>
+               
+               <s:Label paddingLeft="15" width="199" verticalAlign="justify" 
color="0x323232"
+                                text="You can add scrollbars to any component 
to give scrolling capability. This sample shows
+how you can use both a vertical and horizontal ScrollBar. Also see the 
Scroller sample for more information."/>        
+       </s:Panel>
+</s:Application>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/controls/Scroller1Example.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/controls/Scroller1Example.mxml 
b/TourDeFlex/TourDeFlex3/src/spark/controls/Scroller1Example.mxml
new file mode 100644
index 0000000..371f003
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/controls/Scroller1Example.mxml
@@ -0,0 +1,75 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+  Licensed to the Apache Software Foundation (ASF) under one or more
+  contributor license agreements.  See the NOTICE file distributed with
+  this work for additional information regarding copyright ownership.
+  The ASF licenses this file to You under the Apache License, Version 2.0
+  (the "License"); you may not use this file except in compliance with
+  the License.  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+
+-->
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"; 
+                          xmlns:s="library://ns.adobe.com/flex/spark" 
+                          xmlns:mx="library://ns.adobe.com/flex/mx" 
+                          viewSourceURL="srcview/index.html">
+       
+               
+       <s:Panel width="100%" height="100%"
+               skinClass="skins.MyPanelSkin"
+               title="Scroller Sample">
+               <s:VGroup horizontalCenter="0">
+                       <s:HGroup>
+                               <s:Label text="Min Viewport Inset:"/>
+                               <s:HSlider id="slider1"
+                                                  maximum="50"
+                                                  liveDragging="true" />
+                               <s:Label text="Viewport Width:"/>
+                               <s:HSlider id="slider2"
+                                                  minimum="100"
+                                                  maximum="550"
+                                                  value="300"
+                                                  liveDragging="true" />
+                               <s:Label text="Viewport Height:"/>
+                               <s:HSlider id="slider3"
+                                                  minimum="100"
+                                                  maximum="550"
+                                                  value="200"
+                                                  liveDragging="true" />
+                       </s:HGroup>
+                       <s:HGroup>
+                       <s:Scroller id="scroller"
+                                               
minViewportInset="{slider1.value}"
+                                               width="300" height="200">
+                               <s:Group>
+                                       <s:Rect id="rect"
+                                                       width="{slider2.value}"
+                                                       
height="{slider3.value}">
+                                               <s:fill>
+                                                       <s:LinearGradient 
rotation="45">
+                                                               
<s:GradientEntry color="red" />
+                                                               
<s:GradientEntry color="yellow" />
+                                                               
<s:GradientEntry color="haloBlue" />
+                                                       </s:LinearGradient>
+                                               </s:fill>
+                                       </s:Rect>
+                               </s:Group>
+                       </s:Scroller>
+                       <s:Label textAlign="justify" width="280" 
verticalAlign="justify"
+                                                 text="The Scroller control 
contains a pair of scroll bars and a viewport. A viewport displays a 
rectangular subset of the area of
+a component, rather than displaying the entire component. You can use the 
Scroller control to make any container that implements the IViewport interface,
+such as Group, scrollable. The Scroller's horizontal and vertical scroll 
policies are set to auto which indicates that scroll bars are displayed when the
+content within a viewport is larger than the actual size of the viewport."/>
+                       </s:HGroup>
+               </s:VGroup>
+       </s:Panel>
+       
+</s:Application>

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/controls/Scroller2Example.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/controls/Scroller2Example.mxml 
b/TourDeFlex/TourDeFlex3/src/spark/controls/Scroller2Example.mxml
new file mode 100644
index 0000000..d960837
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/controls/Scroller2Example.mxml
@@ -0,0 +1,83 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+  Licensed to the Apache Software Foundation (ASF) under one or more
+  contributor license agreements.  See the NOTICE file distributed with
+  this work for additional information regarding copyright ownership.
+  The ASF licenses this file to You under the Apache License, Version 2.0
+  (the "License"); you may not use this file except in compliance with
+  the License.  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+
+-->
+<!-- Also see 
http://blog.flexexamples.com/2009/07/29/enabling-tabbing-on-spark-scroller-children/
 -->
+<s:Application name="Spark_Scroller_hasFocusableChildren_test"
+                          xmlns:fx="http://ns.adobe.com/mxml/2009";
+                          xmlns:mx="library://ns.adobe.com/flex/mx"
+                          xmlns:s="library://ns.adobe.com/flex/spark">
+       
+       
+       <fx:Script>
+               <![CDATA[
+                       import spark.events.TextOperationEvent;
+                       
+                       private function 
txtChangeHandler(event:TextOperationEvent):void
+                       {
+                               if (event.target is TextInput)
+                               {
+                                       var textInput:TextInput = event.target 
as TextInput;
+                                       textInput.clearStyle("color");
+                               }       
+                       }
+               ]]>
+       </fx:Script>
+       <!-- you want to mark the children of the viewport as focusable so 
you're able to tab to them, 
+       but if you don't want the container itself to be focusable then you 
must turn tabEnabled off on it -->
+       
+       <s:Panel width="100%" height="100%" 
+                        skinClass="skins.TDFPanelSkin" 
+                        title="Scrollers and Tabbing">
+               
+               <!-- The fields are tab-able within the VGroup container -->
+               <s:HGroup horizontalCenter="0" top="10">
+                       <s:VGroup left="0" horizontalAlign="center" width="20%">
+                               <s:BitmapImage id="img" 
source="@Embed(source='assets/ApacheFlexLogo.png')"/>
+                               <s:Label text="Item For Sale"/>
+                       </s:VGroup>
+                       <s:Scroller tabEnabled="true" 
hasFocusableChildren="true">
+                               <s:VGroup>
+                                       <s:Label text="First Name:"/>
+                                       <s:TextInput id="firstName" 
text="firstname" color="#959494" change="txtChangeHandler(event)"/>
+                                       <s:Label text="Last Name:"/>
+                                       <s:TextInput id="lastName" 
text="lastname" color="#959494" change="txtChangeHandler(event)"/>
+                                       <s:Label text="Email:"/>
+                                       <s:TextInput id="emailAdd" text="email" 
color="#959494" change="txtChangeHandler(event)"/>
+                               </s:VGroup>
+                       </s:Scroller>
+                       
+                       <!-- Note: The scroller container automatically sets 
the clipAndEnableScrolling to false for
+                       containers within it. See 'Controlling Viewport' sample 
under 'Coding Techniques' --> 
+                       
+                       <s:Scroller hasFocusableChildren="true" 
tabEnabled="false">
+                               <s:VGroup width="200" height="200"> 
+                                       <s:Label text="Enter item name:"/>
+                                       <s:TextInput id="itemNameTxt" 
text="image-name" width="100%" color="#959494" 
change="txtChangeHandler(event)"/>
+                                       <s:Label text="Enter description of 
your item:"/>
+                                       <s:TextArea id="itemDescTxt" 
text="title" color="#959494" change="txtChangeHandler(event)"/>
+                               </s:VGroup>
+                       </s:Scroller>   
+                       <s:Label right="10" width="180" verticalAlign="justify"
+                                                 text="If you have items 
within a Scroller that need to be tabbed to, you can
+need to set hasFocusableChildren to true. If you do not want the container 
itself to be tab enabled, 
+then you must set tabEnabled to false, such as shown here."/>
+               </s:HGroup>
+       </s:Panel>
+</s:Application>
+

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/d4e368dc/TourDeFlex/TourDeFlex3/src/spark/controls/SliderExample.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/controls/SliderExample.mxml 
b/TourDeFlex/TourDeFlex3/src/spark/controls/SliderExample.mxml
new file mode 100644
index 0000000..25b9866
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/controls/SliderExample.mxml
@@ -0,0 +1,67 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+  Licensed to the Apache Software Foundation (ASF) under one or more
+  contributor license agreements.  See the NOTICE file distributed with
+  this work for additional information regarding copyright ownership.
+  The ASF licenses this file to You under the Apache License, Version 2.0
+  (the "License"); you may not use this file except in compliance with
+  the License.  You may obtain a copy of the License at
+
+      http://www.apache.org/licenses/LICENSE-2.0
+
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+
+-->
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"; 
+                          xmlns:s="library://ns.adobe.com/flex/spark" 
+                          xmlns:mx="library://ns.adobe.com/flex/mx" 
+                          viewSourceURL="srcview/index.html">
+       
+       <s:Panel width="100%" height="100%"
+                        skinClass="skins.TDFPanelSkin"
+                        title="HSlider/VSlider Sample">
+               
+               <s:VGroup left="10" top="10">
+                       <s:Label text="Height:"/>
+                       <s:VSlider id="slider3"
+                                          minimum="50"
+                                          maximum="180"
+                                          value="160"
+                                          liveDragging="true"/>
+               </s:VGroup>
+               <s:Group  left="40" top="25">
+                       <s:Ellipse id="rect"
+                                          width="{slider2.value}"
+                                          height="{slider3.value}">
+                               <s:fill>
+                                       <s:LinearGradient rotation="45">
+                                               <s:GradientEntry 
color="0x5008f3" />
+                                               <s:GradientEntry 
color="0x7a2a84" />
+                                               <s:GradientEntry 
color="0xfe08a4" />
+                                       </s:LinearGradient>
+                               </s:fill>
+                       </s:Ellipse>
+               </s:Group>
+               
+               <s:HGroup right="315" top="10" verticalAlign="middle">
+                       <s:Label text="Width:"/>
+                       <s:HSlider id="slider2"
+                                          minimum="50"
+                                          maximum="250"
+                                          value="200"
+                                          liveDragging="true" />       
+                       
+               </s:HGroup>
+               
+               <s:Label right="40" top="10" width="200" 
verticalAlign="justify" color="0x323232"
+                                text="The slider controls can be used to 
select a value by moving a slider thumb between 
+the end points of the slider track. The current value of the slider is 
determined by the relative location 
+of the thumb between the end points of the slider. The slider end points 
correspond to the slider’s minimum and maximum values."/>
+       </s:Panel>
+       
+</s:Application>

Reply via email to