[5/5] git commit: [flex-utilities] [refs/heads/develop] - Added more spark examples

[jm...@apache.org]

Added more spark examples


Project: http://git-wip-us.apache.org/repos/asf/flex-utilities/repo
Commit: http://git-wip-us.apache.org/repos/asf/flex-utilities/commit/47a67608
Tree: http://git-wip-us.apache.org/repos/asf/flex-utilities/tree/47a67608
Diff: http://git-wip-us.apache.org/repos/asf/flex-utilities/diff/47a67608

Branch: refs/heads/develop
Commit: 47a676080b82cbabbc3b680efb016cf94aa9dab5
Parents: 070907e
Author: Justin Mclean <jm...@apache.org>
Authored: Sat Aug 9 16:31:36 2014 +1000
Committer: Justin Mclean <jm...@apache.org>
Committed: Sat Aug 9 16:31:36 2014 +1000

----------------------------------------------------------------------
 .../SkinableDataContainerExample.mxml           |  62 ++
 .../src/spark/containers/TileGroupExample.mxml  | 101 +++
 .../spark/containers/assets/arrow_icon_sm.png   | Bin 0 -> 527 bytes
 .../src/spark/controls/MyTextFlow.xml           |  23 +
 .../src/spark/controls/TextAreaExample.mxml     |  90 +++
 .../src/spark/controls/TextInputExample.mxml    | 100 +++
 .../src/spark/controls/TextLayout1Example.mxml  | 164 +++++
 .../src/spark/controls/TextLayout2Example.mxml  | 135 ++++
 .../src/spark/controls/TextLayout3example.mxml  |  88 +++
 .../src/spark/controls/TextLayout4Example.mxml  |  77 +++
 .../spark/controls/assets/ApacheFlexLogo.png    | Bin 0 -> 71228 bytes
 .../src/spark/effects/WipeExample.html          | 121 ++++
 .../src/spark/other/ScrollBarsExample.mxml      |  97 +++
 .../src/spark/tlf/TextLayoutEditorCanvas.mxml   | 439 ++++++++++++
 .../src/spark/tlf/TextLayoutEditorSample.mxml   |  29 +
 .../tlf/assets/%scroll_arrow_down_over.png      | Bin 0 -> 109642 bytes
 .../spark/tlf/assets/%scroll_arrow_up_over.png  | Bin 0 -> 109644 bytes
 .../spark/tlf/assets/combo_drop_down_arrow.png  | Bin 0 -> 505 bytes
 .../src/spark/tlf/assets/header_close_icon.png  | Bin 0 -> 3084 bytes
 .../src/spark/tlf/assets/header_open_icon.png   | Bin 0 -> 3095 bytes
 .../src/spark/tlf/assets/scroll_arrow_down.png  | Bin 0 -> 332 bytes
 .../spark/tlf/assets/scroll_arrow_down_over.png | Bin 0 -> 47147 bytes
 .../src/spark/tlf/assets/scroll_arrow_up.png    | Bin 0 -> 311 bytes
 .../spark/tlf/assets/scroll_arrow_up_over.png   | Bin 0 -> 47155 bytes
 .../spark/tlf/flashx/textLayout/UiClasses.as    |  54 ++
 .../tlf/flashx/textLayout/ui/MultiPanel.as      | 206 ++++++
 .../textLayout/ui/MultiPanelHeaderSkin.as       |  58 ++
 .../flashx/textLayout/ui/PanelWithEdgeBars.as   | 266 ++++++++
 .../flashx/textLayout/ui/VellumGUIStyles.css    | 254 +++++++
 .../ui/assets/%scroll_arrow_down_over.png       | Bin 0 -> 109642 bytes
 .../ui/assets/%scroll_arrow_up_over.png         | Bin 0 -> 109644 bytes
 .../ui/assets/combo_drop_down_arrow.png         | Bin 0 -> 505 bytes
 .../textLayout/ui/assets/header_close_icon.png  | Bin 0 -> 3084 bytes
 .../textLayout/ui/assets/header_open_icon.png   | Bin 0 -> 3095 bytes
 .../textLayout/ui/assets/scroll_arrow_down.png  | Bin 0 -> 332 bytes
 .../ui/assets/scroll_arrow_down_over.png        | Bin 0 -> 47147 bytes
 .../textLayout/ui/assets/scroll_arrow_up.png    | Bin 0 -> 311 bytes
 .../ui/assets/scroll_arrow_up_over.png          | Bin 0 -> 47155 bytes
 .../ui/inspectors/AdvancedTextPropertyEditor.as | 190 ++++++
 .../ui/inspectors/AntiAliasPropertyEditor.as    |  51 ++
 .../ui/inspectors/CharacterPropertyEditor.as    | 179 +++++
 .../ui/inspectors/DynamicTextPropertyEditor.as  |  74 ++
 .../ui/inspectors/LinkPropertyEditor.as         |  50 ++
 .../ui/inspectors/ParagraphPropertyEditor.as    | 226 +++++++
 .../ui/inspectors/SelectionUpdateEvent.as       |  41 ++
 .../ui/inspectors/TabPropertyEditor.as          |  64 ++
 .../inspectors/TextContainerPropertyEditor.as   | 151 +++++
 .../ui/inspectors/TextFlowPropertyEditor.as     |  71 ++
 .../ui/inspectors/TextInspectorController.as    | 614 +++++++++++++++++
 .../ui/inspectors/assets/align_center_icon.png  | Bin 0 -> 2834 bytes
 .../ui/inspectors/assets/align_end_icon.png     | Bin 0 -> 2866 bytes
 .../ui/inspectors/assets/align_justify_icon.png | Bin 0 -> 2812 bytes
 .../assets/align_last_center_icon.png           | Bin 0 -> 2826 bytes
 .../inspectors/assets/align_last_left_icon.png  | Bin 0 -> 2812 bytes
 .../inspectors/assets/align_last_right_icon.png | Bin 0 -> 2815 bytes
 .../ui/inspectors/assets/align_left_icon.png    | Bin 0 -> 2827 bytes
 .../ui/inspectors/assets/align_right_icon.png   | Bin 0 -> 2828 bytes
 .../ui/inspectors/assets/align_start_icon.png   | Bin 0 -> 2915 bytes
 .../ui/inspectors/assets/bold_icon.png          | Bin 0 -> 2887 bytes
 .../assets/cont_align_bottom_icon.png           | Bin 0 -> 287 bytes
 .../assets/cont_align_justify_icon.png          | Bin 0 -> 299 bytes
 .../assets/cont_align_middle_icon.png           | Bin 0 -> 313 bytes
 .../inspectors/assets/cont_align_top_icon.png   | Bin 0 -> 310 bytes
 .../ui/inspectors/assets/italic_icon.png        | Bin 0 -> 2909 bytes
 .../ui/inspectors/assets/strikethrough_icon.png | Bin 0 -> 2899 bytes
 .../ui/inspectors/assets/subscript_icon.png     | Bin 0 -> 2886 bytes
 .../ui/inspectors/assets/superscript_icon.png   | Bin 0 -> 2892 bytes
 .../ui/inspectors/assets/tcy_icon.png           | Bin 0 -> 2973 bytes
 .../ui/inspectors/assets/underline_icon.png     | Bin 0 -> 2892 bytes
 .../ui/rulers/ParagraphPropertyMarker.as        |  98 +++
 .../ui/rulers/ParagraphPropertyMarkerSkin.as    | 103 +++
 .../tlf/flashx/textLayout/ui/rulers/RulerBar.as | 672 +++++++++++++++++++
 .../textLayout/ui/rulers/RulerDragTracker.as    |  88 +++
 .../flashx/textLayout/ui/rulers/RulerMarker.as  | 124 ++++
 .../flashx/textLayout/ui/rulers/TabMarker.as    |  86 +++
 .../textLayout/ui/rulers/TabMarkerSkin.as       |  94 +++
 .../textLayout/ui/styles/PopupMenuSkin.as       |  70 ++
 .../ui/styles/ScrollbarDownArrowUpSkin.as       |  45 ++
 .../ui/styles/ScrollbarThumbOverSkin.as         |  89 +++
 .../ui/styles/ScrollbarThumbUpSkin.as           |  89 +++
 .../textLayout/ui/styles/ScrollbarTrackSkin.as  |  68 ++
 .../ui/styles/ScrollbarUpArrowUpSkin.as         |  45 ++
 .../tlf/textEditBar/FeatureSetChangeEvent.as    |  42 ++
 .../src/spark/tlf/textEditBar/FileEvent.as      |  43 ++
 .../src/spark/tlf/textEditBar/FileIOHelper.as   | 268 ++++++++
 .../src/spark/tlf/textEditBar/FileServices.mxml |  96 +++
 .../src/spark/tlf/textEditBar/GraphicBar.mxml   | 153 +++++
 .../spark/tlf/textEditBar/GraphicChangeEvent.as |  61 ++
 .../src/spark/tlf/textEditBar/LinkBar.mxml      | 158 +++++
 .../spark/tlf/textEditBar/LinkChangeEvent.as    |  51 ++
 .../tlf/textEditBar/SingleContainerView.mxml    |  80 +++
 .../src/spark/tlf/textEditBar/SpriteWithIME.as  | 102 +++
 .../src/spark/tlf/textEditBar/StatusPopup.mxml  |  39 ++
 .../spark/tlf/textEditBar/StyleChangeEvent.as   |  46 ++
 .../spark/tlf/textEditBar/assets/%icon_tcy.png  | Bin 0 -> 110058 bytes
 .../textEditBar/assets/BreakOpportunityType.png | Bin 0 -> 26281 bytes
 .../tlf/textEditBar/assets/EmbedDeleteIcon.png  | Bin 0 -> 47172 bytes
 .../assets/EmbedDeleteIconDisabled.png          | Bin 0 -> 48199 bytes
 .../assets/P_TextAlignBottom_Sm_N.png           | Bin 0 -> 287 bytes
 .../assets/P_TextAlignJustify_Sm_N.png          | Bin 0 -> 299 bytes
 .../assets/P_TextAlignMiddle_Sm_N.png           | Bin 0 -> 313 bytes
 .../textEditBar/assets/P_TextAlignTop_Sm_N.png  | Bin 0 -> 310 bytes
 .../assets/P_TextBaselineShift_Md_N.png         | Bin 0 -> 713 bytes
 .../assets/P_TextBottomOffset_Md_N.png          | Bin 0 -> 527 bytes
 .../assets/P_TextFirstLineIndent_Md_N.png       | Bin 0 -> 627 bytes
 .../assets/P_TextLeftIndent_Md_N.png            | Bin 0 -> 697 bytes
 .../assets/P_TextLeftOffset_Md_N.png            | Bin 0 -> 519 bytes
 .../assets/P_TextRightIndent_Md_N.png           | Bin 0 -> 739 bytes
 .../assets/P_TextRightOffset_Md_N.png           | Bin 0 -> 513 bytes
 .../textEditBar/assets/P_TextSmallCaps_Md_N.png | Bin 0 -> 647 bytes
 .../assets/P_TextSpaceAfter_Md_N.png            | Bin 0 -> 578 bytes
 .../assets/P_TextSpaceBefore_Md_N.png           | Bin 0 -> 572 bytes
 .../textEditBar/assets/P_TextTopOffset_Md_N.png | Bin 0 -> 530 bytes
 .../assets/TextAutoLeadingPercent.png           | Bin 0 -> 27667 bytes
 .../spark/tlf/textEditBar/assets/digitCase.png  | Bin 0 -> 2964 bytes
 .../spark/tlf/textEditBar/assets/digitWidth.png | Bin 0 -> 3123 bytes
 .../tlf/textEditBar/assets/elementBaseline.png  | Bin 0 -> 26703 bytes
 .../assets/icon_align_all_but_last.png          | Bin 0 -> 26692 bytes
 .../textEditBar/assets/icon_align_center.png    | Bin 0 -> 27220 bytes
 .../tlf/textEditBar/assets/icon_align_end.PNG   | Bin 0 -> 215 bytes
 .../textEditBar/assets/icon_align_justify.png   | Bin 0 -> 27095 bytes
 .../tlf/textEditBar/assets/icon_align_left.png  | Bin 0 -> 27210 bytes
 .../tlf/textEditBar/assets/icon_align_right.png | Bin 0 -> 27210 bytes
 .../tlf/textEditBar/assets/icon_align_start.PNG | Bin 0 -> 184 bytes
 .../tlf/textEditBar/assets/icon_bullet.png      | Bin 0 -> 27234 bytes
 .../tlf/textEditBar/assets/icon_style_bold.png  | Bin 0 -> 27205 bytes
 .../textEditBar/assets/icon_style_italic.png    | Bin 0 -> 27229 bytes
 .../assets/icon_style_strikethrough.png         | Bin 0 -> 26697 bytes
 .../textEditBar/assets/icon_style_underline.png | Bin 0 -> 27197 bytes
 .../spark/tlf/textEditBar/assets/icon_tcy.png   | Bin 0 -> 59524 bytes
 .../spark/tlf/textEditBar/assets/ligatures.png  | Bin 0 -> 3045 bytes
 .../tlf/textEditBar/assets/lineBaseline.png     | Bin 0 -> 26737 bytes
 132 files changed, 6885 insertions(+)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/47a67608/TourDeFlex/TourDeFlex3/src/spark/containers/SkinableDataContainerExample.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/containers/SkinableDataContainerExample.mxml b/TourDeFlex/TourDeFlex3/src/spark/containers/SkinableDataContainerExample.mxml
new file mode 100644
index 0000000..e2c9414
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/containers/SkinableDataContainerExample.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" viewSourceURL="srcview/index.html">
+	
+	<s:Panel width="100%" height="100%" title="SkinnableDataContainer" skinClass="skins.TDFPanelSkin">
+		<s:layout><s:HorizontalLayout paddingLeft="8" paddingTop="8" paddingRight="12"/></s:layout>
+		
+		<s:VGroup>
+			<s:Label text="Famous Astronauts" fontWeight="bold" fontSize="14"/>
+			<s:SkinnableDataContainer horizontalCenter="-66" verticalCenter="0" width="301">
+				<s:layout>
+					<s:VerticalLayout/>
+				</s:layout>
+				<s:itemRenderer>
+					<fx:Component>
+						<s:ItemRenderer>
+							<s:VGroup horizontalCenter="0" verticalCenter="0">
+								<s:HGroup verticalAlign="middle">
+									<s:Label text="{data.firstName}"/>
+									<s:Label text="{data.lastName}"/>
+									<s:Label text="{data.phoneNumber}"/>
+									<mx:LinkButton label="{data.college}" color="0x3380DD" click="navigateToURL(new URLRequest(data.url), '_blank')"
+												   textDecoration="underline" fontWeight="normal" icon="@Embed('assets/arrow_icon_sm.png')" />
+								</s:HGroup>
+							</s:VGroup>
+						</s:ItemRenderer>
+					</fx:Component>
+				</s:itemRenderer>
+				
+				<s:ArrayCollection>
+					<fx:Object firstName="John" lastName="Glenn" phoneNumber="888-555-1111" college="West Point" url="http://www.usma.edu/"/>
+					<fx:Object firstName="Neil" lastName="Armstrong" phoneNumber="888-555-2222" college="Purdue" url="http://www.purdue.edu/"/>
+					<fx:Object firstName="Buzz" lastName="Aldrin" phoneNumber="888-555-3333" college="Muskingum" url="http://www.muskingum.edu/"/>
+					<fx:Object firstName="James" lastName="Lovell" phoneNumber="888-555-4444" college="US Naval Academy" url="http://www.usna.edu/"/>
+				</s:ArrayCollection>
+			</s:SkinnableDataContainer>
+		</s:VGroup>
+		<s:Label color="0x323232" width="200" text="The SkinnableDataContainer is the skinnable version of the DataGroup and
+while it can hold visual elements, they are often used only to hold data items as children. Data items can be simple data items 
+such String and Number objects, and more complicated data items such as Object and XMLNode objects."/>
+	</s:Panel>
+	
+</s:Application>

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/47a67608/TourDeFlex/TourDeFlex3/src/spark/containers/TileGroupExample.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/containers/TileGroupExample.mxml b/TourDeFlex/TourDeFlex3/src/spark/containers/TileGroupExample.mxml
new file mode 100644
index 0000000..9fa4af7
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/containers/TileGroupExample.mxml
@@ -0,0 +1,101 @@
+<?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" viewSourceURL="srcview/index.html">
+	
+	<fx:Declarations>
+		<fx:Array id="orientArray">
+			<fx:String>Rows</fx:String>
+			<fx:String>Columns</fx:String>
+		</fx:Array>
+	</fx:Declarations>
+	
+	<fx:Script>
+		<![CDATA[
+			import mx.collections.ArrayList;
+			import skins.TDFPanelSkin;
+			
+			private function applyProperties():void
+			{
+				this.mainGroup.orientation = this.orientation.selectedItem;
+				this.mainGroup.horizontalGap = this.hgap.value;
+				this.mainGroup.verticalGap = this.vgap.value;
+				this.mainGroup.requestedColumnCount = this.colCount.value;
+				this.mainGroup.requestedRowCount = this.rowCount.value;
+			}
+		]]>
+	</fx:Script>
+	
+	<s:Panel skinClass="skins.TDFPanelSkin" title="TileGroup Sample" width="100%" height="100%">
+		<s:TileGroup left="300" top="10" id="mainGroup">
+			<s:Rect width="100" height="75">
+				<s:fill>
+					<s:SolidColor color="0xd54f4f"/>
+				</s:fill>
+			</s:Rect>
+			<s:Rect width="100" height="75">
+				<s:fill>
+					<s:SolidColor color="0x2f977d"/>
+				</s:fill>
+			</s:Rect>
+			<s:Rect width="100" height="75">
+				<s:fill>
+					<s:SolidColor color="0xfffca2"/>
+				</s:fill>
+			</s:Rect>
+		</s:TileGroup>	
+		
+		<s:VGroup top="10" left="10">
+			<s:HGroup verticalAlign="middle">
+				<s:Label text="Orientation:"/>
+				<s:DropDownList id="orientation" dataProvider="{new ArrayList(orientArray)}" prompt="columns"/>
+			</s:HGroup>
+			
+			<s:HGroup verticalAlign="middle">
+				<s:Label text="Horizontal Gap:"/>
+				<s:NumericStepper id="hgap" maximum="400"/>
+			</s:HGroup>	
+			
+			<s:HGroup verticalAlign="middle">
+				<s:Label text="Vertical Gap:"/>
+				<s:NumericStepper id="vgap" maximum="400"/>
+			</s:HGroup>	
+			
+			<s:HGroup verticalAlign="middle">
+				<s:Label text="Requested Column Count:"/>
+				<s:NumericStepper id="colCount"/>
+			</s:HGroup>
+			
+			<s:HGroup verticalAlign="middle">
+				<s:Label text="Requested Row Count:"/>
+				<s:NumericStepper id="rowCount"/>
+			</s:HGroup>
+			<s:Button label="Apply Properties" click="this.applyProperties()"/>
+			<mx:Spacer height="10"/>
+			<s:Label width="85%" horizontalCenter="0" color="#323232" 
+					 text="The TileGroup container is an instance of the Group container that uses the TileLayout class. You can use the properties of the 
+					 TileGroup class to modify the characteristics of the TileLayout class."/>
+
+		</s:VGroup>
+		
+	</s:Panel>
+	
+</s:Application>

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/47a67608/TourDeFlex/TourDeFlex3/src/spark/containers/assets/arrow_icon_sm.png
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/containers/assets/arrow_icon_sm.png b/TourDeFlex/TourDeFlex3/src/spark/containers/assets/arrow_icon_sm.png
new file mode 100644
index 0000000..33debc8
Binary files /dev/null and b/TourDeFlex/TourDeFlex3/src/spark/containers/assets/arrow_icon_sm.png differ

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/47a67608/TourDeFlex/TourDeFlex3/src/spark/controls/MyTextFlow.xml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/controls/MyTextFlow.xml b/TourDeFlex/TourDeFlex3/src/spark/controls/MyTextFlow.xml
new file mode 100644
index 0000000..8b787ea
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/controls/MyTextFlow.xml
@@ -0,0 +1,23 @@
+<?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.
+
+-->
+<!-- http://blog.flexexamples.com/2009/08/11/setting-text-in-a-spark-richtext-control-in-flex-4/ -->
+<TextFlow xmlns="http://ns.adobe.com/textLayout/2008" whiteSpaceCollapse="preserve">
+    <p><span>This is an example of external text being included that is using the </span> <span fontWeight="bold">Text Layout Framework </span> <span> markup.</span></p>
+</TextFlow>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/47a67608/TourDeFlex/TourDeFlex3/src/spark/controls/TextAreaExample.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/controls/TextAreaExample.mxml b/TourDeFlex/TourDeFlex3/src/spark/controls/TextAreaExample.mxml
new file mode 100644
index 0000000..87d270e
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/controls/TextAreaExample.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 skins.TDFPanelSkin;
+			
+			protected function changeHandler():void
+			{
+				txt.maxChars = this.maxChars.value;
+				txt.restrict = this.restrictStr.text;
+				txt.textDisplay.textFlow.textAlign = alignVal.selectedItem;
+				txt.textDisplay.textFlow.direction = direction.selectedItem;
+			}
+		]]>
+	</fx:Script>
+	
+	<s:Panel title="TextArea Sample"
+			 width="100%" height="100%" skinClass="skins.TDFPanelSkin">
+		
+		<s:HGroup  top="8" width="100%" height="100%" left="80">
+			<s:VGroup>
+				<s:HGroup verticalAlign="middle">
+					<s:Label text="Specify Max Character Input:"/>
+					<s:NumericStepper id="maxChars" maximum="200" value="100" stepSize="2" change="this.changeHandler()"/>
+				</s:HGroup>
+				<s:HGroup verticalAlign="middle">
+					<s:Label text="Specify Text Alignment:"/>
+					<s:DropDownList id="alignVal" prompt="left" change="this.changeHandler()">
+						<s:dataProvider>
+							<mx:ArrayList>
+								<fx:String>left</fx:String>
+								<fx:String>right</fx:String>
+								<fx:String>center</fx:String>
+								<fx:String>justify</fx:String>
+								<fx:String>start</fx:String>
+								<fx:String>end</fx:String>
+							</mx:ArrayList>
+						</s:dataProvider>
+					</s:DropDownList>
+				</s:HGroup>
+				<s:HGroup verticalAlign="middle">
+					<s:Label text="Direction:"/>
+					<s:DropDownList id="direction" prompt="ltr" change="this.changeHandler()">
+						<s:dataProvider>
+							<mx:ArrayList>
+								<fx:String>ltr</fx:String>
+								<fx:String>rtl</fx:String>
+							</mx:ArrayList>
+						</s:dataProvider>
+					</s:DropDownList>
+				</s:HGroup>
+				<s:HGroup verticalAlign="middle">
+					<s:Label text="Specify characters to restrict (use - for range):"/>
+					<s:TextInput id="restrictStr" change="this.changeHandler()" text="a-z 1-9"/> 
+				</s:HGroup>
+				<s:VGroup>
+					<s:Label text="Text:"/>
+					<s:TextArea id="txt" width="300" height="70" color="0x323232" horizontalCenter="0" verticalCenter="0" restrict="a-z 1-9"
+								change="this.changeHandler()"/>
+				</s:VGroup>
+			</s:VGroup>	
+			<s:Label width="200" color="#323232" top="20" right="80"
+					 text="TextArea is a text-entry control that lets users enter and edit multiple lines of richly formatted text. 
+It can display horizontal and vertical scrollbars for scrolling through the text and supports vertical scrolling with the mouse wheel. This sample also shows
+how you can restrict character input on the text area. The default when this is run will not allow the number 0 or caps based on the restrict range shown. The
+sample also shows how you can specify a direction on the text."/>
+		</s:HGroup>
+		
+	</s:Panel>
+</s:Application>

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/47a67608/TourDeFlex/TourDeFlex3/src/spark/controls/TextInputExample.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/controls/TextInputExample.mxml b/TourDeFlex/TourDeFlex3/src/spark/controls/TextInputExample.mxml
new file mode 100644
index 0000000..e548ab1
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/controls/TextInputExample.mxml
@@ -0,0 +1,100 @@
+<?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.TextOperationEvent;
+			
+			private function txtChangeHandler(event:TextOperationEvent):void
+			{
+				var textInput:TextInput = event.target as TextInput;
+				textInput.clearStyle("color");
+			}
+			
+
+			protected function changeHandler(event:MouseEvent):void
+			{
+				txt.maxChars = this.maxChars.value;
+				txt.restrict = this.restrictStr.text;
+				txt.textDisplay.textFlow.textAlign = alignVal.selectedItem;
+				txt.textDisplay.textFlow.direction = direction.selectedItem;
+			}
+
+		]]>
+	</fx:Script>
+	 
+	<s:Panel skinClass="skins.TDFPanelSkin" 
+			 width="100%" height="100%"
+			 title="TextInput Sample">
+		
+		<s:VGroup top="20" width="100%" height="100%" left="200">
+			<s:HGroup verticalAlign="middle">
+				<s:Label text="Specify Max Character Input:"/>
+				<s:NumericStepper id="maxChars" value="30" stepSize="2" change="this.changeHandler(null)"/>
+			</s:HGroup>
+			<s:HGroup verticalAlign="middle">
+				<s:Label text="Specify Text Alignment:"/>
+				<s:DropDownList id="alignVal" prompt="left" change="this.changeHandler(null)">
+					<s:dataProvider>
+						<mx:ArrayList>
+							<fx:String>left</fx:String>
+							<fx:String>right</fx:String>
+							<fx:String>center</fx:String>
+							<fx:String>justify</fx:String>
+							<fx:String>start</fx:String>
+							<fx:String>end</fx:String>
+						</mx:ArrayList>
+					</s:dataProvider>
+				</s:DropDownList>
+			</s:HGroup>
+			<s:HGroup verticalAlign="middle">
+				<s:Label text="Direction:"/>
+				<s:DropDownList id="direction" prompt="ltr" change="this.changeHandler(null)">
+					<s:dataProvider>
+						<mx:ArrayList>
+							<fx:String>rtl</fx:String>
+							<fx:String>ltr</fx:String>
+						</mx:ArrayList>
+					</s:dataProvider>
+				</s:DropDownList>
+			</s:HGroup>
+			<s:HGroup verticalAlign="middle">
+				<s:Label text="Specify characters to restrict (use - for range):"/>
+				<s:TextInput id="restrictStr" change="this.changeHandler(null)"/> 
+			</s:HGroup>
+			<s:HGroup verticalAlign="middle">
+				<s:Label text="Text Input:"/>
+				<s:TextInput id="txt" maxChars="{maxChars.value}" maxWidth="150" 
+							 change="txtChangeHandler(event)" textAlign="{alignVal.selectedItem}"/>	
+			</s:HGroup>
+			<mx:Spacer height="10"/>
+			<s:Label width="85%" horizontalCenter="0" color="#323232"
+					 text="TextInput is a text-entry control that lets users enter and edit a single line of uniformly-formatted text.
+This Spark version of TextInput makes use of the Text Layout Framework (TLF). Numerous properties are available to be set using the 
+textFlow object from the TLF framework. Uses of some are shown above."/>
+		</s:VGroup>
+		
+	</s:Panel>
+	
+
+</s:Application>

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/47a67608/TourDeFlex/TourDeFlex3/src/spark/controls/TextLayout1Example.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/controls/TextLayout1Example.mxml b/TourDeFlex/TourDeFlex3/src/spark/controls/TextLayout1Example.mxml
new file mode 100644
index 0000000..456f390
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/controls/TextLayout1Example.mxml
@@ -0,0 +1,164 @@
+<?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"
+			   xmlns:local="*" creationComplete="init()" viewSourceURL="srcview/index.html">
+	
+	<!-- Based on original code from here and updated and enhanced for Flex 4:
+		http://www.adobe.com/devnet/flex/articles/text_layout_framework_04.html
+	-->
+	
+	<fx:Script>
+		<![CDATA[
+			import flashx.textLayout.container.ContainerController;
+			import flashx.textLayout.conversion.ITextImporter;
+			import flashx.textLayout.conversion.TextConverter;
+			import flashx.textLayout.edit.EditManager;
+			import flashx.textLayout.edit.ISelectionManager;
+			import flashx.textLayout.edit.SelectionState;
+			import flashx.textLayout.elements.InlineGraphicElement;
+			import flashx.textLayout.elements.ParagraphElement;
+			import flashx.textLayout.elements.TextFlow;
+			import flashx.textLayout.events.SelectionEvent;
+			import flashx.textLayout.events.StatusChangeEvent;
+			import flashx.textLayout.formats.Direction;
+			import flashx.textLayout.formats.TextLayoutFormat;
+			import flashx.undo.UndoManager;
+			
+			import mx.collections.ArrayCollection;
+			import mx.controls.CheckBox;
+			import mx.events.FlexEvent;
+			import mx.events.SliderEvent;
+			
+			import skins.TDFPanelSkin;
+			
+			import spark.components.Group;
+			import spark.core.SpriteVisualElement;
+			
+			public var directions:ArrayCollection = new ArrayCollection(
+				[
+					{label:"Left-to-Right", data:Direction.LTR},
+					{label:"Right-to-Left", data:Direction.RTL}
+				]
+			);
+			
+			[Embed(source="assets/ApacheFlexLogo.png")]
+			[Bindable]
+			static public var imgClass:Class;
+			
+			private var _textContainer:SpriteVisualElement = null;
+			
+			private static const textInput:XML = <TextFlow xmlns="http://ns.adobe.com/textLayout/2008">
+				<div>
+					<p><span>The Text Layout Framework is an extensible library, built on the new text engine in Adobe Flash Player 10, which delivers advanced, easy-to-integrate typographic and text layout features for rich, sophisticated and innovative typography on the web. 
+				Some benefits provided by this framework include: 1) rich typographical controls, including kerning, ligatures, typographic case, digit case, digit width and discretionary hyphens
+				2) cut, copy, paste, undo and standard keyboard and mouse gestures for editing 3) selection, editing and flowing text across multiple columns and linked containers 
+				4) bidirectional text, vertical text and over 30 writing scripts including Arabic, Hebrew, Chinese, Japanese, Korean, Thai, Lao, Vietnamese, and others
+				5) vertical text, Tate-Chu-Yoko (horizontal within vertical text) and justifier for East Asian typography. Try editing this text and playing with the options below! Notice an inline image is also included.</span></p>
+				</div>
+				</TextFlow>;
+			
+			private var _textFlow:TextFlow;
+			
+			private function init():void {
+				
+				_textContainer = new SpriteVisualElement();
+				
+				canvas.addElement(_textContainer);
+				var importer:ITextImporter = TextConverter.getImporter(TextConverter.TEXT_LAYOUT_FORMAT);
+				importer.throwOnError = true; // will throw exception if parsing error occurs on import
+
+				_textFlow = importer.importToFlow(textInput);
+				_textFlow.flowComposer.addController(new ContainerController(_textContainer, canvas.width-40, canvas.height));
+				
+				// add the graphic
+				var p:ParagraphElement = new ParagraphElement();
+				var inlineGraphicElement:InlineGraphicElement = new InlineGraphicElement();
+				inlineGraphicElement.source = imgClass;
+				inlineGraphicElement.width=32;
+				inlineGraphicElement.height=32;
+				p.addChild(inlineGraphicElement);
+				_textFlow.addChild(p);
+				
+				//adding Select/Edit/Copy/Paste/Undo features
+				_textFlow.interactionManager = new EditManager(new UndoManager());
+				
+				// initialize with a selection before the first character
+				_textFlow.interactionManager.selectRange(0,0);
+				_textFlow.flowComposer.updateAllControllers();
+			}
+			
+			private function changeFontSize(event:Event):void {
+				_textFlow.fontSize = fontSize.value;
+				_textFlow.direction = direction.selectedItem.data;
+				_textFlow.flowComposer.updateAllControllers();
+			}
+			
+			private function changeNoColumns(event:Event):void {
+				var tlf:TextLayoutFormat = new TextLayoutFormat();
+				tlf.columnCount = cols.value;
+				tlf.columnGap = 15;
+				tlf.direction = direction.selectedItem.data;
+				_textFlow.format = tlf;
+				_textFlow.flowComposer.updateAllControllers();
+			}
+			
+			private function changeTextDirection(event:Event):void {
+				_textFlow.direction = (event.target as DropDownList).selectedItem.data;
+				_textFlow.flowComposer.updateAllControllers();
+			}
+			
+			protected function undo_clickHandler(event:MouseEvent):void
+			{
+				var em:EditManager = _textFlow.interactionManager as EditManager;
+				trace("Can undo " + em.undoManager.canUndo() + " can redo " + em.undoManager.canRedo());
+				em.undoManager.undo();
+			}
+			protected function redo_clickHandler(event:MouseEvent):void
+			{
+				var em:EditManager = _textFlow.interactionManager as EditManager;
+				em.undoManager.redo();
+			}
+
+		]]>
+	</fx:Script>
+	<s:Panel skinClass="skins.TDFPanelSkin" title="Text Layout Framework Sample" width="100%" height="100%">
+		<s:layout>
+			<s:VerticalLayout paddingTop="8" paddingLeft="8"/>
+		</s:layout>
+		
+		<s:VGroup>
+			<s:Group id="canvas" width="600" height="200" />
+			<s:HGroup width="100%" verticalAlign="middle">
+				<s:Label text="Font Size:"/>
+				<s:NumericStepper id="fontSize" minimum="6" maximum="22" snapInterval="1" change="changeFontSize(event)" value="12" />
+				<s:Label text="# Columns:"/>
+				<s:NumericStepper id="cols"  minimum="1" maximum="20" snapInterval="1" change="changeNoColumns(event)" />
+				<s:Label text="Text Direction:"/>
+				<s:DropDownList id="direction" change="changeTextDirection(event)" dataProvider="{directions}" 
+								selectedItem="{directions[0]}"/>
+				<s:Button label="Undo" click="undo_clickHandler(event)"/>
+				<s:Button label="Redo" click="redo_clickHandler(event)"/>
+			</s:HGroup>
+		</s:VGroup>
+	</s:Panel>
+	
+</s:Application>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/47a67608/TourDeFlex/TourDeFlex3/src/spark/controls/TextLayout2Example.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/controls/TextLayout2Example.mxml b/TourDeFlex/TourDeFlex3/src/spark/controls/TextLayout2Example.mxml
new file mode 100644
index 0000000..b21ddae
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/controls/TextLayout2Example.mxml
@@ -0,0 +1,135 @@
+<?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" maxWidth="690" maxHeight="300"
+			   creationComplete="init()">
+	
+<!-- This sample is based on this page: http://help.adobe.com/en_US/ActionScript/3.0_ProgrammingAS3_Flex/WS0d70b2a8565d75766ba6608d121cc29f375-8000.html -->
+	
+	<fx:Script>
+		<![CDATA[
+			import flash.display.StageAlign; 
+			import flash.display.StageScaleMode; 
+			import flash.events.Event; 
+			import flash.geom.Rectangle; 
+			
+			import flashx.textLayout.compose.StandardFlowComposer; 
+			import flashx.textLayout.container.ContainerController; 
+			import flashx.textLayout.container.ScrollPolicy; 
+			import flashx.textLayout.conversion.TextConverter; 
+			import flashx.textLayout.elements.TextFlow; 
+			import flashx.textLayout.formats.TextLayoutFormat; 
+			
+			import spark.core.SpriteVisualElement;
+			
+			private var hTextFlow:TextFlow; 
+			private var headContainer:SpriteVisualElement; 
+			private var headlineController:ContainerController; 
+			private var hContainerFormat:TextLayoutFormat; 
+			
+			private var bTextFlow:TextFlow; 
+			private var bodyTextContainer:SpriteVisualElement; 
+			private var bodyController:ContainerController; 
+			private var bodyTextContainerFormat:TextLayoutFormat; 
+			
+			private const headlineMarkup:String = "<flow:TextFlow xmlns:flow='http://ns.adobe.com/textLayout/2008'><flow:p textAlign='center'><flow:span fontFamily='Helvetica' fontSize='18'>TLF News Layout Example</flow:span><flow:br/><flow:span fontFamily='Helvetica' fontSize='14'>This example formats text like a newspaper page with a headline, a subtitle, and multiple columns</flow:span></flow:p></flow:TextFlow>"; 
+			
+			private const bodyMarkup:String = "<flow:TextFlow xmlns:flow='http://ns.adobe.com/textLayout/2008' fontSize='12' textIndent='10' marginBottom='15' paddingTop='4' paddingLeft='4'><flow:p marginBottom='inherit'><flow:span>There are many </flow:span><flow:span fontStyle='italic'>such</flow:span><flow:span> lime-kilns in that tract of country, for the purpose of burning the white marble which composes a large part of the substance of the hills. Some of them, built years ago, and long deserted, with weeds growing in the vacant round of the interior, which is open to the sky, and grass and wild-flowers rooting themselves into the chinks of the stones, look already like relics of antiquity, and may yet be overspread with the lichens of centuries to come. Others, where the lime-burner still feeds his daily and nightlong fire, afford points of interest to the wanderer among the hills, who seats himself on a log of wood or a fragment of marble, to hold a chat with the solitary man. It is a
  lonesome, and, when the character is inclined to thought, may be an intensely thoughtful occupation; as it proved in the case of Ethan Brand, who had mused to such strange purpose, in days gone by, while the fire in this very kiln was burning.</flow:span></flow:p><flow:p marginBottom='inherit'><flow:span>The man who now watched the fire was of a different order, and troubled himself with no thoughts save the very few that were requisite to his business. At frequent intervals, he flung back the clashing weight of the iron door, and, turning his face from the insufferable glare, thrust in huge logs of oak, or stirred the immense brands with a long pole.</flow:span></flow:p></flow:TextFlow>"; 
+			
+			public function init() 
+			{ 
+				// Headline text flow and flow composer 
+				hTextFlow = TextConverter.importToFlow(headlineMarkup, TextConverter.TEXT_LAYOUT_FORMAT); 
+				hTextFlow.flowComposer = new StandardFlowComposer(); 
+				
+				// initialize the headline container and controller objects 
+				headContainer = new SpriteVisualElement(); 
+				headlineController = new ContainerController(headContainer); 
+				headlineController.verticalScrollPolicy = ScrollPolicy.OFF; 
+				hContainerFormat = new TextLayoutFormat(); 
+				hContainerFormat.paddingTop = 4; 
+				hContainerFormat.paddingRight = 4; 
+				hContainerFormat.paddingBottom = 4; 
+				hContainerFormat.paddingLeft = 4; 
+				
+				headlineController.format = hContainerFormat; 
+				hTextFlow.flowComposer.addController(headlineController); 
+				addElement(headContainer); 
+				this.addEventListener(flash.events.Event.RESIZE, resizeHandler); 
+				
+				// Body text TextFlow and flow composer 
+				bTextFlow = TextConverter.importToFlow(bodyMarkup, TextConverter.TEXT_LAYOUT_FORMAT); 
+				bTextFlow.flowComposer = new StandardFlowComposer(); 
+				
+				// The body text container is below, and has three columns 
+				bodyTextContainer = new SpriteVisualElement(); 
+				bodyController = new ContainerController(bodyTextContainer); 
+				bodyTextContainerFormat = new TextLayoutFormat(); 
+				bodyTextContainerFormat.columnCount = 4; 
+				bodyTextContainerFormat.columnGap = 30; 
+				
+				bodyController.format = bodyTextContainerFormat; 
+				bTextFlow.flowComposer.addController(bodyController); 
+				addElement(bodyTextContainer); 
+				resizeHandler(null); 
+			} 
+			
+			private function resizeHandler(event:Event):void 
+			{ 
+				trace("Resizing!");
+				const verticalGap:Number = 25; 
+				const stagePadding:Number = 16; 
+				var stageWidth:Number = this.width - stagePadding; 
+				var stageHeight:Number = this.height - stagePadding; 
+				var headlineWidth:Number = stageWidth; 
+				var headlineContainerHeight:Number = stageHeight; 
+				
+				// Initial compose to get height of headline after resize 
+				headlineController.setCompositionSize(headlineWidth, headlineContainerHeight); 
+				hTextFlow.flowComposer.compose(); 
+				var rect:Rectangle = headlineController.getContentBounds(); 
+				headlineContainerHeight = rect.height; 
+				
+				// Initial compose to get height of headline after resize 
+				headlineController.setCompositionSize(headlineWidth, headlineContainerHeight); 
+				hTextFlow.flowComposer.compose(); 
+				var rect:Rectangle = headlineController.getContentBounds(); 
+				headlineContainerHeight = rect.height; 
+				
+				// Resize and place headline text container 
+				// Call setCompositionSize() again with updated headline height 
+				headlineController.setCompositionSize(headlineWidth, headlineContainerHeight ); 
+				headlineController.container.x = stagePadding / 2; 
+				headlineController.container.y = stagePadding / 2; 
+				hTextFlow.flowComposer.updateAllControllers(); 
+				
+				// Resize and place body text container 
+				var bodyContainerHeight:Number = (stageHeight - verticalGap - headlineContainerHeight); 
+				bodyController.format = bodyTextContainerFormat; 
+				bodyController.setCompositionSize(stageWidth, bodyContainerHeight ); 
+				bodyController.container.x = (stagePadding/2); 
+				bodyController.container.y = (stagePadding/2) + headlineContainerHeight + verticalGap; 
+				bTextFlow.flowComposer.updateAllControllers(); 
+			} 
+		]]>
+	</fx:Script>
+
+</s:Application>

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/47a67608/TourDeFlex/TourDeFlex3/src/spark/controls/TextLayout3example.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/controls/TextLayout3example.mxml b/TourDeFlex/TourDeFlex3/src/spark/controls/TextLayout3example.mxml
new file mode 100644
index 0000000..f776e46
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/controls/TextLayout3example.mxml
@@ -0,0 +1,88 @@
+<?xml version="1.0"?>
+<!--
+
+  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"
+	creationComplete="init()">
+	
+	<fx:Declarations>
+		<fx:XML id="textFlowAsXML" source="MyTextFlow.xml" />
+	</fx:Declarations>
+	
+	<fx:Style>
+		@namespace "library://ns.adobe.com/flex/spark";
+		Label { 
+			baseColor: #000000; 
+			fontFamily: "Verdana";
+			fontSize: "12";
+			advancedAntiAliasing: true;
+		}
+		
+	</fx:Style>
+	<fx:Script><![CDATA[
+		import flashx.textLayout.conversion.TextConverter;
+		import flashx.textLayout.elements.TextFlow;
+		
+		import spark.utils.TextFlowUtil;
+		XML.ignoreWhitespace = false; 
+		private function init():void {
+			// Creates a TextFlow by importing a String containing the markup language used by the Text Layout Framework.
+			// If you specify it, don't forget the namespace -> xmlns="http://ns.adobe.com/textLayout/2008"
+			var markup:String = "<TextFlow xmlns='http://ns.adobe.com/textLayout/2008'><p fontFamily='Arial'>This is TLF markup with paragraphs.</p><p color='0x663399'>The root TextFlow tag is inlcuded.</p></TextFlow>"; 
+			rt1.textFlow = TextFlowUtil.importFromString(markup);
+			
+			// This next string shows that if the root TextFlow tag is omitted, it will be added for you. 
+			markup = "<p color='0xCE267D'>This is TLF markup with paragraphs.</p><p fontSize='10' fontWeight='bold' fontFamily='Arial'>The root TextFlow tag is omitted and therefore created automatically.</p>"; 
+			rt2.textFlow = TextFlowUtil.importFromString(markup);
+			
+			// This line shows how you would import plain text with no paragraph spacing
+			var autoMarkup:String = "This is just a plain old string that has no markup within it."; 
+			rt3.textDisplay.textFlow = TextFlowUtil.importFromString(autoMarkup);
+			
+			// This example shows how you can use the TextConverter class from TLF to import HTML formatted text
+			// See the docs for the subset of HTML that is supported: 
+			//		http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/flashx/textLayout/conversion/TextConverter.html#TEXT_FIELD_HTML_FORMAT
+			var myHTML:String = "<p>This is <i>HTML</i> markup.<br><b>Hello Tour de Flex Users!</b></p>";
+			rt4.textFlow = TextConverter.importToFlow(myHTML,TextConverter.TEXT_FIELD_HTML_FORMAT);
+		}
+	]]></fx:Script>
+	
+	<s:Panel skinClass="skins.TDFPanelSkin" title="Importing Text using TLF and Flex 4" width="100%" height="100%">
+		<s:layout>
+			<s:HorizontalLayout paddingTop="8" paddingLeft="8" paddingRight="12"/>
+		</s:layout>
+		
+		<s:VGroup>
+			<s:RichText id="rt1" width="200"/>
+			<s:TextArea id="rt2" width="300" height="50"/>
+			<s:TextInput id="rt3" width="260"/>
+			<s:RichEditableText id="rt4" width="200"/>
+			
+			<s:RichText id="rt5" width="280"
+						textFlow="{TextFlowUtil.importFromXML(textFlowAsXML)}"
+						horizontalCenter="0" verticalCenter="0" />
+		</s:VGroup>
+		<s:Label width="200" color="0x323232" verticalAlign="justify" text="This sample shows how you can use different types of text markup within
+the Flex 4 components that are based on TLF through an import. This can be especially useful for dynamically loading text
+that is returned from an HTTPService call at runtime for instance."/>
+		
+	</s:Panel>
+</s:Application>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/47a67608/TourDeFlex/TourDeFlex3/src/spark/controls/TextLayout4Example.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/controls/TextLayout4Example.mxml b/TourDeFlex/TourDeFlex3/src/spark/controls/TextLayout4Example.mxml
new file mode 100644
index 0000000..50af0d4
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/controls/TextLayout4Example.mxml
@@ -0,0 +1,77 @@
+<?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.
+
+-->
+<!-- Sample derived from: http://help.adobe.com/en_US/Flex/4.0/UsingSDK/WS02f7d8d4857b1677-165a04e1126951a2d98-7ff8.html --> 
+<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"> 
+	
+	<fx:Script> 
+		<![CDATA[ 
+			import flashx.textLayout.conversion.TextConverter; 
+			
+			XML.ignoreWhitespace = false; 
+		]]> 
+	</fx:Script> 
+	<fx:Style>
+		@namespace "library://ns.adobe.com/flex/spark";
+		Label { 
+			baseColor: #000000; 
+			fontFamily: "Verdana";
+			fontSize: "12";
+			advancedAntiAliasing: true;
+		}
+	</fx:Style>
+	<fx:Declarations> 
+		<!-- Define a String to use with HTML and plain text format. --> 
+		<fx:String id="htmlTextAsHTML"><![CDATA[<p>Text containing <b>HTML</b> markup</p>]]></fx:String> 
+		
+		<!-- Define an XML object to use with TLF format. --> 
+		<fx:XML id="tfTextAsTextFlow"> 
+			<TextFlow xmlns="http://ns.adobe.com/textLayout/2008"> 
+				<p>Text Using  <span fontWeight="bold">Text Layout Framework</span> Markup</p> 
+			</TextFlow> 
+		</fx:XML> 
+	</fx:Declarations> 
+	
+	<s:Panel skinClass="skins.TDFPanelSkin" title="Text Import Format Types Sample" width="100%" height="100%">
+		<s:layout>
+			<s:HorizontalLayout paddingTop="8" paddingLeft="8" paddingRight="12"/>
+		</s:layout>
+		
+		<s:Label verticalAlign="justify" width="200" text="This example shows how you can use different format types for importing text
+and what the result will be in the Flex 4 component shown."/>
+		<s:VGroup>
+			<s:TextArea id="txt1" width="200" height="50"
+						textFlow="{TextConverter.importToFlow(htmlTextAsHTML, TextConverter.TEXT_FIELD_HTML_FORMAT)}" 
+						horizontalCenter="0" verticalCenter="0" /> 
+			
+				<s:Label text="Same marked up text with plain format specified:"/>
+				<s:TextArea id="txt2" height="50" width="200"
+							textFlow="{TextConverter.importToFlow(htmlTextAsHTML, TextConverter.PLAIN_TEXT_FORMAT)}" 
+							horizontalCenter="0" verticalCenter="0" /> 
+			
+			<s:TextArea id="txt3" width="200" height="50"
+						textFlow="{TextConverter.importToFlow(tfTextAsTextFlow, TextConverter.TEXT_LAYOUT_FORMAT)}" 
+						horizontalCenter="0" verticalCenter="0" /> 
+		</s:VGroup>
+		
+	</s:Panel>
+	
+</s:Application>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/47a67608/TourDeFlex/TourDeFlex3/src/spark/controls/assets/ApacheFlexLogo.png
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/controls/assets/ApacheFlexLogo.png b/TourDeFlex/TourDeFlex3/src/spark/controls/assets/ApacheFlexLogo.png
new file mode 100644
index 0000000..4ff037f
Binary files /dev/null and b/TourDeFlex/TourDeFlex3/src/spark/controls/assets/ApacheFlexLogo.png differ

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/47a67608/TourDeFlex/TourDeFlex3/src/spark/effects/WipeExample.html
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/effects/WipeExample.html b/TourDeFlex/TourDeFlex3/src/spark/effects/WipeExample.html
new file mode 100644
index 0000000..37d9446
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/effects/WipeExample.html
@@ -0,0 +1,121 @@
+<!--
+  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.
+-->
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<!-- saved from url=(0014)about:internet -->
+<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">	
+    <!-- 
+    Smart developers always View Source. 
+    
+    This application was built using Adobe Flex, an open source framework
+    for building rich Internet applications that get delivered via the
+    Flash Player or to desktops via Adobe AIR. 
+    
+    Learn more about Flex at http://flex.org 
+    // -->
+    <head>
+        <title></title>         
+        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+		<!-- Include CSS to eliminate any default margins/padding and set the height of the html element and 
+		     the body element to 100%, because Firefox, or any Gecko based browser, interprets percentage as 
+			 the percentage of the height of its parent container, which has to be set explicitly.  Initially, 
+			 don't display flashContent div so it won't show if JavaScript disabled.
+		-->
+        <style type="text/css" media="screen"> 
+			html, body	{ height:100%; }
+			body { margin:0; padding:0; overflow:auto; text-align:center; 
+			       background-color: #ffffff; }   
+			#flashContent { display:none; }
+        </style>
+		
+		<!-- Enable Browser History by replacing useBrowserHistory tokens with two hyphens -->
+        <!-- BEGIN Browser History required section -->
+        <link rel="stylesheet" type="text/css" href="history/history.css" />
+        <script type="text/javascript" src="history/history.js"></script>
+        <!-- END Browser History required section -->  
+		    
+        <script type="text/javascript" src="swfobject.js"></script>
+        <script type="text/javascript">
+            <!-- For version detection, set to min. required Flash Player version, or 0 (or 0.0.0), for no version detection. --> 
+            var swfVersionStr = "10.0.0";
+            <!-- To use express install, set to playerProductInstall.swf, otherwise the empty string. -->
+            var xiSwfUrlStr = "playerProductInstall.swf";
+            var flashvars = {};
+            var params = {};
+            params.quality = "high";
+            params.bgcolor = "#ffffff";
+            params.allowscriptaccess = "sameDomain";
+            params.allowfullscreen = "true";
+            var attributes = {};
+            attributes.id = "sample";
+            attributes.name = "sample";
+            attributes.align = "middle";
+            swfobject.embedSWF(
+                "sample.swf", "flashContent", 
+                "100%", "100%", 
+                swfVersionStr, xiSwfUrlStr, 
+                flashvars, params, attributes);
+			<!-- JavaScript enabled so display the flashContent div in case it is not replaced with a swf object. -->
+			swfobject.createCSS("#flashContent", "display:block;text-align:left;");
+        </script>
+    </head>
+    <body>
+        <!-- SWFObject's dynamic embed method replaces this alternative HTML content with Flash content when enough 
+			 JavaScript and Flash plug-in support is available. The div is initially hidden so that it doesn't show
+			 when JavaScript is disabled.
+		-->
+        <div id="flashContent">
+        	<p>
+	        	To view this page ensure that Adobe Flash Player version 
+				10.0.0 or greater is installed. 
+			</p>
+			<script type="text/javascript"> 
+				var pageHost = ((document.location.protocol == "https:") ? "https://" :	"http://"); 
+				document.write("<a href='http://www.adobe.com/go/getflashplayer'><img src='" 
+								+ pageHost + "www.adobe.com/images/shared/download_buttons/get_flash_player.gif' alt='Get Adobe Flash player' /></a>" ); 
+			</script> 
+        </div>
+	   	
+       	<noscript>
+            <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="100%" height="100%" id="sample">
+                <param name="movie" value="sample.swf" />
+                <param name="quality" value="high" />
+                <param name="bgcolor" value="#ffffff" />
+                <param name="allowScriptAccess" value="sameDomain" />
+                <param name="allowFullScreen" value="true" />
+                <!--[if !IE]>-->
+                <object type="application/x-shockwave-flash" data="sample.swf" width="100%" height="100%">
+                    <param name="quality" value="high" />
+                    <param name="bgcolor" value="#ffffff" />
+                    <param name="allowScriptAccess" value="sameDomain" />
+                    <param name="allowFullScreen" value="true" />
+                <!--<![endif]-->
+                <!--[if gte IE 6]>-->
+                	<p> 
+                		Either scripts and active content are not permitted to run or Adobe Flash Player version
+                		10.0.0 or greater is not installed.
+                	</p>
+                <!--<![endif]-->
+                    <a href="http://www.adobe.com/go/getflashplayer">
+                        <img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash Player" />
+                    </a>
+                <!--[if !IE]>-->
+                </object>
+                <!--<![endif]-->
+            </object>
+	    </noscript>		
+   </body>
+</html>

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/47a67608/TourDeFlex/TourDeFlex3/src/spark/other/ScrollBarsExample.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/other/ScrollBarsExample.mxml b/TourDeFlex/TourDeFlex3/src/spark/other/ScrollBarsExample.mxml
new file mode 100644
index 0000000..664e1ee
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/other/ScrollBarsExample.mxml
@@ -0,0 +1,97 @@
+<?xml version="1.0"?>
+<!--
+
+  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.
+
+-->
+<!-- controls\bar\SBarSimple.mxml -->
+<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.events.ScrollEvent;
+			
+			import skins.TDFPanelSkin;
+			
+			private function vbarScroll():void {
+				log.text = "VScrollBar properties summary:" + '\n' +
+					"------------------------------------" + '\n' +
+					"Current scroll position: " + 
+					bar.value  + '\n' +
+					"The maximum scroll position: " + 
+					bar.maximum + '\n' +
+					"The minimum scroll position: " + 
+					bar.minimum;
+				
+				rect.height = bar.value;
+			}
+			private function hbarScroll():void {
+				log.text = "HScrollBar properties summary:" + '\n' +
+					"------------------------------------" + '\n' +
+					"Current scroll position: " + 
+					hbar.value  + '\n' +
+					"The maximum scroll position: " + 
+					hbar.maximum + '\n' +
+					"The minimum scroll position: " + 
+					hbar.minimum;
+				
+				rect.width = hbar.value;
+			}
+		]]>
+	</fx:Script> 
+	<s:Panel width="100%" height="100%" title="VScrollBar and HScrollBar Sample" skinClass="skins.TDFPanelSkin">
+		<s:layout>
+			<s:HorizontalLayout paddingLeft="5" paddingRight="5" paddingTop="5"/>
+		</s:layout>
+		<s:VGroup>
+			<s:Label 
+				width="100%" 
+				text="Drag the ScrollBar controls to change the size of the Rectangle graphic."/>
+			
+			<s:HGroup>
+				<s:VScrollBar id="bar" 
+							  height="180" 
+							  minimum="0" 
+							  maximum="{bar.height}"
+							  stepSize="10" 
+							  pageSize="10"
+							  value="{rect.height}"
+							  change="vbarScroll()"/>
+				<s:Rect id="rect" width="50" height="20">
+					<s:fill>
+						<s:LinearGradient rotation="90">
+							<s:GradientEntry color="#6191c3"/>
+							<s:GradientEntry color="#6191c3"/>
+							<s:GradientEntry color="#323232" alpha=".3"/>
+						</s:LinearGradient>
+					</s:fill>
+				</s:Rect>
+			</s:HGroup>
+			<s:HScrollBar id="hbar" width="180" value="{rect.width}"
+						  minimum="0" maximum="{hbar.width}" stepSize="10" pageSize="10" change="hbarScroll()"/>
+		</s:VGroup>
+		<s:VGroup width="200">
+			<s:TextArea id="log" editable="false" height="88"/>	
+			
+			<s:Label color="0x323232" width="188" text="The ScrollBar controls (HScrollBar and VScrollBar) can be used stand-alone, but typically you would combine it as part of 
+another group of components to provide scrolling functionality. "/>	
+		</s:VGroup>
+		
+	</s:Panel>
+		
+</s:Application>

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/47a67608/TourDeFlex/TourDeFlex3/src/spark/tlf/TextLayoutEditorCanvas.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/tlf/TextLayoutEditorCanvas.mxml b/TourDeFlex/TourDeFlex3/src/spark/tlf/TextLayoutEditorCanvas.mxml
new file mode 100644
index 0000000..019fe00
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/tlf/TextLayoutEditorCanvas.mxml
@@ -0,0 +1,439 @@
+<?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.
+
+-->
+
+
+
+
+<mx:Canvas
+    xmlns="http://ns.adobe.com/mxml/2009"
+ 	xmlns:mx="library://ns.adobe.com/flex/mx"
+	xmlns:flow="library://ns.adobe.com/flashx/textLayout"
+	xmlns:textEditBar="textEditBar.*"
+	xmlns:txui="flashx.textLayout.ui.*"
+	xmlns:txrulers="flashx.textLayout.ui.rulers.*"
+	xmlns:txinsp="flashx.textLayout.ui.inspectors.*"
+	explicitMinWidth="300" 
+	explicitMinHeight="200"
+	creationComplete="handleCreationComplete()"
+	resize="handleResize()">
+	
+		
+    <Script><![CDATA[
+		import flashx.textLayout.container.ContainerController;
+		import flashx.textLayout.debug.assert;
+		import flashx.textLayout.edit.EditManager;
+		import flashx.textLayout.edit.EditingMode;
+		import flashx.textLayout.edit.ElementRange;
+		import flashx.textLayout.edit.ISelectionManager;
+		import flashx.textLayout.edit.SelectionFormat;
+		import flashx.textLayout.edit.SelectionManager;
+		import flashx.textLayout.edit.SelectionState;
+		import flashx.textLayout.elements.Configuration;
+		import flashx.textLayout.elements.InlineGraphicElementStatus;
+		import flashx.textLayout.elements.ParagraphElement;
+		import flashx.textLayout.elements.SpanElement;
+		import flashx.textLayout.elements.TextFlow;
+		import flashx.textLayout.events.SelectionEvent;
+		import flashx.textLayout.events.StatusChangeEvent;
+		import flashx.textLayout.formats.TextLayoutFormat;
+		import flashx.undo.IUndoManager;
+		import flashx.undo.UndoManager;
+		
+		import textEditBar.FileIOHelper;
+		import flashx.textLayout.ui.inspectors.TextInspectorController;
+		
+		import mx.events.IndexChangedEvent;
+				
+		private var resizeOK:Boolean;
+		public var activeFlow:TextFlow;
+
+		// undo/redo manager
+		private var undoManager:IUndoManager;
+		
+		private var bottomPanels:Array = [];
+		
+		
+		public function handleCreationComplete(): void
+		{
+			initializeConfiguration();
+			FileIOHelper.parentWindow = this;
+			FileIOHelper.changeContent = changeContent;
+					
+			resizeOK = true;
+			handleResize();
+ 			 			
+ 			undoManager = new UndoManager();
+  			 			
+			hruler.creationComplete();
+ 			vruler.creationComplete();
+ 			
+ 			var numPanels:int = bottomTabs.numChildren;
+ 			for (var i:int = 0; i < numPanels; ++i)
+ 			{
+ 				var panel:Canvas = bottomTabs.getChildAt(i) as Canvas;
+ 				bottomPanels.push(panel.getChildAt(0));
+ 				if (i > 0)
+ 					panel.removeAllChildren();
+ 			}
+  			bottomTabs.addEventListener(IndexChangedEvent.CHANGE, onBottomTabChanged);
+  			
+  			this.addEventListener(Event.ACTIVATE, onFocus); 
+  			
+			changeContent(createEmptyFlow());
+			callLater(doFocus);
+		}
+		
+		private function doFocus():void
+		{
+			if (activeFlow)
+			{
+				var selMgr:ISelectionManager = activeFlow.interactionManager;
+				if (selMgr && textPanel.visible)
+					selMgr.setFocus();
+			}
+		}
+		private function createEmptyFlow():TextFlow
+		{
+			var newFlow:TextFlow = new TextFlow();
+			var para:ParagraphElement = new ParagraphElement();
+			para.addChild(new SpanElement());
+			newFlow.addChild(para);
+			return newFlow;
+		}
+ 		
+ 		private function initializeConfiguration():void
+ 		{
+ 			var config:Configuration = TextFlow.defaultConfiguration;
+			config.unfocusedSelectionFormat = new SelectionFormat(0xffffff, 1.0, BlendMode.DIFFERENCE, 0xffffff, 1.0, BlendMode.DIFFERENCE, 0);
+			config.inactiveSelectionFormat = new SelectionFormat(0xffffff, 1.0, BlendMode.DIFFERENCE, 0xffffff, 1.0, BlendMode.DIFFERENCE, 0);
+			config.manageTabKey = true;
+			var initialFormat:TextLayoutFormat = new TextLayoutFormat();
+			initialFormat.fontFamily = "Arial";
+			initialFormat.fontSize = 16;
+			initialFormat.paddingLeft = 2;
+			initialFormat.paddingTop = 2;
+			initialFormat.paddingRight = 2;
+			initialFormat.paddingBottom = 2;
+			config.textFlowInitialFormat = initialFormat;
+		}
+ 		
+ 		private function onFocus(event:Event):void
+ 		{
+ 			if (activeFlow)
+ 			{
+	 			var selMgr:ISelectionManager = activeFlow.interactionManager;
+	 			if(selMgr)
+	 				selMgr.setFocus();
+	 		}
+ 			
+ 		}
+ 		private function onBottomTabChanged(evt:IndexChangedEvent):void
+ 		{
+ 			var panel:Canvas = bottomTabs.getChildAt(evt.oldIndex) as Canvas;
+ 			panel.removeAllChildren();
+ 			panel = bottomTabs.getChildAt(evt.newIndex) as Canvas;
+ 			panel.addChild(bottomPanels[evt.newIndex]);
+ 		}
+ 		
+  		private var editingMode:String = EditingMode.READ_WRITE;
+ 		
+		private function keyListener(event:KeyboardEvent):void
+ 		{
+			if (event.keyCode == Keyboard.ESCAPE)
+				activeFlow.interactionManager.selectRange(-1,-1);
+ 		}
+ 		
+ 		private function updateEscapeKeyListener():void
+ 		{
+ 			for (var i:int = 0; i < activeFlow.flowComposer.numControllers; i++)
+ 			{
+ 				var controller:ContainerController = activeFlow.flowComposer.getControllerAt(i);
+ 				var container:DisplayObject = controller.container as DisplayObject;
+ 				if (activeFlow.interactionManager)
+ 					container.addEventListener(KeyboardEvent.KEY_DOWN, keyListener,false,0,true);
+ 				else 
+ 					container.removeEventListener(KeyboardEvent.KEY_DOWN, keyListener);
+ 			}
+ 		}		
+
+		public function setActiveFlow(newActiveFlow:TextFlow):void
+		{
+			TextInspectorController.Instance().activeFlow = newActiveFlow;
+			for (var i:int = bottomPanels.length - 1; i >= 0; --i)
+				bottomPanels[i].activeFlow = newActiveFlow;
+		}
+		
+ 		public function setInteractionManager(selectType:String):void
+ 		{
+			editingMode = selectType;
+			var uiActiveFlow:TextFlow = null;
+
+ 			if (activeFlow)	
+ 			{
+	 			switch (selectType)
+	 			{
+	 				case EditingMode.READ_ONLY:
+						if (activeFlow.interactionManager)
+							activeFlow.interactionManager = null;
+						break;
+					case EditingMode.READ_WRITE:
+						// either direction should work.
+						new EditManager(undoManager).textFlow = activeFlow;
+						activeFlow.interactionManager = new EditManager(undoManager);
+						
+						activeFlow.addEventListener(SelectionEvent.SELECTION_CHANGE,mySelectionChangeListener,false,0,true);
+						uiActiveFlow = activeFlow;
+						activeFlow.interactionManager.selectRange(0, 0);
+						break;
+					case EditingMode.READ_SELECT:
+						activeFlow.interactionManager = new SelectionManager();
+						activeFlow.addEventListener(SelectionEvent.SELECTION_CHANGE,mySelectionChangeListener,false,0,true);
+						break;
+				}
+				setActiveFlow(uiActiveFlow);
+				updateEscapeKeyListener();
+				updateForSelectedElementRange(new SelectionState( activeFlow, 0, 0));
+ 			}
+		}
+	
+	
+ 		private function mySelectionChangeListener(e:SelectionEvent):void
+ 		{
+  			updateForSelectedElementRange(e ? e.selectionState : null);
+ 		}
+ 		
+ 		/**
+ 		* Update the GUI for a particular selection range.
+ 		* @private
+ 		* @param range may be null
+ 		*/
+ 		private function updateForSelectedElementRange(selectionState:SelectionState):void
+ 		{
+ 			var range:ElementRange = selectionState ? ElementRange.createElementRange(selectionState.textFlow, selectionState.absoluteStart, selectionState.absoluteEnd) : null;
+ 			var selMgr:ISelectionManager = activeFlow.interactionManager;
+ 			
+			for (var i:int = bottomPanels.length - 1; i >= 0; --i)
+				bottomPanels[i].update(range);
+
+			if (selMgr && textPanel.visible)
+				selMgr.setFocus();
+ 		}
+ 		
+ 		/** handleResize - resize the child containers
+ 		  * @param alwaysResize - do the recalucation no matter if the size didn't change 
+ 		  */
+ 		public function handleResize():void
+		{
+			if (resizeOK && activeFlow)
+			{
+			 	vruler.RedrawRuler();
+		 		hruler.RedrawRuler();		
+			}
+		}
+		
+		public function detachActiveFlow(deleteTheComposer:Boolean):void
+		{
+			if (activeFlow && activeFlow.flowComposer != null)
+			{
+				// Detach the containers from the display list
+				for (var idx:int = 0; idx < activeFlow.flowComposer.numControllers; idx++)
+				{
+					var controller:ContainerController = activeFlow.flowComposer.getControllerAt(idx);
+					var oldContainer:DisplayObject = controller.container;
+					if (oldContainer && oldContainer.parent)
+					{
+						Canvas(oldContainer.parent).rawChildren.removeChild(oldContainer);
+					}
+				}
+				activeFlow.flowComposer.removeAllControllers();
+				
+				// also shuts down inline graphics - need another API if we want to do this another way
+				if (deleteTheComposer)
+					activeFlow.flowComposer = null;
+			}		
+		}
+		
+		private function recomposeOnLoadComplete(e:StatusChangeEvent):void
+		{
+			if (e.status == InlineGraphicElementStatus.ERROR)
+				trace("IOERROR loading inlinegraphicelement",e.errorEvent.toString());
+			if (e.element.getTextFlow() == activeFlow && e.status == InlineGraphicElementStatus.SIZE_PENDING)
+				activeFlow.flowComposer.updateAllControllers();
+		}
+		
+		public function changeContent(newFlow:TextFlow):void
+		{
+			// Remove old containers from the display list
+			if (undoManager != null) 
+				undoManager.clearAll();
+			if (activeFlow)
+			{
+				detachActiveFlow(true);
+				activeFlow.removeEventListener(StatusChangeEvent.INLINE_GRAPHIC_STATUS_CHANGE,recomposeOnLoadComplete);
+			}
+			
+			// set activeFlow (note: this variable is used in the mxml code below.)
+			activeFlow = newFlow;
+			if (!activeFlow)
+				return;
+				
+			activeFlow.addEventListener(StatusChangeEvent.INLINE_GRAPHIC_STATUS_CHANGE,recomposeOnLoadComplete,false,0,true);
+			
+			textPanel.changeContainerSetup(activeFlow);
+
+			activeFlow.interactionManager = new EditManager(undoManager);
+			activeFlow.addEventListener(SelectionEvent.SELECTION_CHANGE,mySelectionChangeListener,false,0,true);
+			setActiveFlow(activeFlow);
+			activeFlow.interactionManager.selectRange(0, 0);
+			updateEscapeKeyListener();
+			activeFlow.flowComposer.updateAllControllers();
+
+ 			vruler.RedrawRuler();
+ 			hruler.RedrawRuler();
+ 		}
+ 		
+		/** visiblePanels is an array of the labels of the right-side property panels that are opened.
+		 * if you set it, the panels specified will be opened and all others will be closed.
+		 */
+		public function set visiblePanels(inPanelNames:Array):void
+		{
+			var panels:Array = inspectorBox.getChildren();
+			for each(var panel:DisplayObject in panels)
+			{
+				if (panel is MultiPanel)
+				{
+					var mp:MultiPanel = panel as MultiPanel;
+					mp.opened = (inPanelNames.indexOf(mp.label) != -1);
+				}
+			}
+		}
+		
+		public function get visiblePanels():Array
+		{
+			var result:Array = [];
+			var panels:Array = inspectorBox.getChildren();
+			for each(var panel:DisplayObject in panels)
+			{
+				if (panel is MultiPanel)
+				{
+					var mp:MultiPanel = panel as MultiPanel;
+					if (mp.opened)
+						result.push(mp.label);
+				}
+			}
+			return result;
+		}
+		
+       ]]>
+    </Script>
+	
+	<mx:VBox
+		width="100%"
+		height="100%" 
+		verticalGap="2"
+		backgroundColor="0x607D8A"
+		fontFamily="Myriad Pro"
+		fontWeight="bold">
+		<mx:HBox
+			width="100%"
+			height="100%"
+			horizontalGap="4">
+			<txui:PanelWithEdgeBars
+				id="panelWithScrollBars"
+				width="100%"
+				height="100%"
+				edgeInset="18"
+				gap="1"
+				mainPanel="{textPanel}"
+				topBar="{horizontalRulerBar}"
+				rightBar="{verticalRulerBar}">
+				
+				<textEditBar:SingleContainerView id="textPanel"/>
+
+				<mx:Canvas
+					id="verticalRulerBar"
+					verticalScrollPolicy="off"
+					horizontalScrollPolicy="off">
+					<txrulers:RulerBar
+						id="vruler"
+						orientation="vertical"
+						syncToPanel="{textPanel}"
+						tabPropertyEditor="{tabPropEditor}"
+						tabPanelActive="{tabPanel.opened}">
+					</txrulers:RulerBar>
+				</mx:Canvas>
+				<mx:Canvas
+					id="horizontalRulerBar"
+					verticalScrollPolicy="off"
+					horizontalScrollPolicy="off">
+					<txrulers:RulerBar
+						id="hruler"
+						syncToPanel="{textPanel}"
+						tabPropertyEditor="{tabPropEditor}"
+						tabPanelActive="{tabPanel.opened}">
+					</txrulers:RulerBar>
+				</mx:Canvas>
+			</txui:PanelWithEdgeBars>
+			<mx:Canvas
+				width="270"
+				height="100%"
+				horizontalScrollPolicy="off"
+				backgroundColor="#D9D9D9"
+				verticalScrollBarStyleName="scrollbarStyle">
+				<mx:VBox id="inspectorBox" verticalGap="1" width="100%" backgroundColor="#D9D9D9">
+				    <txui:MultiPanel id="charPanel" styleName="multiPanel" label="CHARACTER" width="100%">
+				    	<txinsp:CharacterPropertyEditor active="{charPanel.opened}"/>
+				    </txui:MultiPanel>	
+				    <txui:MultiPanel id="parPanel" styleName="multiPanel" label="PARAGRAPH" width="100%">
+				    	<txinsp:ParagraphPropertyEditor active="{parPanel.opened}"/>
+				    </txui:MultiPanel>
+				    <txui:MultiPanel id="tabPanel" styleName="multiPanel" label="TAB" width="100%" opened="false">
+				    	<txinsp:TabPropertyEditor id="tabPropEditor"/>
+				    </txui:MultiPanel>
+				    <txui:MultiPanel id="advancedPanel" styleName="multiPanel" label="ADVANCED CHARACTER" width="100%" opened="false">
+				    	<txinsp:AdvancedTextPropertyEditor active="{advancedPanel.opened}"/>
+				    </txui:MultiPanel>
+				    <txui:MultiPanel id="antialiasPanel" styleName="multiPanel" label="ANTIALIAS" width="100%" opened="false">
+				    	<txinsp:AntiAliasPropertyEditor active="{antialiasPanel.opened}"/>
+				    </txui:MultiPanel>
+				    <txui:MultiPanel id="containerPanel" styleName="multiPanel" label="CONTAINER" width="100%" opened="false">
+				    	<txinsp:TextContainerPropertyEditor active="{containerPanel.opened}"/>
+				    </txui:MultiPanel>
+				    <txui:MultiPanel id="flowPanel" styleName="multiPanel" label="FLOW" width="100%" opened="false">
+				    	<txinsp:TextFlowPropertyEditor active="{flowPanel.opened}"/>
+				    </txui:MultiPanel>
+				</mx:VBox>
+			</mx:Canvas>
+		</mx:HBox>
+		<mx:TabNavigator id="bottomTabs" width="100%" creationPolicy="all" paddingLeft="8" backgroundColor="#D9D9D9" color="#202020">
+			<mx:Canvas label="SOURCE" width="100%" height="28">
+	 			<textEditBar:FileServices id="fileWidget" fileChoose="FileIOHelper.fileChoose(event.fileName)" textLayoutExport="FileIOHelper.textLayoutExport(activeFlow)" htmlExport="FileIOHelper.htmlExport(activeFlow)" includeInLayout="false" width="100%"/> 
+			</mx:Canvas>
+			<mx:Canvas label="LINKS" width="100%" height="100%">
+   				<textEditBar:LinkBar id="linkElementProps" creationPolicy="all" includeInLayout="false"/>  	
+			</mx:Canvas>
+			<mx:Canvas label="GRAPHICS" width="100%" height="100%">
+				<textEditBar:GraphicBar id="foreignElementProps" creationPolicy="all" includeInLayout="false"/>
+			</mx:Canvas>
+			
+		</mx:TabNavigator>
+	</mx:VBox>
+
+</mx:Canvas>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/47a67608/TourDeFlex/TourDeFlex3/src/spark/tlf/TextLayoutEditorSample.mxml
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/tlf/TextLayoutEditorSample.mxml b/TourDeFlex/TourDeFlex3/src/spark/tlf/TextLayoutEditorSample.mxml
new file mode 100644
index 0000000..efe13ca
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/tlf/TextLayoutEditorSample.mxml
@@ -0,0 +1,29 @@
+<?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="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:local="*" viewSourceURL="srcview/index.html">
+	<local:TextLayoutEditorCanvas width="100%" height="100%"/>
+	<Style source="/flashx/textLayout/ui/VellumGUIStyles.css"/>
+	<!--<Style source="VellumGUIStyles.css"/>-->
+</s:Application>
+ 

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/47a67608/TourDeFlex/TourDeFlex3/src/spark/tlf/assets/%scroll_arrow_down_over.png
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/tlf/assets/%scroll_arrow_down_over.png b/TourDeFlex/TourDeFlex3/src/spark/tlf/assets/%scroll_arrow_down_over.png
new file mode 100644
index 0000000..a209b46
Binary files /dev/null and b/TourDeFlex/TourDeFlex3/src/spark/tlf/assets/%scroll_arrow_down_over.png differ

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/47a67608/TourDeFlex/TourDeFlex3/src/spark/tlf/assets/%scroll_arrow_up_over.png
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/tlf/assets/%scroll_arrow_up_over.png b/TourDeFlex/TourDeFlex3/src/spark/tlf/assets/%scroll_arrow_up_over.png
new file mode 100644
index 0000000..5e37d0f
Binary files /dev/null and b/TourDeFlex/TourDeFlex3/src/spark/tlf/assets/%scroll_arrow_up_over.png differ

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/47a67608/TourDeFlex/TourDeFlex3/src/spark/tlf/assets/combo_drop_down_arrow.png
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/tlf/assets/combo_drop_down_arrow.png b/TourDeFlex/TourDeFlex3/src/spark/tlf/assets/combo_drop_down_arrow.png
new file mode 100644
index 0000000..1b905e8
Binary files /dev/null and b/TourDeFlex/TourDeFlex3/src/spark/tlf/assets/combo_drop_down_arrow.png differ

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/47a67608/TourDeFlex/TourDeFlex3/src/spark/tlf/assets/header_close_icon.png
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/tlf/assets/header_close_icon.png b/TourDeFlex/TourDeFlex3/src/spark/tlf/assets/header_close_icon.png
new file mode 100644
index 0000000..e55928c
Binary files /dev/null and b/TourDeFlex/TourDeFlex3/src/spark/tlf/assets/header_close_icon.png differ

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/47a67608/TourDeFlex/TourDeFlex3/src/spark/tlf/assets/header_open_icon.png
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/tlf/assets/header_open_icon.png b/TourDeFlex/TourDeFlex3/src/spark/tlf/assets/header_open_icon.png
new file mode 100644
index 0000000..d3a1b42
Binary files /dev/null and b/TourDeFlex/TourDeFlex3/src/spark/tlf/assets/header_open_icon.png differ

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/47a67608/TourDeFlex/TourDeFlex3/src/spark/tlf/assets/scroll_arrow_down.png
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/tlf/assets/scroll_arrow_down.png b/TourDeFlex/TourDeFlex3/src/spark/tlf/assets/scroll_arrow_down.png
new file mode 100644
index 0000000..f5d8145
Binary files /dev/null and b/TourDeFlex/TourDeFlex3/src/spark/tlf/assets/scroll_arrow_down.png differ

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/47a67608/TourDeFlex/TourDeFlex3/src/spark/tlf/assets/scroll_arrow_down_over.png
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/tlf/assets/scroll_arrow_down_over.png b/TourDeFlex/TourDeFlex3/src/spark/tlf/assets/scroll_arrow_down_over.png
new file mode 100644
index 0000000..ef66ac6
Binary files /dev/null and b/TourDeFlex/TourDeFlex3/src/spark/tlf/assets/scroll_arrow_down_over.png differ

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/47a67608/TourDeFlex/TourDeFlex3/src/spark/tlf/assets/scroll_arrow_up.png
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/tlf/assets/scroll_arrow_up.png b/TourDeFlex/TourDeFlex3/src/spark/tlf/assets/scroll_arrow_up.png
new file mode 100644
index 0000000..1d3828d
Binary files /dev/null and b/TourDeFlex/TourDeFlex3/src/spark/tlf/assets/scroll_arrow_up.png differ

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/47a67608/TourDeFlex/TourDeFlex3/src/spark/tlf/assets/scroll_arrow_up_over.png
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/tlf/assets/scroll_arrow_up_over.png b/TourDeFlex/TourDeFlex3/src/spark/tlf/assets/scroll_arrow_up_over.png
new file mode 100644
index 0000000..2147d32
Binary files /dev/null and b/TourDeFlex/TourDeFlex3/src/spark/tlf/assets/scroll_arrow_up_over.png differ

http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/47a67608/TourDeFlex/TourDeFlex3/src/spark/tlf/flashx/textLayout/UiClasses.as
----------------------------------------------------------------------
diff --git a/TourDeFlex/TourDeFlex3/src/spark/tlf/flashx/textLayout/UiClasses.as b/TourDeFlex/TourDeFlex3/src/spark/tlf/flashx/textLayout/UiClasses.as
new file mode 100644
index 0000000..712e83a
--- /dev/null
+++ b/TourDeFlex/TourDeFlex3/src/spark/tlf/flashx/textLayout/UiClasses.as
@@ -0,0 +1,54 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+//  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 flashx.textLayout
+{
+	internal class UiClasses
+	{
+		import flashx.textLayout.ui.inspectors.DynamicTextPropertyEditor; DynamicTextPropertyEditor;
+		import flashx.textLayout.ui.inspectors.SelectionUpdateEvent; SelectionUpdateEvent;
+		import flashx.textLayout.ui.inspectors.TextInspectorController; TextInspectorController;
+		import flashx.textLayout.ui.inspectors.CharacterPropertyEditor; CharacterPropertyEditor;
+		import flashx.textLayout.ui.inspectors.LinkPropertyEditor; LinkPropertyEditor;
+		import flashx.textLayout.ui.inspectors.TabPropertyEditor; TabPropertyEditor;
+		import flashx.textLayout.ui.inspectors.AdvancedTextPropertyEditor; AdvancedTextPropertyEditor;
+		import flashx.textLayout.ui.inspectors.AntiAliasPropertyEditor; AntiAliasPropertyEditor;
+		import flashx.textLayout.ui.inspectors.TextContainerPropertyEditor; TextContainerPropertyEditor;
+		import flashx.textLayout.ui.inspectors.TextFlowPropertyEditor; TextFlowPropertyEditor;
+		import flashx.textLayout.ui.inspectors.ParagraphPropertyEditor; ParagraphPropertyEditor;
+		
+		import flashx.textLayout.ui.styles.ScrollbarThumbOverSkin; ScrollbarThumbOverSkin;
+		import flashx.textLayout.ui.styles.ScrollbarTrackSkin; ScrollbarTrackSkin;
+		import flashx.textLayout.ui.styles.ScrollbarThumbUpSkin; ScrollbarThumbUpSkin;
+		import flashx.textLayout.ui.styles.ScrollbarDownArrowUpSkin; ScrollbarDownArrowUpSkin;
+		import flashx.textLayout.ui.styles.ScrollbarUpArrowUpSkin; ScrollbarUpArrowUpSkin;
+		import flashx.textLayout.ui.styles.PopupMenuSkin; PopupMenuSkin;
+		
+		import flashx.textLayout.ui.rulers.RulerBar; RulerBar;
+		import flashx.textLayout.ui.rulers.RulerDragTracker; RulerDragTracker;
+		import flashx.textLayout.ui.rulers.RulerMarker; RulerMarker;
+		import flashx.textLayout.ui.rulers.TabMarker; TabMarker;
+		import flashx.textLayout.ui.rulers.TabMarkerSkin; TabMarkerSkin;
+		import flashx.textLayout.ui.rulers.ParagraphPropertyMarker; ParagraphPropertyMarker;
+		import flashx.textLayout.ui.rulers.ParagraphPropertyMarkerSkin; ParagraphPropertyMarkerSkin;
+		
+		import flashx.textLayout.ui.MultiPanel; MultiPanel;
+		import flashx.textLayout.ui.MultiPanelHeaderSkin; MultiPanelHeaderSkin;
+		import flashx.textLayout.ui.PanelWithEdgeBars; PanelWithEdgeBars;
+	}
+}