Modified: flex/site/trunk/content/tourdeflex/spark/events/EventExample5.mxml
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/events/EventExample5.mxml?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
--- flex/site/trunk/content/tourdeflex/spark/events/EventExample5.mxml 
(original)
+++ flex/site/trunk/content/tourdeflex/spark/events/EventExample5.mxml Sat Nov 
29 07:19:59 2014
@@ -20,8 +20,7 @@
 <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="*"
-                          skinClass="TDFGradientBackgroundSkin">
+                          xmlns:local="*">
        
        <fx:Script>
                <![CDATA[
@@ -29,20 +28,13 @@
                ]]>
        </fx:Script>
        
-       <s:layout>
-               <s:HorizontalLayout verticalAlign="middle" 
horizontalAlign="center" />
-       </s:layout>
-       
-       <fx:Declarations>
-               
+       <fx:Declarations>       
                <!-- Dispatching an Event -->
                <local:FiveSecondTrigger triggered="Alert.show('five second 
event triggered')"/>
        </fx:Declarations>
        
        <s:Panel title="Dispatching Events Sample"
-                        width="600" height="100%"
-                        color="0x000000" 
-                        borderAlpha="0.15">
+                        width="100%" height="100%">
                
                <s:layout>
                        <s:VerticalLayout horizontalAlign="center" 

Modified: flex/site/trunk/content/tourdeflex/spark/events/EventExample5.swf
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/events/EventExample5.swf?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
Binary files - no diff available.

Modified: flex/site/trunk/content/tourdeflex/spark/events/EventExample6.mxml
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/events/EventExample6.mxml?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
--- flex/site/trunk/content/tourdeflex/spark/events/EventExample6.mxml 
(original)
+++ flex/site/trunk/content/tourdeflex/spark/events/EventExample6.mxml Sat Nov 
29 07:19:59 2014
@@ -19,23 +19,16 @@
 -->
 <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" 
-                          skinClass="TDFGradientBackgroundSkin">
+                          xmlns:mx="library://ns.adobe.com/flex/mx">
        
        <fx:Script>
                <![CDATA[
                        import mx.controls.Alert;
                ]]>
        </fx:Script>
-       
-       <s:layout>
-               <s:HorizontalLayout verticalAlign="middle" 
horizontalAlign="center" />
-       </s:layout>
-       
+
        <s:Panel title="Dispatching Custom Events Sample"
-                        width="600" height="100%"
-                        color="0x000000" 
-                        borderAlpha="0.15">
+                        width="100%" height="100%">
                
                <s:layout>
                        <s:VerticalLayout horizontalAlign="center" 

Modified: flex/site/trunk/content/tourdeflex/spark/events/EventExample6.swf
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/events/EventExample6.swf?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
Binary files - no diff available.

Modified: 
flex/site/trunk/content/tourdeflex/spark/formatters/CurrencyFormatterExample.mxml
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/formatters/CurrencyFormatterExample.mxml?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
--- 
flex/site/trunk/content/tourdeflex/spark/formatters/CurrencyFormatterExample.mxml
 (original)
+++ 
flex/site/trunk/content/tourdeflex/spark/formatters/CurrencyFormatterExample.mxml
 Sat Nov 29 07:19:59 2014
@@ -19,8 +19,7 @@
 -->
 <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" 
-                          skinClass="TDFGradientBackgroundSkin">
+                          xmlns:mx="library://ns.adobe.com/flex/mx">
        
        <fx:Script>
                <![CDATA[
@@ -44,11 +43,7 @@
                        }
                ]]>
        </fx:Script>
-       
-       <s:layout>
-               <s:HorizontalLayout verticalAlign="middle" 
horizontalAlign="center" />
-       </s:layout>
-       
+
        <fx:Declarations>
                <mx:CurrencyFormatter id="usdFormatter" precision="2" 
currencySymbol="$" decimalSeparatorFrom="."  rounding="nearest"
                                                          
decimalSeparatorTo="." useNegativeSign="true" useThousandsSeparator="true" 
alignSymbol="left"/>
@@ -57,17 +52,13 @@
        </fx:Declarations>
        
        
-       <s:Panel title="CurrencyFormatter Example" width="600" height="100%"
-                        color="0x000000" 
-                        borderAlpha="0.15">
+       <s:Panel title="CurrencyFormatter Example" width="100%" height="100%">
                
                <s:layout>
-                       <s:HorizontalLayout horizontalAlign="center" 
-                                                               
paddingLeft="10" paddingRight="10" 
-                                                               paddingTop="10" 
paddingBottom="10"/>
+                       <s:HorizontalLayout paddingLeft="10" paddingRight="10" 
paddingTop="10" paddingBottom="10"/>
                </s:layout>
                
-               <mx:Form color="0x323232">
+               <mx:Form>
                        <mx:FormItem label="Enter dollar amount:">
                                <s:TextInput id="priceUS" text="" width="50%"/>
                        </mx:FormItem>
@@ -77,7 +68,7 @@
                        </mx:FormItem>
                        
                        <mx:FormItem>
-                               <s:Button label="Validate and Format" 
click="Format();"/>
+                               <s:Button label="Validate and Format" 
click="Format()"/>
                        </mx:FormItem>
                </mx:Form>
                

Modified: 
flex/site/trunk/content/tourdeflex/spark/formatters/CurrencyFormatterExample.swf
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/formatters/CurrencyFormatterExample.swf?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
Binary files - no diff available.

Modified: 
flex/site/trunk/content/tourdeflex/spark/formatters/DateFormatterExample.mxml
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/formatters/DateFormatterExample.mxml?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
--- 
flex/site/trunk/content/tourdeflex/spark/formatters/DateFormatterExample.mxml 
(original)
+++ 
flex/site/trunk/content/tourdeflex/spark/formatters/DateFormatterExample.mxml 
Sat Nov 29 07:19:59 2014
@@ -19,8 +19,7 @@
 -->
 <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" 
-                          skinClass="TDFGradientBackgroundSkin">
+                          xmlns:mx="library://ns.adobe.com/flex/mx">
        
        <fx:Script>
         <![CDATA[
@@ -43,28 +42,19 @@
         ]]>
     </fx:Script>
        
-       <s:layout>
-               <s:HorizontalLayout verticalAlign="middle" 
horizontalAlign="center" />
-       </s:layout>
-    
        <fx:Declarations>
                <mx:DateFormatter id="dateFormatter" formatString="month: MM, 
day: DD, year: YYYY"/>
                
                <mx:DateValidator id="dateVal" source="{dob}" property="text" 
inputFormat="mm/dd/yyyy"/>
        </fx:Declarations>
     
-    
-       <s:Panel title="DateFormatter Example" width="600" height="100%"
-                        color="0x000000" 
-                        borderAlpha="0.15">
+       <s:Panel title="DateFormatter Example" width="100%" height="100%">
                
                <s:layout>
-                       <s:HorizontalLayout horizontalAlign="center" 
-                                                               
paddingLeft="10" paddingRight="10" 
-                                                               paddingTop="10" 
paddingBottom="10"/>
+                       <s:HorizontalLayout paddingLeft="10" paddingRight="10" 
paddingTop="10" paddingBottom="10"/>
                </s:layout>
          
-         <mx:Form width="100%" color="0x323232">
+         <mx:Form width="100%">
             <mx:FormItem label="Enter date (mm/dd/yyyy):" width="100%">
                 <s:TextInput id="dob" text=""/>
             </mx:FormItem>
@@ -74,7 +64,7 @@
             </mx:FormItem>
 
             <mx:FormItem>
-                <s:Button label="Validate and Format" click="Format();"/>
+                <s:Button label="Validate and Format" click="Format()"/>
             </mx:FormItem>
         </mx:Form>
         

Modified: 
flex/site/trunk/content/tourdeflex/spark/formatters/DateFormatterExample.swf
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/formatters/DateFormatterExample.swf?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
Binary files - no diff available.

Modified: 
flex/site/trunk/content/tourdeflex/spark/formatters/NumberFormatterExample.mxml
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/formatters/NumberFormatterExample.mxml?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
--- 
flex/site/trunk/content/tourdeflex/spark/formatters/NumberFormatterExample.mxml 
(original)
+++ 
flex/site/trunk/content/tourdeflex/spark/formatters/NumberFormatterExample.mxml 
Sat Nov 29 07:19:59 2014
@@ -19,8 +19,7 @@
 -->
 <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" 
-                          skinClass="TDFGradientBackgroundSkin">
+                          xmlns:mx="library://ns.adobe.com/flex/mx">
        
        <fx:Script>
                <![CDATA[
@@ -44,26 +43,18 @@
                        }
                ]]>
        </fx:Script>
-       
-       <s:layout>
-               <s:HorizontalLayout verticalAlign="middle" 
horizontalAlign="center" />
-       </s:layout>
-       
+
        <fx:Declarations>
                <mx:NumberFormatter id="numberFormatter" />
        </fx:Declarations>
        
-       <s:Panel title="Formatter Example" width="600" height="100%"
-                        color="0x000000" 
-                        borderAlpha="0.15">
+       <s:Panel title="Formatter Example" width="100%" height="100%">
                
                <s:layout>
-                       <s:HorizontalLayout horizontalAlign="center" 
-                                                               
paddingLeft="10" paddingRight="10" 
-                                                               paddingTop="10" 
paddingBottom="10"/>
+                       <s:HorizontalLayout paddingLeft="10" paddingRight="10" 
paddingTop="10" paddingBottom="10"/>
                </s:layout>
                
-               <mx:Form color="0x323232">
+               <mx:Form>
                        <mx:FormItem label="Enter number - a letter is 
invalid:">
                                <s:TextInput id="inputVal" text="" width="75%"/>
                        </mx:FormItem>
@@ -73,7 +64,7 @@
                        </mx:FormItem>
                        
                        <mx:FormItem>
-                               <s:Button label="Validate and Format" 
click="Format();"/>
+                               <s:Button label="Validate and Format" 
click="Format()"/>
                        </mx:FormItem>
                </mx:Form>
                

Modified: 
flex/site/trunk/content/tourdeflex/spark/formatters/NumberFormatterExample.swf
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/formatters/NumberFormatterExample.swf?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
Binary files - no diff available.

Modified: 
flex/site/trunk/content/tourdeflex/spark/formatters/PhoneFormatterExample.mxml
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/formatters/PhoneFormatterExample.mxml?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
--- 
flex/site/trunk/content/tourdeflex/spark/formatters/PhoneFormatterExample.mxml 
(original)
+++ 
flex/site/trunk/content/tourdeflex/spark/formatters/PhoneFormatterExample.mxml 
Sat Nov 29 07:19:59 2014
@@ -19,8 +19,7 @@
 -->
 <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" 
-                          skinClass="TDFGradientBackgroundSkin">
+                          xmlns:mx="library://ns.adobe.com/flex/mx">
        
        <fx:Script>
                <![CDATA[
@@ -42,28 +41,20 @@
                        }
                ]]>
        </fx:Script>
-       
-       <s:layout>
-               <s:HorizontalLayout verticalAlign="middle" 
horizontalAlign="center" />
-       </s:layout>
-       
+
        <fx:Declarations>
                <mx:PhoneFormatter id="phoneFormatter" formatString="(###) 
###-####" validPatternChars="#-() "/>
                
                <mx:PhoneNumberValidator id="pnVal" source="{phone}" 
property="text" allowedFormatChars=""/>
        </fx:Declarations>
        
-       <s:Panel title="PhoneNumberValidator Example" width="600" height="100%"
-                        color="0x000000" 
-                        borderAlpha="0.15">
+       <s:Panel title="PhoneNumberValidator Example" width="100%" 
height="100%">
                
                <s:layout>
-                       <s:HorizontalLayout horizontalAlign="center" 
-                                                               
paddingLeft="10" paddingRight="10" 
-                                                               paddingTop="10" 
paddingBottom="10"/>
+                       <s:HorizontalLayout paddingLeft="10" paddingRight="10" 
paddingTop="10" paddingBottom="10"/>
                </s:layout>
                
-               <mx:Form color="0x323232">
+               <mx:Form>
                        <mx:FormItem label="Enter a 10-digit phone number:">
                                <s:TextInput id="phone" text="" width="75%"/>
                        </mx:FormItem>
@@ -73,7 +64,7 @@
                        </mx:FormItem>
                        
                        <mx:FormItem>
-                               <s:Button label="Validate and Format" 
click="Format();"/>
+                               <s:Button label="Validate and Format" 
click="Format()"/>
                        </mx:FormItem>
                </mx:Form>
                

Modified: 
flex/site/trunk/content/tourdeflex/spark/formatters/PhoneFormatterExample.swf
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/formatters/PhoneFormatterExample.swf?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
Binary files - no diff available.

Modified: 
flex/site/trunk/content/tourdeflex/spark/formatters/SwitchFormatterExample.mxml
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/formatters/SwitchFormatterExample.mxml?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
--- 
flex/site/trunk/content/tourdeflex/spark/formatters/SwitchFormatterExample.mxml 
(original)
+++ 
flex/site/trunk/content/tourdeflex/spark/formatters/SwitchFormatterExample.mxml 
Sat Nov 29 07:19:59 2014
@@ -19,8 +19,7 @@
 -->
 <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" 
-                          skinClass="TDFGradientBackgroundSkin">
+                          xmlns:mx="library://ns.adobe.com/flex/mx">
        
        <fx:Script>
         <![CDATA[
@@ -48,31 +47,23 @@
             }
         ]]>
     </fx:Script>
-       
-       <s:layout>
-               <s:HorizontalLayout verticalAlign="middle" 
horizontalAlign="center" />
-       </s:layout>
     
        <fx:Declarations>
                <mx:SocialSecurityValidator id="scVal" source="{scNum}" 
property="text"/>
        </fx:Declarations>
    
         
-       <s:Panel title="SwitchSymbolFormatter Example" width="600" height="100%"
-                        color="0x000000" 
-                        borderAlpha="0.15">
+       <s:Panel title="SwitchSymbolFormatter Example" width="100%" 
height="100%">
                
                <s:layout>
-                       <s:HorizontalLayout horizontalAlign="center" 
-                                                               
paddingLeft="10" paddingRight="10" 
-                                                               paddingTop="10" 
paddingBottom="10"/>
+                       <s:HorizontalLayout paddingLeft="10" paddingRight="10" 
paddingTop="10" paddingBottom="10"/>
                </s:layout>
          
-         <mx:Form color="0x323232" width="100%">
+         <mx:Form width="100%">
                <s:Label text="Enter a 9 digit Social Security number with no 
separator characters:" />
                
                <s:TextInput id="scNum" text="" width="50%" maxChars="9"/>
-            <s:Button label="Validate and Format" click="Format();"/>
+            <s:Button label="Validate and Format" click="Format()"/>
                        
             <mx:FormItem label="formatted Social Security number:">
                 <s:Label id="formattedSCNumber" text="" />

Modified: 
flex/site/trunk/content/tourdeflex/spark/formatters/SwitchFormatterExample.swf
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/formatters/SwitchFormatterExample.swf?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
Binary files - no diff available.

Modified: 
flex/site/trunk/content/tourdeflex/spark/formatters/ZipCodeFormatterExample.mxml
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/formatters/ZipCodeFormatterExample.mxml?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
--- 
flex/site/trunk/content/tourdeflex/spark/formatters/ZipCodeFormatterExample.mxml
 (original)
+++ 
flex/site/trunk/content/tourdeflex/spark/formatters/ZipCodeFormatterExample.mxml
 Sat Nov 29 07:19:59 2014
@@ -19,8 +19,7 @@
 -->
 <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" 
-                          skinClass="TDFGradientBackgroundSkin">
+                          xmlns:mx="library://ns.adobe.com/flex/mx">
        
        <fx:Script>
         <![CDATA[
@@ -44,27 +43,19 @@
         ]]>      
     </fx:Script>
        
-       <s:layout>
-               <s:HorizontalLayout verticalAlign="middle" 
horizontalAlign="center" />
-       </s:layout>
-       
        <fx:Declarations>
                <mx:ZipCodeFormatter id="zipFormatter" 
formatString="#####-####"/>
 
     <mx:ZipCodeValidator id="zcVal" source="{zip}" property="text" 
allowedFormatChars=""/>
        </fx:Declarations>
     
-       <s:Panel title="ZipCodeFormatter Example" width="600" height="100%"
-                        color="0x000000" 
-                        borderAlpha="0.15">
+       <s:Panel title="ZipCodeFormatter Example" width="100%" height="100%">
                
                <s:layout>
-                       <s:HorizontalLayout horizontalAlign="center" 
-                                                               
paddingLeft="10" paddingRight="10" 
-                                                               paddingTop="10" 
paddingBottom="10"/>
+                       <s:HorizontalLayout paddingLeft="10" paddingRight="10" 
paddingTop="10" paddingBottom="10"/>
                </s:layout>
          
-         <mx:Form width="100%" color="0x323232">
+         <mx:Form width="100%">
             <mx:FormItem label="Enter a 5 or 9 digit U.S. ZIP code:" 
width="100%">
                 <s:TextInput id="zip" text=""/>
             </mx:FormItem>
@@ -74,7 +65,7 @@
             </mx:FormItem>
 
             <mx:FormItem>
-                <s:Button label="Validate and Format" click="Format();"/>
+                <s:Button label="Validate and Format" click="Format()"/>
             </mx:FormItem>
         </mx:Form>
         

Modified: 
flex/site/trunk/content/tourdeflex/spark/formatters/ZipCodeFormatterExample.swf
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/formatters/ZipCodeFormatterExample.swf?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
Binary files - no diff available.

Modified: flex/site/trunk/content/tourdeflex/spark/fxg/BitmapImageExample.mxml
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/fxg/BitmapImageExample.mxml?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
--- flex/site/trunk/content/tourdeflex/spark/fxg/BitmapImageExample.mxml 
(original)
+++ flex/site/trunk/content/tourdeflex/spark/fxg/BitmapImageExample.mxml Sat 
Nov 29 07:19:59 2014
@@ -18,13 +18,10 @@
 
 -->
 <!-- BitmapGraphicExample.mxml -->
-<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"; 
xmlns:s="library://ns.adobe.com/flex/spark" 
-                          width="694" height="277">
-           <s:Panel title="BitmapImage Sample"
-            width="100%" height="100%"
-            horizontalCenter="0" verticalCenter="0" 
skinClass="skins.TDFPanelSkin">
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"; 
xmlns:s="library://ns.adobe.com/flex/spark">
+       <s:Panel title="BitmapImage Sample" width="100%" height="100%">
                <s:layout>
-                       <s:HorizontalLayout paddingLeft="15" paddingRight="15" 
paddingTop="15" paddingBottom="15"/>
+                       <s:HorizontalLayout paddingLeft="10" paddingRight="10" 
paddingTop="10" paddingBottom="10"/>
                </s:layout>
                <s:VGroup>
                        <s:ComboBox id="fillModes" selectedItem="repeat">
@@ -66,7 +63,7 @@
         </s:Graphic>
 
         
-               <s:Label color="0x323232" width="200" text="A BitmapImage 
element defines a rectangular region in its parent element's coordinate space, 
filled with bitmap data drawn from a source file."/>
+               <s:Label width="200" text="A BitmapImage element defines a 
rectangular region in its parent element's coordinate space, filled with bitmap 
data drawn from a source file."/>
     </s:Panel>
 
 </s:Application>

Modified: flex/site/trunk/content/tourdeflex/spark/fxg/BitmapImageExample.swf
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/fxg/BitmapImageExample.swf?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
Binary files - no diff available.

Modified: 
flex/site/trunk/content/tourdeflex/spark/fxg/DropShadowGraphicExample.mxml
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/fxg/DropShadowGraphicExample.mxml?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
--- flex/site/trunk/content/tourdeflex/spark/fxg/DropShadowGraphicExample.mxml 
(original)
+++ flex/site/trunk/content/tourdeflex/spark/fxg/DropShadowGraphicExample.mxml 
Sat Nov 29 07:19:59 2014
@@ -23,7 +23,7 @@
        
        <s:Panel width="100%" height="100%"
                         title="DropShadows with MXML Graphics Example"
-                        skinClass="skins.TDFPanelSkin" x="0">
+                        x="0">
                          
            <s:Group horizontalCenter="0" y="5" width="117">
                        <s:Graphic id="ellipse1">
@@ -54,7 +54,7 @@
                        </s:Graphic>
                        
                </s:Group>
-           <s:Label width="250" verticalAlign="justify" color="#323232" x="10" 
y="30" 
+           <s:Label width="250" verticalAlign="justify" x="10" y="30" 
                                  text="The DropShadowFilter class lets you add 
a drop shadow to display
 objects. The shadow algorithm is based on the same box filter that the blur 
filter uses. You have 
 several options for the style of the drop shadow, including inner or outer 
shadow and knockout mode. 

Modified: 
flex/site/trunk/content/tourdeflex/spark/fxg/DropShadowGraphicExample.swf
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/fxg/DropShadowGraphicExample.swf?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
Binary files - no diff available.

Modified: flex/site/trunk/content/tourdeflex/spark/fxg/EclipseExample.mxml
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/fxg/EclipseExample.mxml?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
--- flex/site/trunk/content/tourdeflex/spark/fxg/EclipseExample.mxml (original)
+++ flex/site/trunk/content/tourdeflex/spark/fxg/EclipseExample.mxml Sat Nov 29 
07:19:59 2014
@@ -21,7 +21,7 @@
                           xmlns:s="library://ns.adobe.com/flex/spark" 
                           xmlns:mx="library://ns.adobe.com/flex/mx">
        
-       <s:Panel title="Ellipse Graphic Sample" skinClass="skins.TDFPanelSkin"
+       <s:Panel title="Ellipse Graphic Sample" 
                         width="100%" height="100%">
                
                <s:Graphic horizontalCenter="0" verticalCenter="0">
@@ -40,7 +40,7 @@
                                </s:fill>
                        </s:Ellipse>
                </s:Graphic>
-               <s:Label right="25" top="10" width="270" color="0x323232" 
text="The Ellipse class is a filled graphic element that draws an ellipse. 
Graphic
+               <s:Label right="25" top="10" width="270" text="The Ellipse 
class is a filled graphic element that draws an ellipse. Graphic
 objects are placed in a Graphic tag which defines the root of an FXG 
document."/>
        </s:Panel>
 </s:Application>

Modified: flex/site/trunk/content/tourdeflex/spark/fxg/EclipseExample.swf
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/fxg/EclipseExample.swf?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
Binary files - no diff available.

Modified: 
flex/site/trunk/content/tourdeflex/spark/fxg/EllipseTransformExample.mxml
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/fxg/EllipseTransformExample.mxml?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
--- flex/site/trunk/content/tourdeflex/spark/fxg/EllipseTransformExample.mxml 
(original)
+++ flex/site/trunk/content/tourdeflex/spark/fxg/EllipseTransformExample.mxml 
Sat Nov 29 07:19:59 2014
@@ -42,16 +42,22 @@
                                  b="0.34202014332"
                                  c="0.34202014332"
                                  d="0.939692620786"
-                                 tx="100"
-                                 ty="310"
+                                 tx="50"
+                                 ty="210"
                                  />
        </fx:Declarations>
        
-       <s:Label text="An Ellipse Using a Transform for Rotation" 
fontWeight="bold" fontSize="14" horizontalCenter="0"
-                                 y="20" />
-       
-       <s:Label id="descriptionText" horizontalCenter="0" y="45" width="300"/>
-       <s:Ellipse id="ellipse1" width="60" height="70" horizontalCenter="0" 
y="90">
+       <s:Panel title="Ellipse Transform Sample" width="100%" height="100%">
+               <s:layout>
+                       <s:VerticalLayout paddingLeft="10" paddingRight="10" 
paddingTop="10" paddingBottom="10"/>
+               </s:layout>
+                       
+               <s:Label text="An Ellipse Using a Transform for Rotation" />
+               
+               <s:Label id="descriptionText" width="300"/>
+               <s:Button label="Apply Transform" click="addMatrix()" x="40" 
y="330" />
+       </s:Panel>
+       <s:Ellipse id="ellipse1" width="60" height="70" x="40" y="120">
                <s:fill>
                        <s:LinearGradient>
                                <s:GradientEntry color="#00FF00" alpha="1" 
ratio="0"/>
@@ -62,5 +68,4 @@
                        <s:SolidColorStroke color="0x666666" weight="1"/>
                </s:stroke>
        </s:Ellipse>
-       <s:Button label="Apply Transform" click="addMatrix()" x="40" y="330" />
 </s:Application>

Modified: 
flex/site/trunk/content/tourdeflex/spark/fxg/EllipseTransformExample.swf
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/fxg/EllipseTransformExample.swf?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
Binary files - no diff available.

Modified: flex/site/trunk/content/tourdeflex/spark/fxg/LineExample.mxml
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/fxg/LineExample.mxml?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
--- flex/site/trunk/content/tourdeflex/spark/fxg/LineExample.mxml (original)
+++ flex/site/trunk/content/tourdeflex/spark/fxg/LineExample.mxml Sat Nov 29 
07:19:59 2014
@@ -22,7 +22,7 @@
                           xmlns:mx="library://ns.adobe.com/flex/mx">
        
        
-       <s:Panel title="Line Graphic Sample" width="100%" height="100%" 
skinClass="skins.TDFPanelSkin">
+       <s:Panel title="Line Graphic Sample" width="100%" height="100%" >
                <s:Group left="133" top="100">
                        
                        <s:Line xFrom="0" xTo="0" yFrom="0" yTo="100">
@@ -90,7 +90,7 @@
                                </s:stroke>
                        </s:Line>
                </s:Group>
-               <s:Label color="0x323232" right="20" top="15" width="250" 
text="The Line class is a graphic element that draws a line between two points.
+               <s:Label right="20" top="15" width="250" text="The Line class 
is a graphic element that draws a line between two points.
 The default stroke for a line is undefined; therefore, if you do not specify 
the stroke, the line is invisible."/>
        </s:Panel>
 </s:Application>

Modified: flex/site/trunk/content/tourdeflex/spark/fxg/LineExample.swf
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/fxg/LineExample.swf?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
Binary files - no diff available.

Modified: 
flex/site/trunk/content/tourdeflex/spark/fxg/LinearGradientsSpreadMethodExample.mxml
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/fxg/LinearGradientsSpreadMethodExample.mxml?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
--- 
flex/site/trunk/content/tourdeflex/spark/fxg/LinearGradientsSpreadMethodExample.mxml
 (original)
+++ 
flex/site/trunk/content/tourdeflex/spark/fxg/LinearGradientsSpreadMethodExample.mxml
 Sat Nov 29 07:19:59 2014
@@ -28,10 +28,10 @@
        
        <s:Panel title="LinearGradient Control" 
                          width="100%" height="100%"
-                        skinClass="skins.TDFPanelSkin">
+                        >
                
                <s:HGroup horizontalCenter="0" top="10">
-               <s:Label verticalAlign="justify" color="#323232" x="10" y="30" 
width="200"
+               <s:Label verticalAlign="justify" x="10" y="30" width="200"
                                          text="The LinearGradient class lets 
you specify the fill of a graphical element, where a gradient specifies a 
gradual color transition in the fill color. You add a series of GradientEntry 
objects to the LinearGradient object's entries Array to define the colors that 
make up the gradient fill."/>      
                <s:Rect id="rect1" height="150" width="160" >
                        <s:fill>

Modified: 
flex/site/trunk/content/tourdeflex/spark/fxg/LinearGradientsSpreadMethodExample.swf
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/fxg/LinearGradientsSpreadMethodExample.swf?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
Binary files - no diff available.

Modified: flex/site/trunk/content/tourdeflex/spark/fxg/RectExample.mxml
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/fxg/RectExample.mxml?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
--- flex/site/trunk/content/tourdeflex/spark/fxg/RectExample.mxml (original)
+++ flex/site/trunk/content/tourdeflex/spark/fxg/RectExample.mxml Sat Nov 29 
07:19:59 2014
@@ -20,13 +20,8 @@
 <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 skins.TDFPanelSkin;
-               ]]>
-       </fx:Script>
        
-       <s:Panel title="Rect Graphic Sample" skinClass="skins.TDFPanelSkin"
+       <s:Panel title="Rect Graphic Sample" 
                         width="100%" height="100%">
                
                         

Modified: flex/site/trunk/content/tourdeflex/spark/fxg/RectExample.swf
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/fxg/RectExample.swf?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
Binary files - no diff available.

Modified: flex/site/trunk/content/tourdeflex/spark/fxg/RichTextExample.mxml
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/fxg/RichTextExample.mxml?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
--- flex/site/trunk/content/tourdeflex/spark/fxg/RichTextExample.mxml (original)
+++ flex/site/trunk/content/tourdeflex/spark/fxg/RichTextExample.mxml Sat Nov 
29 07:19:59 2014
@@ -21,7 +21,7 @@
                           xmlns:s="library://ns.adobe.com/flex/spark" 
                           xmlns:mx="library://ns.adobe.com/flex/mx">
        
-       <s:Panel title="RichText Sample" width="100%" height="100%" 
skinClass="skins.TDFPanelSkin">
+       <s:Panel title="RichText Sample" width="100%" height="100%" >
                <s:layout>
                        <s:HorizontalLayout paddingLeft="8" paddingRight="8" 
paddingTop="8"/>
                </s:layout>
@@ -36,7 +36,7 @@
                                </s:RichText>
                                <s:Rect width="100%" height="100%">
                                        <s:stroke>
-                                               <s:SolidColorStroke 
color="blue"/>
+                                               <s:SolidColorStroke/>
                                        </s:stroke>
                                </s:Rect>
                        </s:Group>
@@ -47,12 +47,12 @@
                                </s:RichText>
                                <s:Rect width="100%" height="100%">
                                        <s:stroke>
-                                               <s:SolidColorStroke 
color="blue"/>
+                                               <s:SolidColorStroke/>
                                        </s:stroke>
                                </s:Rect>
                        </s:Group>
                </s:Group>
-               <s:Label width="270" color="0x323232" text="RichText is a 
low-level UIComponent that can display one or more lines of richly-formatted 
text and embedded images. For performance reasons, it does not support 
scrolling, selection, editing, clickable hyperlinks, or images loaded from 
URLs. If you need those capabilities, see the RichEditableText class."/>
+               <s:Label width="270" text="RichText is a low-level UIComponent 
that can display one or more lines of richly-formatted text and embedded 
images. For performance reasons, it does not support scrolling, selection, 
editing, clickable hyperlinks, or images loaded from URLs. If you need those 
capabilities, see the RichEditableText class."/>
        </s:Panel>
 
 </s:Application>

Modified: flex/site/trunk/content/tourdeflex/spark/fxg/RichTextExample.swf
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/fxg/RichTextExample.swf?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
Binary files - no diff available.

Modified: flex/site/trunk/content/tourdeflex/spark/fxg/StaticFXGExample.mxml
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/fxg/StaticFXGExample.mxml?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
--- flex/site/trunk/content/tourdeflex/spark/fxg/StaticFXGExample.mxml 
(original)
+++ flex/site/trunk/content/tourdeflex/spark/fxg/StaticFXGExample.mxml Sat Nov 
29 07:19:59 2014
@@ -23,16 +23,16 @@
                xmlns:fxg="*">
        
        
-       <s:Panel width="100%" height="100%"
-                        title="Static FXG Sample"
-                        skinClass="skins.TDFPanelSkin">
-               <s:Label verticalAlign="justify" color="#323232" x="10" y="30" 
width="200"
+       <s:Panel title="Static FXG Sample" width="100%" height="100%">
+               <s:layout>
+                       <s:HorizontalLayout paddingLeft="10" paddingRight="10" 
paddingTop="10" paddingBottom="10"/>
+               </s:layout>
+               
+               <s:Label verticalAlign="justify" width="200"
                                          text="You can use a static file of 
fxg within your MXML. You include the inline
 component as shown here."/>
-                                                       
-               <fxg:OrangeCrayonStar id="crayonStar" right="160"/>
                
-               <s:VGroup right="180" bottom="20">
+               <s:VGroup>
                                <s:VGroup bottom="100">
                                        <s:HSlider id="star_width" 
maximum="400" change="crayonStar.width=star_width.value" 
                                                           
horizontalCenter="-90" y="250" />
@@ -42,9 +42,10 @@ component as shown here."/>
                                        <s:HSlider id="star_height" 
maximum="400" change="crayonStar.height=star_height.value" 
                                                           
horizontalCenter="90" y="250" />
                                        <s:Label horizontalCenter="90" y="269" 
text="height"/>  
-                               </s:VGroup>     
-                       
+                               </s:VGroup>                             
                </s:VGroup>
+               
+               <fxg:OrangeCrayonStar id="crayonStar" />
        </s:Panel>
        
        

Modified: flex/site/trunk/content/tourdeflex/spark/fxg/StaticFXGExample.swf
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/fxg/StaticFXGExample.swf?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
Binary files - no diff available.

Modified: 
flex/site/trunk/content/tourdeflex/spark/i18n/SparkCollator2Example.mxml
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/i18n/SparkCollator2Example.mxml?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
--- flex/site/trunk/content/tourdeflex/spark/i18n/SparkCollator2Example.mxml 
(original)
+++ flex/site/trunk/content/tourdeflex/spark/i18n/SparkCollator2Example.mxml 
Sat Nov 29 07:19:59 2014
@@ -21,24 +21,6 @@
                           xmlns:s="library://ns.adobe.com/flex/spark"
                           xmlns:mx="library://ns.adobe.com/flex/mx"
                           width="100%" height="100%" 
creationComplete="compareStrings()">
-       <fx:Style>
-               @namespace s "library://ns.adobe.com/flex/spark";
-               @namespace mx "library://ns.adobe.com/flex/mx";
-               s|Label {
-                       color: #FFFFFF;
-                       font-weight: bold;
-               }
-               #titleL {
-                       font-size: 20;
-               }
-               s|ComboBox {
-                       alternating-item-colors: #424242;
-               }
-               s|Form {
-                       background-color: #424242;
-               }
-               
-       </fx:Style>
        <fx:Script>
                <![CDATA[
                        import mx.collections.ArrayCollection;
@@ -64,37 +46,41 @@
                        }
                ]]>
        </fx:Script>
+       
        <fx:Declarations>
-               <!-- Place non-visual elements (e.g., services, value objects) 
here -->
                <s:SortingCollator id="sortCollator" 
locale="{localeCB.selectedItem}"/>
        </fx:Declarations>
-       <s:Scroller width="100%" height="100%">
-               <s:Group>
-                       <s:Form>
-                               <s:Label id="titleL" text="Spark Collator"/>
-                               <s:Label text="Compare two strings by using 
SortingCollator"/>
-                               <s:Spacer height="15"/>
-                               
-                               <s:FormItem label="Locales:" toolTip="Select a 
locale for the collator instance.">
-                                       <s:ComboBox id="localeCB" 
dataProvider="{_locales}" selectedIndex="5" change="compareStrings()"/>
-                               </s:FormItem>
-                               <s:FormItem label="Collator Options:" 
toolTip="Set properties for the collator instance.">
-                                       <s:HGroup>
-                                               <s:CheckBox id="ignoreCaseCB" 
label="ignoreCase" change="sortCollator.ignoreCase = 
ignoreCaseCB.selected;compareStrings()"/>
-                                               <s:CheckBox 
id="ignDiacriticsCB" label="ignoreDiacritics" 
change="sortCollator.ignoreDiacritics = 
ignDiacriticsCB.selected;compareStrings()"/>
-                                               <s:CheckBox id="ignSymbolsCB" 
label="ignoreSymbols" change="sortCollator.ignoreSymbols = 
ignSymbolsCB.selected;compareStrings()"/>
-                                               <s:CheckBox id="ignKanaTypeCB" 
label="ignoreKanaType" change="sortCollator.ignoreKanaType = 
ignKanaTypeCB.selected;compareStrings()"/>
-                                               <s:CheckBox 
id="ignCharacterWidthCB" label="ignoreCharacterWidth" 
change="sortCollator.ignoreCharacterWidth = 
ignCharacterWidthCB.selected;compareStrings()"/>
-                                       </s:HGroup>
-                               </s:FormItem>
-                               <s:FormItem label="Strings:" toolTip="Input two 
strings and find out their compare result.">
-                                       <s:HGroup>
-                                               <s:TextInput id="firstTI" 
text="coté" change="compareStrings()"/>
-                                               <s:Label id="operatorL" text=" 
" fontSize="15"/>
-                                               <s:TextInput id="secondTI" 
text="côte" change="compareStrings()"/>
-                                       </s:HGroup>
-                               </s:FormItem>
-                       </s:Form>
-               </s:Group>
-       </s:Scroller>
+
+       <s:Panel title="Spark Collator" width="100%" height="100%">
+
+               <s:layout>
+                       <s:HorizontalLayout paddingLeft="10" paddingRight="10" 
paddingTop="10" paddingBottom="10" />
+               </s:layout>
+                       
+               <s:Form height="100%" width="100%">
+                       <s:Label text="Compare two strings by using 
SortingCollator"/>
+                       <s:Spacer height="15"/>
+                       
+                       <s:FormItem label="Locales:" toolTip="Select a locale 
for the collator instance.">
+                               <s:ComboBox id="localeCB" 
dataProvider="{_locales}" selectedIndex="5" change="compareStrings()"/>
+                       </s:FormItem>
+                       <s:FormItem label="Collator Options:" toolTip="Set 
properties for the collator instance.">
+                               <s:HGroup>
+                                       <s:CheckBox id="ignoreCaseCB" 
label="ignoreCase" change="sortCollator.ignoreCase = 
ignoreCaseCB.selected;compareStrings()"/>
+                                       <s:CheckBox id="ignDiacriticsCB" 
label="ignoreDiacritics" change="sortCollator.ignoreDiacritics = 
ignDiacriticsCB.selected;compareStrings()"/>
+                                       <s:CheckBox id="ignSymbolsCB" 
label="ignoreSymbols" change="sortCollator.ignoreSymbols = 
ignSymbolsCB.selected;compareStrings()"/>
+                                       <s:CheckBox id="ignKanaTypeCB" 
label="ignoreKanaType" change="sortCollator.ignoreKanaType = 
ignKanaTypeCB.selected;compareStrings()"/>
+                                       <s:CheckBox id="ignCharacterWidthCB" 
label="ignoreCharacterWidth" change="sortCollator.ignoreCharacterWidth = 
ignCharacterWidthCB.selected;compareStrings()"/>
+                               </s:HGroup>
+                       </s:FormItem>
+                       <s:FormItem label="Strings:" toolTip="Input two strings 
and find out their compare result.">
+                               <s:HGroup>
+                                       <s:TextInput id="firstTI" text="coté" 
change="compareStrings()"/>
+                                       <s:Label id="operatorL" text=" " 
fontSize="15"/>
+                                       <s:TextInput id="secondTI" text="côte" 
change="compareStrings()"/>
+                               </s:HGroup>
+                       </s:FormItem>
+               </s:Form>
+
+       </s:Panel>
 </s:Application>

Modified: 
flex/site/trunk/content/tourdeflex/spark/i18n/SparkCollator2Example.swf
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/i18n/SparkCollator2Example.swf?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
Binary files - no diff available.

Modified: 
flex/site/trunk/content/tourdeflex/spark/i18n/SparkCollatorExample.mxml
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/i18n/SparkCollatorExample.mxml?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
--- flex/site/trunk/content/tourdeflex/spark/i18n/SparkCollatorExample.mxml 
(original)
+++ flex/site/trunk/content/tourdeflex/spark/i18n/SparkCollatorExample.mxml Sat 
Nov 29 07:19:59 2014
@@ -21,28 +21,6 @@
                           xmlns:s="library://ns.adobe.com/flex/spark"
                           xmlns:mx="library://ns.adobe.com/flex/mx"
                           width="100%" height="100%" 
creationComplete="matchRB_clickHandler()">
-       <fx:Style>
-               @namespace s "library://ns.adobe.com/flex/spark";
-               @namespace mx "library://ns.adobe.com/flex/mx";
-               s|Label {
-                       color: #FFFFFF;
-                       font-weight: bold;
-               }
-               #titleL {
-                       font-size: 20;
-               }
-               s|ComboBox {
-                       alternating-item-colors: #424242;
-               }
-               
-               s|Form {
-                       background-color: #424242;
-               }
-               
-               s|List {
-                       alternating-item-colors: #424242;
-               }
-       </fx:Style>
        
        <fx:Script>
                <![CDATA[
@@ -114,52 +92,51 @@
                        }
                ]]>
        </fx:Script>
+       
        <fx:Declarations>
-               <!-- Place non-visual elements (e.g., services, value objects) 
here -->
                <s:SortingCollator id="sortingCollator"/>
                <s:MatchingCollator id="matchingCollator"/>
        </fx:Declarations>
-       <s:layout>
-               <s:VerticalLayout/>
-       </s:layout>
        
-       <s:Scroller id="scroller" width="100%" height="100%">
-               <s:Group id="myGroup">
-                       <s:Form id="myForm">
-                               <s:Label id="titleL" text="Spark Collator"/>
-                               <s:Label text="Customize Collator options and 
find out the string sorting results: "/>
-                               <s:Spacer height="15"/>
-                               
-                               <s:FormItem label="Collator Type:" 
toolTip="Please select a Collator type first!">
-                                       <s:HGroup>
-                                               <s:RadioButton id="sortRB" 
groupName="collatorType" label="SortingCollator" click="sortRB_clickHandler()"/>
-                                               <s:RadioButton id="matchRB" 
groupName="collatorType" label="MatchingCollator" selected="true" 
click="matchRB_clickHandler()"/>
-                                       </s:HGroup>
-                               </s:FormItem>
-                               <s:FormItem label="Locale:">
-                                       <s:ComboBox id="localeCB" 
dataProvider="{_locales}" selectedIndex="0" 
-                                                               
change="_collatorInstance.setStyle('locale',localeCB.selectedItem); sortStr()"/>
-                               </s:FormItem>
-                               <s:FormItem label="Collator Options:" 
toolTip="Customize below options to see the sorting result.">
-                                       <s:CheckBox id="ignCaseCB" 
label="ignoreCase" selected="{_collatorInstance.ignoreCase}" 
-                                                               
change="_collatorInstance.ignoreCase = ignCaseCB.selected; sortStr()"/>
-                                       <s:CheckBox id="ignDiacriticsCB" 
label="ignoreDiacritics" selected="{_collatorInstance.ignoreDiacritics}" 
-                                                               
change="_collatorInstance.ignoreDiacritics = ignDiacriticsCB.selected; 
sortStr()"/>
-                                       <s:CheckBox id="ignSymbolsCB" 
label="ignoreSymbols" selected="{_collatorInstance.ignoreSymbols}" 
-                                                               
change="_collatorInstance.ignoreSymbols = ignSymbolsCB.selected; sortStr()"/>
-                                       <s:CheckBox id="ignKanaTypeCB" 
label="ignoreKanaType" selected="{_collatorInstance.ignoreKanaType}" 
-                                                               
change="_collatorInstance.ignoreKanaType = ignKanaTypeCB.selected; sortStr()"/>
-                                       <s:CheckBox id="ignCharacterWidthCB" 
label="ignoreCharacterWidth" 
selected="{_collatorInstance.ignoreCharacterWidth}" 
-                                                               
change="_collatorInstance.ignoreCharacterWidth = ignCharacterWidthCB.selected; 
sortStr()"/>
-                               </s:FormItem>
-                               <s:Label 
text="============================================================================"/>
+       <s:Panel title="Spark Collator" width="100%" height="100%">
+
+               <s:layout>
+                       <s:HorizontalLayout paddingLeft="10" paddingRight="10" 
paddingTop="10" paddingBottom="10" />
+               </s:layout>
+               
+               <s:Form id="myForm" height="100%" width="100%">
+                       <s:Label text="Customize Collator options and find out 
the string sorting results: "/>
+                       <s:Spacer height="15"/>
+                       
+                       <s:FormItem label="Collator Type:" toolTip="Please 
select a Collator type first!">
                                <s:HGroup>
-                                       <s:FormItem label="Sorting Result:">
-                                               <s:List id="sCltResult" 
dataProvider="{_resultArrColl}" toolTip="Strings that are equal will show 
within one line."/>
-                                       </s:FormItem>
+                                       <s:RadioButton id="sortRB" 
groupName="collatorType" label="SortingCollator" click="sortRB_clickHandler()"/>
+                                       <s:RadioButton id="matchRB" 
groupName="collatorType" label="MatchingCollator" selected="true" 
click="matchRB_clickHandler()"/>
                                </s:HGroup>
-                       </s:Form>
-               </s:Group>
-       </s:Scroller>
-       
+                       </s:FormItem>
+                       <s:FormItem label="Locale:">
+                               <s:ComboBox id="localeCB" 
dataProvider="{_locales}" selectedIndex="0" 
+                                                       
change="_collatorInstance.setStyle('locale',localeCB.selectedItem); sortStr()"/>
+                       </s:FormItem>
+                       <s:FormItem label="Collator Options:" 
toolTip="Customize below options to see the sorting result.">
+                               <s:CheckBox id="ignCaseCB" label="ignoreCase" 
selected="{_collatorInstance.ignoreCase}" 
+                                                       
change="_collatorInstance.ignoreCase = ignCaseCB.selected; sortStr()"/>
+                               <s:CheckBox id="ignDiacriticsCB" 
label="ignoreDiacritics" selected="{_collatorInstance.ignoreDiacritics}" 
+                                                       
change="_collatorInstance.ignoreDiacritics = ignDiacriticsCB.selected; 
sortStr()"/>
+                               <s:CheckBox id="ignSymbolsCB" 
label="ignoreSymbols" selected="{_collatorInstance.ignoreSymbols}" 
+                                                       
change="_collatorInstance.ignoreSymbols = ignSymbolsCB.selected; sortStr()"/>
+                               <s:CheckBox id="ignKanaTypeCB" 
label="ignoreKanaType" selected="{_collatorInstance.ignoreKanaType}" 
+                                                       
change="_collatorInstance.ignoreKanaType = ignKanaTypeCB.selected; sortStr()"/>
+                               <s:CheckBox id="ignCharacterWidthCB" 
label="ignoreCharacterWidth" 
selected="{_collatorInstance.ignoreCharacterWidth}" 
+                                                       
change="_collatorInstance.ignoreCharacterWidth = ignCharacterWidthCB.selected; 
sortStr()"/>
+                       </s:FormItem>
+                       <s:Label 
text="============================================================================"/>
+                       <s:HGroup>
+                               <s:FormItem label="Sorting Result:">
+                                       <s:List id="sCltResult" 
dataProvider="{_resultArrColl}" toolTip="Strings that are equal will show 
within one line."/>
+                               </s:FormItem>
+                       </s:HGroup>
+               </s:Form>
+               
+       </s:Panel>      
 </s:Application>

Modified: flex/site/trunk/content/tourdeflex/spark/i18n/SparkCollatorExample.swf
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/i18n/SparkCollatorExample.swf?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
Binary files - no diff available.

Modified: 
flex/site/trunk/content/tourdeflex/spark/i18n/SparkCurrencyFormatter2Example.mxml
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/i18n/SparkCurrencyFormatter2Example.mxml?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
--- 
flex/site/trunk/content/tourdeflex/spark/i18n/SparkCurrencyFormatter2Example.mxml
 (original)
+++ 
flex/site/trunk/content/tourdeflex/spark/i18n/SparkCurrencyFormatter2Example.mxml
 Sat Nov 29 07:19:59 2014
@@ -21,24 +21,6 @@
                           xmlns:s="library://ns.adobe.com/flex/spark"
                           xmlns:mx="library://ns.adobe.com/flex/mx"
                           width="100%" height="100%">
-       <fx:Style>
-               @namespace s "library://ns.adobe.com/flex/spark";
-               @namespace mx "library://ns.adobe.com/flex/mx";
-               s|Label {
-                       color: #FFFFFF;
-                       font-weight: bold;
-               }
-               #titleL {
-                       font-size: 20;
-               }
-               s|ComboBox {
-                       alternating-item-colors: #424242;
-               }
-               
-               s|Form {
-                       background-color: #424242;
-               }
-       </fx:Style>
        <fx:Script>
                <![CDATA[
                        import mx.collections.ArrayCollection;
@@ -46,26 +28,30 @@
                        private var _locales:ArrayCollection = new 
ArrayCollection(['en-US','de-DE','ja-JP','ru-RU','ar-SA','zh-CN','fr-FR']);
                ]]>
        </fx:Script>
+
        <fx:Declarations>
-               <!-- Place non-visual elements (e.g., services, value objects) 
here -->
                <s:CurrencyFormatter id="cf"/>
        </fx:Declarations>
-       <s:Scroller width="100%" height="100%">
-               <s:Group>
-                       <s:Form>
-                               <s:Label id="titleL" text="Spark 
CurrencyFormatter"/>
-                               <s:Label text="Format a currency number by 
using spark CurrencyFormatter"/>
-                               <s:Spacer height="15"/>
-                               <s:FormItem label="Locales">
-                                       <s:ComboBox id="localeCB" 
dataProvider="{_locales}" selectedIndex="0" 
updateComplete="cf.setStyle('locale',localeCB.selectedItem)"/>
-                               </s:FormItem>
-                               <s:FormItem label="Please enter a currency 
number: ">
-                                       <s:TextInput id="inputTI" text="12345"/>
-                               </s:FormItem>
-                               <s:FormItem label="Format result: ">
-                                       <s:Label id="resultL" 
text="{cf.format(inputTI.text)}"/>
-                               </s:FormItem>
-                       </s:Form>
-               </s:Group>
-       </s:Scroller>
+       
+       <s:Panel title="Spark CurrencyFormatter" width="100%" height="100%">
+
+               <s:layout>
+                       <s:HorizontalLayout paddingLeft="10" paddingRight="10" 
paddingTop="10" paddingBottom="10" />
+               </s:layout>
+               
+               <s:Form height="100%" width="100%">
+                       <s:Label text="Format a currency number by using spark 
CurrencyFormatter"/>
+                       <s:Spacer height="15"/>
+                       <s:FormItem label="Locales">
+                               <s:ComboBox id="localeCB" 
dataProvider="{_locales}" selectedIndex="0" 
updateComplete="cf.setStyle('locale',localeCB.selectedItem)"/>
+                       </s:FormItem>
+                       <s:FormItem label="Please enter a currency number: ">
+                               <s:TextInput id="inputTI" text="12345"/>
+                       </s:FormItem>
+                       <s:FormItem label="Format result: ">
+                               <s:Label id="resultL" 
text="{cf.format(inputTI.text)}"/>
+                       </s:FormItem>
+               </s:Form>
+
+       </s:Panel>
 </s:Application>

Modified: 
flex/site/trunk/content/tourdeflex/spark/i18n/SparkCurrencyFormatter2Example.swf
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/i18n/SparkCurrencyFormatter2Example.swf?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
Binary files - no diff available.

Modified: 
flex/site/trunk/content/tourdeflex/spark/i18n/SparkCurrencyFormatterExample.mxml
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/i18n/SparkCurrencyFormatterExample.mxml?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
--- 
flex/site/trunk/content/tourdeflex/spark/i18n/SparkCurrencyFormatterExample.mxml
 (original)
+++ 
flex/site/trunk/content/tourdeflex/spark/i18n/SparkCurrencyFormatterExample.mxml
 Sat Nov 29 07:19:59 2014
@@ -21,24 +21,6 @@
                           xmlns:s="library://ns.adobe.com/flex/spark"
                           xmlns:mx="library://ns.adobe.com/flex/mx"
                           width="100%" height="100%">
-       <fx:Style>
-               @namespace s "library://ns.adobe.com/flex/spark";
-               @namespace mx "library://ns.adobe.com/flex/mx";
-               s|Label {
-                       color: #FFFFFF;
-                       font-weight: bold;
-               }
-               #titleL {
-                       font-size: 20;
-               }
-               s|ComboBox {
-                       alternating-item-colors: #424242;
-               }
-               
-               s|Form {
-                       background-color: #424242;
-               }
-       </fx:Style>
        
        <fx:Script>
                <![CDATA[
@@ -59,54 +41,54 @@
                        
                ]]>
        </fx:Script>
+       
        <fx:Declarations>
-               <!-- Place non-visual elements (e.g., services, value objects) 
here -->
                <s:CurrencyFormatter id="cf" locale="{localeCB.selectedItem}"/>
                <s:CurrencyFormatter id="cf_default" 
locale="{localeCB.selectedItem}"/>
        </fx:Declarations>
-       <s:layout>
-               <s:VerticalLayout/>
-       </s:layout>
-       <s:Scroller id="scroller" width="100%" height="100%">
-               <s:Group>
-                       <s:Form>
-                               <s:Label id="titleL" text="Spark 
CurrencyFormatter"/>
-                               <s:Label text="Select a locale to see the 
property value and formatted currency: "/>
-                               <s:Spacer height="15"/>
-                               <s:FormItem label="Locale:">
-                                       <s:ComboBox id="localeCB" 
dataProvider="{locales}" selectedIndex="0" updateComplete="formatCurr()"/>
-                               </s:FormItem>
-                               <s:FormItem label="Input a number to format:">
-                                       <s:TextInput id="inputTI" text="12345" 
change="formatCurr()"/>
-                               </s:FormItem>
-                               <s:FormItem label="Fraction Digits: (default: 
{cf_default.fractionalDigits})">
-                                       <s:NumericStepper id="fdNS" 
maximum="10" minimum="0" change="cf.fractionalDigits = 
fdNS.value;formatCurr()"/>
-                               </s:FormItem>
-                               <s:FormItem label="Decimal Separator: (default: 
{cf_default.decimalSeparator})">
-                                       <s:TextInput id="dsTI" 
change="cf.decimalSeparator = dsTI.text;formatCurr()"/>
-                               </s:FormItem>
-                               <s:FormItem label="Grouping Pattern: (default: 
{cf_default.groupingPattern})">
-                                       <s:ComboBox id="gpCB" 
dataProvider="{groupPatternArrColl}" change="cf.groupingPattern = 
gpCB.selectedItem;formatCurr()"/>
-                               </s:FormItem>
-                               <s:FormItem label="Grouping Separator: 
(default: {cf_default.groupingSeparator})">
-                                       <s:TextInput id="gsTI" 
change="cf.groupingSeparator = gsTI.text;formatCurr()"/>
-                               </s:FormItem>
-                               <s:FormItem label="Negative Currency Format: 
(default: {cf_default.negativeCurrencyFormat})">
-                                       <s:NumericStepper id="ncfNS" 
minimum="0" maximum="15" change="cf.negativeCurrencyFormat = 
ncfNS.value;formatCurr()"/>
-                               </s:FormItem>
-                               <s:FormItem label="Positive Currency Format: 
(default: {cf_default.positiveCurrencyFormat})">
-                                       <s:NumericStepper id="pcfNS" 
middleClick="0" maximum="3" change="cf.positiveCurrencyFormat = 
pcfNS.value;formatCurr()"/>
-                               </s:FormItem>
-                               <s:Label 
text="==================================================================="/>
-                               <s:FormItem label="Formatted Currency with ISO 
code is:">
-                                       <s:Label id="resultL"/>
-                               </s:FormItem>
-                               <s:FormItem label="Formatted Currency with 
currency symbol is:">
-                                       <s:Label id="resultSymbolL"/>
-                               </s:FormItem>
-                       </s:Form>
-               </s:Group>
-       </s:Scroller>
-       
-       
+
+
+       <s:Panel title="Spark CurrencyFormatter" width="100%" height="100%">
+
+               <s:layout>
+                       <s:HorizontalLayout paddingLeft="10" paddingRight="10" 
paddingTop="10" paddingBottom="10" />
+               </s:layout>
+                       
+               <s:Form height="100%" width="100%">
+                       <s:Label text="Select a locale to see the property 
value and formatted currency: "/>
+                       <s:Spacer height="15"/>
+                       <s:FormItem label="Locale:">
+                               <s:ComboBox id="localeCB" 
dataProvider="{locales}" selectedIndex="0" updateComplete="formatCurr()"/>
+                       </s:FormItem>
+                       <s:FormItem label="Input a number to format:">
+                               <s:TextInput id="inputTI" text="12345" 
change="formatCurr()"/>
+                       </s:FormItem>
+                       <s:FormItem label="Fraction Digits: (default: 
{cf_default.fractionalDigits})">
+                               <s:NumericStepper id="fdNS" maximum="10" 
minimum="0" change="cf.fractionalDigits = fdNS.value;formatCurr()"/>
+                       </s:FormItem>
+                       <s:FormItem label="Decimal Separator: (default: 
{cf_default.decimalSeparator})">
+                               <s:TextInput id="dsTI" 
change="cf.decimalSeparator = dsTI.text;formatCurr()"/>
+                       </s:FormItem>
+                       <s:FormItem label="Grouping Pattern: (default: 
{cf_default.groupingPattern})">
+                               <s:ComboBox id="gpCB" 
dataProvider="{groupPatternArrColl}" change="cf.groupingPattern = 
gpCB.selectedItem;formatCurr()"/>
+                       </s:FormItem>
+                       <s:FormItem label="Grouping Separator: (default: 
{cf_default.groupingSeparator})">
+                               <s:TextInput id="gsTI" 
change="cf.groupingSeparator = gsTI.text;formatCurr()"/>
+                       </s:FormItem>
+                       <s:FormItem label="Negative Currency Format: (default: 
{cf_default.negativeCurrencyFormat})">
+                               <s:NumericStepper id="ncfNS" minimum="0" 
maximum="15" change="cf.negativeCurrencyFormat = ncfNS.value;formatCurr()"/>
+                       </s:FormItem>
+                       <s:FormItem label="Positive Currency Format: (default: 
{cf_default.positiveCurrencyFormat})">
+                               <s:NumericStepper id="pcfNS" middleClick="0" 
maximum="3" change="cf.positiveCurrencyFormat = pcfNS.value;formatCurr()"/>
+                       </s:FormItem>
+                       <s:Label 
text="==================================================================="/>
+                       <s:FormItem label="Formatted Currency with ISO code 
is:">
+                               <s:Label id="resultL"/>
+                       </s:FormItem>
+                       <s:FormItem label="Formatted Currency with currency 
symbol is:">
+                               <s:Label id="resultSymbolL"/>
+                       </s:FormItem>
+               </s:Form>
+
+       </s:Panel>
 </s:Application>

Modified: 
flex/site/trunk/content/tourdeflex/spark/i18n/SparkCurrencyFormatterExample.swf
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/i18n/SparkCurrencyFormatterExample.swf?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
Binary files - no diff available.

Modified: 
flex/site/trunk/content/tourdeflex/spark/i18n/SparkCurrencyValidator2Example.mxml
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/i18n/SparkCurrencyValidator2Example.mxml?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
--- 
flex/site/trunk/content/tourdeflex/spark/i18n/SparkCurrencyValidator2Example.mxml
 (original)
+++ 
flex/site/trunk/content/tourdeflex/spark/i18n/SparkCurrencyValidator2Example.mxml
 Sat Nov 29 07:19:59 2014
@@ -21,23 +21,6 @@
                           xmlns:s="library://ns.adobe.com/flex/spark"
                           xmlns:mx="library://ns.adobe.com/flex/mx"
                           width="100%" height="100%">
-       <fx:Style>
-               @namespace s "library://ns.adobe.com/flex/spark";
-               @namespace mx "library://ns.adobe.com/flex/mx";
-               s|Label {
-                       color: #FFFFFF;
-                       font-weight: bold;
-               }
-               #titleL {
-                       font-size: 20;
-               }
-               s|ComboBox {
-                       alternating-item-colors: #424242;
-               }
-               s|Form {
-                       background-color: #424242;
-               }
-       </fx:Style>
        <fx:Script>
                <![CDATA[
                        import mx.collections.ArrayCollection;
@@ -45,27 +28,31 @@
                        private var _locales:ArrayCollection = new 
ArrayCollection(['en-US','de-DE','ja-JP','ru-RU','zh-CN','fr-FR']);
                ]]>
        </fx:Script>
+
        <fx:Declarations>
-               <!-- Place non-visual elements (e.g., services, value objects) 
here -->
                <s:CurrencyValidator id="cv" source="{inputTI}" property="text" 
                                                         maxValue="100" 
domain="int" locale="{localeCB.selectedItem}"/>
        </fx:Declarations>
-       <s:Scroller width="100%" height="100%">
-               <s:Group>
-                       <s:Form>
-                               <s:Label id="titleL" text="Spark 
CurrencyValidator"/>
-                               <s:Label text="Validate a currency number by 
using Spark CurrencyValidator"/>
-                               <s:Spacer height="15"/>
-                               <s:FormItem label="Locales:">
-                                       <s:ComboBox id="localeCB" 
dataProvider="{_locales}" selectedIndex="0"/>
-                               </s:FormItem>
-                               <s:FormItem label="Enter a currency number to 
validate: "
-                                                       toolTip="The number 
should be an integer and less than 100">
-                                       <s:TextInput id="inputTI" 
text="{cv.currencySymbol}"
-                                                                toolTip="It 
shows the currency symbol of current locale already, please continue enter 
numbers to validate. 
-                                                                Make focus out 
of the text input to validate the number."/>
-                               </s:FormItem>
-                       </s:Form>
-               </s:Group>
-       </s:Scroller>
+
+       <s:Panel title="Spark CurrencyValidator" width="100%" height="100%">
+
+               <s:layout>
+                       <s:HorizontalLayout paddingLeft="10" paddingRight="10" 
paddingTop="10" paddingBottom="10" />
+               </s:layout>
+               
+               <s:Form height="100%" width="100%">
+                       <s:Label text="Validate a currency number by using 
Spark CurrencyValidator"/>
+                       <s:Spacer height="15"/>
+                       <s:FormItem label="Locales:">
+                               <s:ComboBox id="localeCB" 
dataProvider="{_locales}" selectedIndex="0"/>
+                       </s:FormItem>
+                       <s:FormItem label="Enter a currency number to validate: 
"
+                                               toolTip="The number should be 
an integer and less than 100">
+                               <s:TextInput id="inputTI" 
text="{cv.currencySymbol}"
+                                                        toolTip="It shows the 
currency symbol of current locale already, please continue enter numbers to 
validate. 
+                                                        Make focus out of the 
text input to validate the number."/>
+                       </s:FormItem>
+               </s:Form>
+
+       </s:Panel>
 </s:Application>

Modified: 
flex/site/trunk/content/tourdeflex/spark/i18n/SparkCurrencyValidator2Example.swf
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/i18n/SparkCurrencyValidator2Example.swf?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
Binary files - no diff available.

Modified: 
flex/site/trunk/content/tourdeflex/spark/i18n/SparkCurrencyValidatorExample.mxml
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/i18n/SparkCurrencyValidatorExample.mxml?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
--- 
flex/site/trunk/content/tourdeflex/spark/i18n/SparkCurrencyValidatorExample.mxml
 (original)
+++ 
flex/site/trunk/content/tourdeflex/spark/i18n/SparkCurrencyValidatorExample.mxml
 Sat Nov 29 07:19:59 2014
@@ -21,24 +21,6 @@
                           xmlns:s="library://ns.adobe.com/flex/spark"
                           xmlns:mx="library://ns.adobe.com/flex/mx"
                           width="100%" height="100%">
-       <fx:Style>
-               @namespace s "library://ns.adobe.com/flex/spark";
-               @namespace mx "library://ns.adobe.com/flex/mx";
-               s|Label {
-                       color: #FFFFFF;
-                       font-weight: bold;
-               }
-               #titleL {
-                       font-size: 20;
-               }
-               s|ComboBox {
-                       alternating-item-colors: #424242;
-               }
-               
-               s|Form {
-                       background-color: #424242;
-               }
-       </fx:Style>
        
        <fx:Script>
                <![CDATA[
@@ -64,9 +46,8 @@
                        
                ]]>
        </fx:Script>
+       
        <fx:Declarations>
-               <!-- Place non-visual elements (e.g., services, value objects) 
here -->
-               
                <!--Click Tab key to validate the number-->
                <s:CurrencyValidator id="cv1" source="{currTI1}" 
property="text"/>
                <s:CurrencyValidator id="cv2" source="{currTI2}" 
property="text"/>
@@ -74,52 +55,51 @@
                <s:CurrencyValidator id="cv4" source="{currTI4}" 
property="text" minValue="20" maxValue="200"/>
                <s:CurrencyValidator id="cv5" source="{currTI5}" 
property="text" domain="int"/>
        </fx:Declarations>
-       <s:layout>
-               <s:VerticalLayout/>
-       </s:layout>
-       <s:Scroller id="scroller" width="100%" height="100%">
-               <s:Group>
-                       <s:Form>
-                               <s:Label id="titleL" text="Spark 
CurrencyValidator"/>
-                               <s:Label text="Create some criterions and 
validate the input number: "/>
-                               <s:Spacer height="15"/>
-                               <s:FormItem label="Locale:">
-                                       <s:ComboBox id="localeCB" 
dataProvider="{_locales}" selectedIndex="0" 
updateComplete="localeCB_updateCompleteHandler(event)"/>
-                               </s:FormItem>
-                               <s:Label 
text="============================================================================"/>
-                               <s:FormItem label="Currency symbol and ISO code 
based on current locale are:">
-                                       <s:HGroup>
-                                               <s:Label id="symbolL" 
text="Currency symbol:  {cv1.currencySymbol}"/>
-                                               <s:Label id="isoL" 
text="Currency ISO code:  {cv1.currencyISOCode}"/>
-                                       </s:HGroup>
-                               </s:FormItem>
-                               <s:FormItem label="Please enter an integer 
currency number with currency symbol:">
-                                       <s:TextInput id="currTI1" 
text="{cv1.currencySymbol}" 
-                                                                toolTip="Here 
is the correct currency symbol of current locale, please continue enter numbers 
to validate"/>
-                               </s:FormItem>
-                               <s:FormItem label="Please enter an integer 
currency number with currency ISO code:">
-                                       <s:TextInput id="currTI2" 
text="{cv1.currencyISOCode}" 
-                                                                toolTip="Here 
is the correct currency ISO code of current locale, please continue enter 
numbers to validate"/>
-                               </s:FormItem>
-                               <s:FormItem label="Please enter a currency 
number with at most two fractional digits:">
-                                       <s:TextInput id="currTI3" 
-                                                                
toolTip="decimal separator of current locale is {cv3.decimalSeparator}"/>
-                               </s:FormItem>
-                               <s:FormItem label="Please enter a currency 
number between 20 and 200:">
-                                       <s:TextInput id="currTI4"/>
-                               </s:FormItem>
-                               <s:FormItem label="Please enter an integer 
currency number:">
-                                       <s:TextInput id="currTI5"/>
-                               </s:FormItem>
-                               <s:FormItem label="Click the button to validate 
all inputted currency number:">
-                                       <s:HGroup>
-                                               <s:Button label="Validate All" 
click="button1_clickHandler(event)"/>
-                                               <s:Label id="resultL"/>
-                                       </s:HGroup>
-                               </s:FormItem>
-                       </s:Form>
-               </s:Group>
-       </s:Scroller>
-       
        
+       <s:Panel title="Spark CurrencyValidator" width="100%" height="100%">
+
+               <s:layout>
+                       <s:HorizontalLayout paddingLeft="10" paddingRight="10" 
paddingTop="10" paddingBottom="10" />
+               </s:layout>
+                       
+               <s:Form height="100%" width="100%">
+                       <s:Label text="Create some criterions and validate the 
input number: "/>
+                       <s:Spacer height="15"/>
+                       <s:FormItem label="Locale:">
+                               <s:ComboBox id="localeCB" 
dataProvider="{_locales}" selectedIndex="0" 
updateComplete="localeCB_updateCompleteHandler(event)"/>
+                       </s:FormItem>
+                       <s:Label 
text="============================================================================"/>
+                       <s:FormItem label="Currency symbol and ISO code based 
on current locale are:">
+                               <s:HGroup>
+                                       <s:Label id="symbolL" text="Currency 
symbol:  {cv1.currencySymbol}"/>
+                                       <s:Label id="isoL" text="Currency ISO 
code:  {cv1.currencyISOCode}"/>
+                               </s:HGroup>
+                       </s:FormItem>
+                       <s:FormItem label="Please enter an integer currency 
number with currency symbol:">
+                               <s:TextInput id="currTI1" 
text="{cv1.currencySymbol}" 
+                                                        toolTip="Here is the 
correct currency symbol of current locale, please continue enter numbers to 
validate"/>
+                       </s:FormItem>
+                       <s:FormItem label="Please enter an integer currency 
number with currency ISO code:">
+                               <s:TextInput id="currTI2" 
text="{cv1.currencyISOCode}" 
+                                                        toolTip="Here is the 
correct currency ISO code of current locale, please continue enter numbers to 
validate"/>
+                       </s:FormItem>
+                       <s:FormItem label="Please enter a currency number with 
at most two fractional digits:">
+                               <s:TextInput id="currTI3" 
+                                                        toolTip="decimal 
separator of current locale is {cv3.decimalSeparator}"/>
+                       </s:FormItem>
+                       <s:FormItem label="Please enter a currency number 
between 20 and 200:">
+                               <s:TextInput id="currTI4"/>
+                       </s:FormItem>
+                       <s:FormItem label="Please enter an integer currency 
number:">
+                               <s:TextInput id="currTI5"/>
+                       </s:FormItem>
+                       <s:FormItem label="Click the button to validate all 
inputted currency number:">
+                               <s:HGroup>
+                                       <s:Button label="Validate All" 
click="button1_clickHandler(event)"/>
+                                       <s:Label id="resultL"/>
+                               </s:HGroup>
+                       </s:FormItem>
+               </s:Form>
+
+       </s:Panel>
 </s:Application>

Modified: 
flex/site/trunk/content/tourdeflex/spark/i18n/SparkCurrencyValidatorExample.swf
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/i18n/SparkCurrencyValidatorExample.swf?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
Binary files - no diff available.

Modified: 
flex/site/trunk/content/tourdeflex/spark/i18n/SparkDateTimeFormatter2Example.mxml
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/i18n/SparkDateTimeFormatter2Example.mxml?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
--- 
flex/site/trunk/content/tourdeflex/spark/i18n/SparkDateTimeFormatter2Example.mxml
 (original)
+++ 
flex/site/trunk/content/tourdeflex/spark/i18n/SparkDateTimeFormatter2Example.mxml
 Sat Nov 29 07:19:59 2014
@@ -21,24 +21,6 @@
                           xmlns:s="library://ns.adobe.com/flex/spark"
                           xmlns:mx="library://ns.adobe.com/flex/mx"
                           width="100%" height="100%">
-       <fx:Style>
-               @namespace s "library://ns.adobe.com/flex/spark";
-               @namespace mx "library://ns.adobe.com/flex/mx";
-               s|Label {
-                       color: #FFFFFF;
-                       font-weight: bold;
-               }
-               #titleL {
-                       font-size: 20;
-               }
-               s|ComboBox {
-                       alternating-item-colors: #424242;
-               }
-               
-               s|Form {
-                       background-color: #424242;
-               }
-       </fx:Style>
        <fx:Script>
                <![CDATA[
                        import mx.collections.ArrayCollection;
@@ -47,27 +29,31 @@
                        private var locales:ArrayCollection = new 
ArrayCollection(['en-US','de-DE','ja-JP','ru-RU','ar-SA','zh-CN']);
                ]]>
        </fx:Script>
+
        <fx:Declarations>
-               <!-- Place non-visual elements (e.g., services, value objects) 
here -->
                <s:DateTimeFormatter id="dtf" locale="{localeCB.selectedItem}"/>
        </fx:Declarations>
-       <s:Scroller width="100%" height="100%">
-               <s:Group>
-                       <s:Form>
-                               <s:Label id="titleL" text="Spark 
DateTimeFormatter"/>
-                               <s:Label text="Format a date by using Spark 
DateTimeFormatter: "/>
-                               <s:Spacer height="15"/>
-                               
-                               <s:FormItem label="Locales:">
-                                       <s:ComboBox id="localeCB" 
dataProvider="{locales}" selectedIndex="0"/>
-                               </s:FormItem>
-                               <s:FormItem label="Choose a date:">
-                                       <mx:DateChooser id="dateC" 
showToday="false"/>
-                               </s:FormItem>
-                               <s:FormItem label="Format result is:">
-                                       <s:Label id="resultL" 
text="{dtf.format(dateC.selectedDate)}"/>
-                               </s:FormItem>
-                       </s:Form>
-               </s:Group>
-       </s:Scroller>
+
+       <s:Panel title="Spark DateTimeFormatter" width="100%" height="100%">
+
+               <s:layout>
+                       <s:HorizontalLayout paddingLeft="10" paddingRight="10" 
paddingTop="10" paddingBottom="10" />
+               </s:layout>
+               
+               <s:Form height="100%" width="100%">
+                       <s:Label text="Format a date by using Spark 
DateTimeFormatter: "/>
+                       <s:Spacer height="15"/>
+                       
+                       <s:FormItem label="Locales:">
+                               <s:ComboBox id="localeCB" 
dataProvider="{locales}" selectedIndex="0"/>
+                       </s:FormItem>
+                       <s:FormItem label="Choose a date:">
+                               <mx:DateChooser id="dateC" showToday="false"/>
+                       </s:FormItem>
+                       <s:FormItem label="Format result is:">
+                               <s:Label id="resultL" 
text="{dtf.format(dateC.selectedDate)}"/>
+                       </s:FormItem>
+               </s:Form>
+               
+       </s:Panel>              
 </s:Application>

Modified: 
flex/site/trunk/content/tourdeflex/spark/i18n/SparkDateTimeFormatter2Example.swf
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/i18n/SparkDateTimeFormatter2Example.swf?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
Binary files - no diff available.

Modified: 
flex/site/trunk/content/tourdeflex/spark/i18n/SparkDateTimeFormatterExample.mxml
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/i18n/SparkDateTimeFormatterExample.mxml?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
--- 
flex/site/trunk/content/tourdeflex/spark/i18n/SparkDateTimeFormatterExample.mxml
 (original)
+++ 
flex/site/trunk/content/tourdeflex/spark/i18n/SparkDateTimeFormatterExample.mxml
 Sat Nov 29 07:19:59 2014
@@ -21,25 +21,7 @@
                           xmlns:s="library://ns.adobe.com/flex/spark"
                           xmlns:mx="library://ns.adobe.com/flex/mx"
                           width="100%" height="100%">
-       <fx:Style>
-               @namespace s "library://ns.adobe.com/flex/spark";
-               @namespace mx "library://ns.adobe.com/flex/mx";
-               s|Label {
-                       color: #FFFFFF;
-                       font-weight: bold;
-               }
-               #titleL {
-                       font-size: 20;
-               }
-               s|ComboBox {
-                       alternating-item-colors: #424242;
-               }
-               
-               s|Form {
-                       background-color: #424242;
-               }
-       </fx:Style>
-       
+
        <fx:Script>
                <![CDATA[
                        import mx.collections.ArrayCollection;
@@ -57,45 +39,48 @@
                        }
                ]]>
        </fx:Script>
+       
        <fx:Declarations>
-               <!-- Place non-visual elements (e.g., services, value objects) 
here -->
                <s:DateTimeFormatter id="dtf"/>
        </fx:Declarations>
+
        <s:layout>
                <s:VerticalLayout/>
        </s:layout>
-       <s:Scroller id="scroller" width="100%" height="100%">
-               <s:Group>
-                       <s:Form>
-                               <s:Label id="titleL" text="Spark 
DateTimeFormatter"/>
-                               <s:Label text="Select a locale to see the 
formatted date, weekday names and month names: "/>
-                               <s:Spacer height="15"/>
-                               
-                               <s:FormItem label="Locale: ">
-                                       <s:ComboBox id="localeCB" 
dataProvider="{locales}" selectedIndex="0" 
updateComplete="dtf.setStyle('locale',localeCB.selectedItem)"/>
-                               </s:FormItem>
-                               <s:FormItem label="Please select the format of 
date:">
-                                       <s:ComboBox id="dtpCB" 
dataProvider="{dateTimePatternAryColl}" selectedIndex="0" 
updateComplete="dtf.dateTimePattern=dtpCB.selectedItem"/>
-                               </s:FormItem>
-                               <s:FormItem label="Please select a date to 
format:">
-                                       <mx:DateField id="dateField"/>
-                               </s:FormItem>
-                               <s:FormItem label="The Weekday Names are:">
-                                       <s:Label 
text="{dtf.getWeekdayNames()}"/>
-                               </s:FormItem>
-                               <s:FormItem label="The Month Names are:">
-                                       <s:Label text="{dtf.getMonthNames()}"/>
-                               </s:FormItem>
-                               <s:Label text="     
==========================================================================="/>
-                               <s:FormItem label="The formatted result is:">
-                                       <s:Label id="resultL"/>
-                               </s:FormItem>
-                               <s:FormItem>
-                                       <s:Button id="bt" label="Format Date" 
click="formatDate()"/>
-                               </s:FormItem>
-                       </s:Form>
-               </s:Group>
-       </s:Scroller>
-       
-       
+
+       <s:Panel title="Spark DateTimeFormatter" width="100%" height="100%">
+
+               <s:layout>
+                       <s:HorizontalLayout paddingLeft="10" paddingRight="10" 
paddingTop="10" paddingBottom="10" />
+               </s:layout>
+               
+               <s:Form height="100%" width="100%">
+                       <s:Label text="Select a locale to see the formatted 
date, weekday names and month names: "/>
+                       <s:Spacer height="15"/>
+                       
+                       <s:FormItem label="Locale: ">
+                               <s:ComboBox id="localeCB" 
dataProvider="{locales}" selectedIndex="0" 
updateComplete="dtf.setStyle('locale',localeCB.selectedItem)"/>
+                       </s:FormItem>
+                       <s:FormItem label="Please select the format of date:">
+                               <s:ComboBox id="dtpCB" 
dataProvider="{dateTimePatternAryColl}" selectedIndex="0" 
updateComplete="dtf.dateTimePattern=dtpCB.selectedItem"/>
+                       </s:FormItem>
+                       <s:FormItem label="Please select a date to format:">
+                               <mx:DateField id="dateField"/>
+                       </s:FormItem>
+                       <s:FormItem label="The Weekday Names are:">
+                               <s:Label text="{dtf.getWeekdayNames()}"/>
+                       </s:FormItem>
+                       <s:FormItem label="The Month Names are:">
+                               <s:Label text="{dtf.getMonthNames()}"/>
+                       </s:FormItem>
+                       <s:Label text="     
==========================================================================="/>
+                       <s:FormItem label="The formatted result is:">
+                               <s:Label id="resultL"/>
+                       </s:FormItem>
+                       <s:FormItem>
+                               <s:Button id="bt" label="Format Date" 
click="formatDate()"/>
+                       </s:FormItem>
+               </s:Form>
+
+       </s:Panel>
 </s:Application>

Modified: 
flex/site/trunk/content/tourdeflex/spark/i18n/SparkDateTimeFormatterExample.swf
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/i18n/SparkDateTimeFormatterExample.swf?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
Binary files - no diff available.

Modified: 
flex/site/trunk/content/tourdeflex/spark/i18n/SparkFormatterExample.mxml
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/i18n/SparkFormatterExample.mxml?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
--- flex/site/trunk/content/tourdeflex/spark/i18n/SparkFormatterExample.mxml 
(original)
+++ flex/site/trunk/content/tourdeflex/spark/i18n/SparkFormatterExample.mxml 
Sat Nov 29 07:19:59 2014
@@ -20,39 +20,41 @@
 <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="18" 
locale="{c.selectedItem}">
-       
-       <s:layout>
-               <s:VerticalLayout horizontalAlign="center" paddingTop="10" 
paddingBottom="10" paddingLeft="10" paddingRight="10" 
-                                                 gap="8"/>
-       </s:layout>
-       
+                          locale="{c.selectedItem}">
+
        <fx:Declarations>
                <s:CurrencyFormatter id="cf" useCurrencySymbol="true"/>
                <s:DateTimeFormatter id="df"/>
        </fx:Declarations>
        
-       <s:Label text="Select a locale to see the formatted currency and 
date:"/>
-       <s:ComboBox id="c" selectedItem="en-US...">
-               <s:dataProvider>
-                       <s:ArrayList>
-                               <fx:String>de-DE</fx:String>
-                               <fx:String>en-US</fx:String>
-                               <fx:String>es-ES</fx:String>
-                               <fx:String>fi-FI</fx:String>
-                               <fx:String>fr-FR</fx:String>
-                               <fx:String>it-IT</fx:String>
-                               <fx:String>ja-JP</fx:String>
-                               <fx:String>ko-KR</fx:String>
-                               <fx:String>nb-NO</fx:String>
-                               <fx:String>pt-PT</fx:String>
-                               <fx:String>ru-RU</fx:String>
-                               <fx:String>zh-CN</fx:String>
-                       </s:ArrayList>
-               </s:dataProvider>
-       </s:ComboBox>
-       
-       <s:Label text="{cf.format(12.3)}"/>
-       <s:Label text="{df.format(new Date())}"/>
+       <s:Panel title="Spark Locale Formatter" width="100%" height="100%">
+
+               <s:layout>
+                       <s:VerticalLayout paddingLeft="10" paddingRight="10" 
paddingTop="10" paddingBottom="10" />
+               </s:layout>
+               
+               <s:Label text="Select a locale to see the formatted currency 
and date:"/>
+               <s:ComboBox id="c" selectedItem="en-US...">
+                       <s:dataProvider>
+                               <s:ArrayList>
+                                       <fx:String>de-DE</fx:String>
+                                       <fx:String>en-US</fx:String>
+                                       <fx:String>es-ES</fx:String>
+                                       <fx:String>fi-FI</fx:String>
+                                       <fx:String>fr-FR</fx:String>
+                                       <fx:String>it-IT</fx:String>
+                                       <fx:String>ja-JP</fx:String>
+                                       <fx:String>ko-KR</fx:String>
+                                       <fx:String>nb-NO</fx:String>
+                                       <fx:String>pt-PT</fx:String>
+                                       <fx:String>ru-RU</fx:String>
+                                       <fx:String>zh-CN</fx:String>
+                               </s:ArrayList>
+                       </s:dataProvider>
+               </s:ComboBox>
        
+               <s:Label text="{cf.format(12.3)}"/>
+               <s:Label text="{df.format(new Date())}"/>
+
+       </s:Panel>
 </s:Application>
\ No newline at end of file

Modified: 
flex/site/trunk/content/tourdeflex/spark/i18n/SparkFormatterExample.swf
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/i18n/SparkFormatterExample.swf?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
Binary files - no diff available.

Modified: 
flex/site/trunk/content/tourdeflex/spark/i18n/SparkNumberFormatter2Example.mxml
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/i18n/SparkNumberFormatter2Example.mxml?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
--- 
flex/site/trunk/content/tourdeflex/spark/i18n/SparkNumberFormatter2Example.mxml 
(original)
+++ 
flex/site/trunk/content/tourdeflex/spark/i18n/SparkNumberFormatter2Example.mxml 
Sat Nov 29 07:19:59 2014
@@ -19,24 +19,7 @@
 -->
 <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:Style>
-               @namespace s "library://ns.adobe.com/flex/spark";
-               @namespace mx "library://ns.adobe.com/flex/mx";
-               s|Label {
-                       color: #FFFFFF;
-                       font-weight: bold;
-               }
-               #titleL {
-                       font-size: 20;
-               }
-               s|ComboBox {
-                       alternating-item-colors: #424242;
-               }
-               s|Form {
-                       background-color: #424242;
-               }
-       </fx:Style>
+                          xmlns:mx="library://ns.adobe.com/flex/mx">
        <fx:Script>
                <![CDATA[
                        import mx.collections.ArrayCollection;
@@ -44,26 +27,30 @@
                        private var locales:ArrayCollection = new 
ArrayCollection(['en-US','de-DE','ja-JP','ru-RU','ar-SA','zh-CN','fr-FR']);
                ]]>
        </fx:Script>
+
        <fx:Declarations>
-               <!-- Place non-visual elements (e.g., services, value objects) 
here -->
                <s:NumberFormatter id="nf" locale="{localeCB.selectedItem}"/>
        </fx:Declarations>
-       <s:Scroller width="100%" height="100%">
-               <s:Group>
-                       <s:Form>
-                               <s:Label id="titleL" text="Spark 
NumberFormatter"/>
-                               <s:Label text="Format a number by using spark 
NumberFormatter"/>
-                               <s:Spacer height="15"/>
-                               <s:FormItem label="Locales:">
-                                       <s:ComboBox id="localeCB" 
dataProvider="{locales}" selectedIndex="0"/>
-                               </s:FormItem>
-                               <s:FormItem label="Please enter a number:">
-                                       <s:TextInput id="inputTI" text="12345"/>
-                               </s:FormItem>
-                               <s:FormItem label="Format result:">
-                                       <s:Label 
text="{nf.format(inputTI.text)}"/>
-                               </s:FormItem>
-                       </s:Form>
-               </s:Group>
-       </s:Scroller>
+
+       <s:Panel title="Spark NumberFormatter" width="100%" height="100%">
+
+               <s:layout>
+                       <s:HorizontalLayout paddingLeft="10" paddingRight="10" 
paddingTop="10" paddingBottom="10" />
+               </s:layout>
+               
+               <s:Form height="100%" width="100%">
+                       <s:Label text="Format a number by using spark 
NumberFormatter"/>
+                       <s:Spacer height="15"/>
+                       <s:FormItem label="Locales:">
+                               <s:ComboBox id="localeCB" 
dataProvider="{locales}" selectedIndex="0"/>
+                       </s:FormItem>
+                       <s:FormItem label="Please enter a number:">
+                               <s:TextInput id="inputTI" text="12345"/>
+                       </s:FormItem>
+                       <s:FormItem label="Format result:">
+                               <s:Label text="{nf.format(inputTI.text)}"/>
+                       </s:FormItem>
+               </s:Form>
+               
+       </s:Panel>
 </s:Application>

Modified: 
flex/site/trunk/content/tourdeflex/spark/i18n/SparkNumberFormatter2Example.swf
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/i18n/SparkNumberFormatter2Example.swf?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
Binary files - no diff available.

Modified: 
flex/site/trunk/content/tourdeflex/spark/i18n/SparkNumberFormatterExample.mxml
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/i18n/SparkNumberFormatterExample.mxml?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
--- 
flex/site/trunk/content/tourdeflex/spark/i18n/SparkNumberFormatterExample.mxml 
(original)
+++ 
flex/site/trunk/content/tourdeflex/spark/i18n/SparkNumberFormatterExample.mxml 
Sat Nov 29 07:19:59 2014
@@ -21,23 +21,6 @@
                           xmlns:s="library://ns.adobe.com/flex/spark"
                           xmlns:mx="library://ns.adobe.com/flex/mx"
                           width="100%" height="100%">
-       <fx:Style>
-               @namespace s "library://ns.adobe.com/flex/spark";
-               @namespace mx "library://ns.adobe.com/flex/mx";
-               s|Label {
-                       color: #FFFFFF;
-                       font-weight: bold;
-               }
-               #titleL {
-                       font-size: 20;
-               }
-               s|ComboBox {
-                       alternating-item-colors: #424242;
-               }
-               s|Form {
-                       background-color: #424242;
-               }
-       </fx:Style>
        
        <fx:Script>
                <![CDATA[
@@ -49,49 +32,48 @@
                        private var groupPatternArrColl:ArrayCollection = new 
ArrayCollection(['3;*', '1;*', '3;2;*', '3;2;1;*','2;1']);
                ]]>
        </fx:Script>
+
        <fx:Declarations>
-               <!-- Place non-visual elements (e.g., services, value objects) 
here -->
                <s:NumberFormatter id="nf"  locale="{localeCB.selectedItem}"/>
                <s:NumberFormatter id="nf_default" 
locale="{localeCB.selectedItem}"/>
        </fx:Declarations>
-       <s:layout>
-               <s:VerticalLayout/>
-       </s:layout>
-       <s:Scroller id="scroller" width="100%" height="100%">
-               <s:Group>
-                       <s:Form>
-                               <s:Label id="titleL" text="Spark 
NumberFormatter"/>
-                               <s:Label text="Select a locale to see the 
property value and formatted Number: "/>
-                               <s:Spacer height="15"/>
-                               
-                               <s:FormItem label="Locale:">
-                                       <s:ComboBox id="localeCB" 
dataProvider="{locales}" selectedIndex="0"/>
-                               </s:FormItem>
-                               <s:FormItem label="Input a number to format:">
-                                       <s:TextInput id="inputTI" text="12345"/>
-                               </s:FormItem>
-                               <s:FormItem label="Fraction Digits: (default: 
{nf_default.fractionalDigits})">
-                                       <s:NumericStepper id="fdNS" 
maximum="10" minimum="0" change="nf.fractionalDigits = fdNS.value"/>
-                               </s:FormItem>
-                               <s:FormItem label="Decimal Separator: (default: 
{nf_default.decimalSeparator})">
-                                       <s:TextInput id="dsTI" 
change="nf.decimalSeparator = dsTI.text"/>
-                               </s:FormItem>
-                               <s:FormItem label="Grouping Pattern: (default: 
{nf_default.groupingPattern})">
-                                       <s:ComboBox id="gpCB" 
dataProvider="{groupPatternArrColl}" change="nf.groupingPattern = 
gpCB.selectedItem"/>
-                               </s:FormItem>
-                               <s:FormItem label="Grouping Separator: 
(default: {nf_default.groupingSeparator})">
-                                       <s:TextInput id="gsTI" 
change="nf.groupingSeparator = gsTI.text"/>
-                               </s:FormItem>
-                               <s:FormItem label="Negative Number Format: 
(default: {nf_default.negativeNumberFormat})">
-                                       <s:NumericStepper id="ncfNS" 
minimum="0" maximum="4" change="nf.negativeNumberFormat = ncfNS.value"/>
-                               </s:FormItem>
-                               <s:Label 
text="==================================================================="/>
-                               <s:FormItem label="Formatted Number is:">
-                                       <s:Label id="resultL" 
text="{nf.format(inputTI.text)}"/>
-                               </s:FormItem>
-                       </s:Form>
-               </s:Group>
-       </s:Scroller>
-       
-       
+
+       <s:Panel title="Spark NumberFormatter" width="100%" height="100%">
+
+               <s:layout>
+                       <s:HorizontalLayout paddingLeft="10" paddingRight="10" 
paddingTop="10" paddingBottom="10" />
+               </s:layout>
+               
+               <s:Form height="100%" width="100%">
+                       <s:Label text="Select a locale to see the property 
value and formatted Number: "/>
+                       <s:Spacer height="15"/>
+                       
+                       <s:FormItem label="Locale:">
+                               <s:ComboBox id="localeCB" 
dataProvider="{locales}" selectedIndex="0"/>
+                       </s:FormItem>
+                       <s:FormItem label="Input a number to format:">
+                               <s:TextInput id="inputTI" text="12345"/>
+                       </s:FormItem>
+                       <s:FormItem label="Fraction Digits: (default: 
{nf_default.fractionalDigits})">
+                               <s:NumericStepper id="fdNS" maximum="10" 
minimum="0" change="nf.fractionalDigits = fdNS.value"/>
+                       </s:FormItem>
+                       <s:FormItem label="Decimal Separator: (default: 
{nf_default.decimalSeparator})">
+                               <s:TextInput id="dsTI" 
change="nf.decimalSeparator = dsTI.text"/>
+                       </s:FormItem>
+                       <s:FormItem label="Grouping Pattern: (default: 
{nf_default.groupingPattern})">
+                               <s:ComboBox id="gpCB" 
dataProvider="{groupPatternArrColl}" change="nf.groupingPattern = 
gpCB.selectedItem"/>
+                       </s:FormItem>
+                       <s:FormItem label="Grouping Separator: (default: 
{nf_default.groupingSeparator})">
+                               <s:TextInput id="gsTI" 
change="nf.groupingSeparator = gsTI.text"/>
+                       </s:FormItem>
+                       <s:FormItem label="Negative Number Format: (default: 
{nf_default.negativeNumberFormat})">
+                               <s:NumericStepper id="ncfNS" minimum="0" 
maximum="4" change="nf.negativeNumberFormat = ncfNS.value"/>
+                       </s:FormItem>
+                       <s:Label 
text="==================================================================="/>
+                       <s:FormItem label="Formatted Number is:">
+                               <s:Label id="resultL" 
text="{nf.format(inputTI.text)}"/>
+                       </s:FormItem>
+               </s:Form>
+               
+       </s:Panel>
 </s:Application>

Modified: 
flex/site/trunk/content/tourdeflex/spark/i18n/SparkNumberFormatterExample.swf
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/i18n/SparkNumberFormatterExample.swf?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
Binary files - no diff available.

Modified: 
flex/site/trunk/content/tourdeflex/spark/i18n/SparkNumberValidator2Example.mxml
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/i18n/SparkNumberValidator2Example.mxml?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
--- 
flex/site/trunk/content/tourdeflex/spark/i18n/SparkNumberValidator2Example.mxml 
(original)
+++ 
flex/site/trunk/content/tourdeflex/spark/i18n/SparkNumberValidator2Example.mxml 
Sat Nov 29 07:19:59 2014
@@ -21,24 +21,6 @@
                           xmlns:s="library://ns.adobe.com/flex/spark"
                           xmlns:mx="library://ns.adobe.com/flex/mx"
                           width="100%" height="100%">
-       <fx:Style>
-               @namespace s "library://ns.adobe.com/flex/spark";
-               @namespace mx "library://ns.adobe.com/flex/mx";
-               s|Label {
-                       color: #FFFFFF;
-                       font-weight: bold;
-               }
-               #titleL {
-                       font-size: 20;
-               }
-               s|ComboBox {
-                       alternating-item-colors: #424242;
-               }
-               
-               s|Form {
-                       background-color: #424242;
-               }
-       </fx:Style>
        <fx:Script>
                <![CDATA[
                        import mx.collections.ArrayCollection;
@@ -47,24 +29,28 @@
                        private var locales:ArrayCollection = new 
ArrayCollection(['en-US','de-DE','ja-JP','ru-RU','ar-SA','zh-CN','fr-FR']);
                ]]>
        </fx:Script>
+       
        <fx:Declarations>
-               <!-- Place non-visual elements (e.g., services, value objects) 
here -->
                <s:NumberValidator id="nv" source="{inputTI}" property="text" 
                                                   minValue="100" domain="int" 
locale="{localeCB.selectedItem}"/>
        </fx:Declarations>
-       <s:Scroller width="100%" height="100%">
-               <s:Group>
-                       <s:Form>
-                               <s:Label id="titleL" text="Spark 
NumberValidator"/>
-                               <s:Label text="Validate a number by using Spark 
NumberValidator"/>
-                               <s:Spacer height="15"/>
-                               <s:FormItem label="Locale:">
-                                       <s:ComboBox id="localeCB" 
dataProvider="{locales}" selectedIndex="0"/>
-                               </s:FormItem>
-                               <s:FormItem label="Enter a number to validate:">
-                                       <s:TextInput id="inputTI" toolTip="The 
number should be an integer which greater than 100."/>
-                               </s:FormItem>
-                       </s:Form>
-               </s:Group>
-       </s:Scroller>
+
+       <s:Panel title="Spark NumberValidator" width="100%" height="100%">
+
+               <s:layout>
+                       <s:HorizontalLayout paddingLeft="10" paddingRight="10" 
paddingTop="10" paddingBottom="10" />
+               </s:layout>
+               
+               <s:Form height="100%" width="100%">
+                       <s:Label text="Validate a number by using Spark 
NumberValidator"/>
+                       <s:Spacer height="15"/>
+                       <s:FormItem label="Locale:">
+                               <s:ComboBox id="localeCB" 
dataProvider="{locales}" selectedIndex="0"/>
+                       </s:FormItem>
+                       <s:FormItem label="Enter a number to validate:">
+                               <s:TextInput id="inputTI" toolTip="The number 
should be an integer which greater than 100."/>
+                       </s:FormItem>
+               </s:Form>
+
+       </s:Panel>
 </s:Application>

Modified: 
flex/site/trunk/content/tourdeflex/spark/i18n/SparkNumberValidator2Example.swf
URL: 
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/i18n/SparkNumberValidator2Example.swf?rev=1642397&r1=1642396&r2=1642397&view=diff
==============================================================================
Binary files - no diff available.


Reply via email to