Repository: flex-examples
Updated Branches:
  refs/heads/master 62d3d7e29 -> 39062eb09


http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/UIViews/RadiobuttonView.mxml
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/UIViews/RadiobuttonView.mxml 
b/tourdeflexmobile/src/UIViews/RadiobuttonView.mxml
index 47d1804..0297cf9 100644
--- a/tourdeflexmobile/src/UIViews/RadiobuttonView.mxml
+++ b/tourdeflexmobile/src/UIViews/RadiobuttonView.mxml
@@ -40,8 +40,16 @@ limitations under the License.
        </fx:Script>
        
        <fx:Declarations>
-               <s:MultiDPIBitmapSource id="aboutIcon" 
source160dpi="@Embed('assets/icons/160/about.png')" 
source240dpi="@Embed('assets/icons/240/about.png')" 
source320dpi="@Embed('assets/icons/320/about.png')"/>
-               <s:MultiDPIBitmapSource id="demoIcon" 
source160dpi="@Embed('assets/icons/160/dock.png')" 
source240dpi="@Embed('assets/icons/240/dock.png')" 
source320dpi="@Embed('assets/icons/320/dock.png')"/>
+               <s:MultiDPIBitmapSource id="aboutIcon" 
+                                                               
source160dpi="@Embed('assets/icons/160/about.png')" 
+                                                               
source240dpi="@Embed('assets/icons/240/about.png')" 
+                                                               
source320dpi="@Embed('assets/icons/320/about.png')" 
+                                                               
source480dpi="assets/icons/480/about.png"/>
+               <s:MultiDPIBitmapSource id="demoIcon" 
+                                                               
source160dpi="@Embed('assets/icons/160/dock.png')" 
+                                                               
source240dpi="@Embed('assets/icons/240/dock.png')" 
+                                                               
source320dpi="@Embed('assets/icons/320/dock.png')" 
+                                                               
source480dpi="assets/icons/480/dock.png"/>
 
                <s:RadioButtonGroup id="radiogroup1"/>
        </fx:Declarations>
@@ -51,7 +59,13 @@ limitations under the License.
                <s:State name="InfoState"/>
        </s:states>
 
-       <s:VGroup includeIn="DemoState" horizontalCenter="0" y="20">
+       <s:Rect left="10" right="10" top="10" bottom="10" radiusX="5" 
radiusY="5">
+               <s:fill>
+                       <s:SolidColor color="#FFFFFF"/>
+               </s:fill>
+       </s:Rect>
+       
+       <s:VGroup includeIn="DemoState" horizontalCenter="0" verticalCenter="0">
                <s:RadioButton change="radiobuttonHandler(event)" 
label="RadioButton 1" groupName="radiogroup1"/>
                <s:RadioButton change="radiobuttonHandler(event)" 
label="RadioButton 2" groupName="radiogroup1"/>
                <s:RadioButton change="radiobuttonHandler(event)" 
label="RadioButton 3" groupName="radiogroup1"/>
@@ -64,6 +78,16 @@ limitations under the License.
                                                                                
                                                                  
                                &#xd;&#xd; To use this component in a 
list-based component, such as a List or DataGrid, create an item renderer. For 
information about creating an item renderer, see Custom Spark item renderers."/>
        
+       <s:navigationContent>
+               <s:Button click="navigator.popView()">
+                       <s:icon>
+                               <s:MultiDPIBitmapSource 
source160dpi="@Embed('assets/icons/160/1_navigation_previous_item.png')"
+                                                                               
source240dpi="@Embed('assets/icons/240/1_navigation_previous_item.png')"
+                                                                               
source320dpi="@Embed('assets/icons/320/1_navigation_previous_item.png')"/>
+                       </s:icon>
+               </s:Button>
+       </s:navigationContent>
+       
        <s:actionContent>
                <s:Button click="buttonHandler(event)" 
icon.DemoState="{aboutIcon}" icon.InfoState="{demoIcon}"/>
        </s:actionContent>

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/UIViews/SpinnerListView.mxml
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/UIViews/SpinnerListView.mxml 
b/tourdeflexmobile/src/UIViews/SpinnerListView.mxml
index c94f59b..9bf6ed7 100644
--- a/tourdeflexmobile/src/UIViews/SpinnerListView.mxml
+++ b/tourdeflexmobile/src/UIViews/SpinnerListView.mxml
@@ -47,11 +47,25 @@ limitations under the License.
        </s:states>
        
        <fx:Declarations>
-               <s:MultiDPIBitmapSource id="aboutIcon" 
source160dpi="@Embed('assets/icons/160/about.png')" 
source240dpi="@Embed('assets/icons/240/about.png')" 
source320dpi="@Embed('assets/icons/320/about.png')"/>
-               <s:MultiDPIBitmapSource id="demoIcon" 
source160dpi="@Embed('assets/icons/160/dock.png')" 
source240dpi="@Embed('assets/icons/240/dock.png')" 
source320dpi="@Embed('assets/icons/320/dock.png')"/>
+               <s:MultiDPIBitmapSource id="aboutIcon" 
+                                                               
source160dpi="@Embed('assets/icons/160/about.png')" 
+                                                               
source240dpi="@Embed('assets/icons/240/about.png')" 
+                                                               
source320dpi="@Embed('assets/icons/320/about.png')" 
+                                                               
source480dpi="assets/icons/480/about.png"/>
+               <s:MultiDPIBitmapSource id="demoIcon" 
+                                                               
source160dpi="@Embed('assets/icons/160/dock.png')" 
+                                                               
source240dpi="@Embed('assets/icons/240/dock.png')" 
+                                                               
source320dpi="@Embed('assets/icons/320/dock.png')" 
+                                                               
source480dpi="assets/icons/480/dock.png"/>
        </fx:Declarations>
        
-       <s:SpinnerListContainer includeIn="DemoState" width="100%">
+       <s:Rect left="10" right="10" top="10" bottom="10" radiusX="5" 
radiusY="5">
+               <s:fill>
+                       <s:SolidColor color="#FFFFFF"/>
+               </s:fill>
+       </s:Rect>
+       
+       <s:SpinnerListContainer includeIn="DemoState" left="20" right="20" 
horizontalCenter="0" verticalCenter="0">
                <s:SpinnerList id="spinnerList1" 
change="spinnerListHandler(event)" width="50%" height="150">
                        <s:ArrayCollection>
                                <fx:Object label="Item A 1"/>
@@ -109,6 +123,16 @@ limitations under the License.
        <s:TextArea includeIn="InfoState" 
skinClass="spark.skins.mobile.TextAreaSkin" left="10" right="10" top="10" 
bottom="10" editable="false" text="The SpinnerList component displays a list of 
items. The item in the center of the list is always the selectedItem. By 
default, the list wraps around.
                                &#xd;&#xd;You can have multiple SpinnerList 
controls arranged horizontally within a single border by wrapping then in a 
SpinnerListContainer."/>
        
+       <s:navigationContent>
+               <s:Button click="navigator.popView()">
+                       <s:icon>
+                               <s:MultiDPIBitmapSource 
source160dpi="@Embed('assets/icons/160/1_navigation_previous_item.png')"
+                                                                               
source240dpi="@Embed('assets/icons/240/1_navigation_previous_item.png')"
+                                                                               
source320dpi="@Embed('assets/icons/320/1_navigation_previous_item.png')"/>
+                       </s:icon>
+               </s:Button>
+       </s:navigationContent>
+       
        <s:actionContent>
                <s:Button click="buttonHandler(event)" 
icon.DemoState="{aboutIcon}" icon.InfoState="{demoIcon}"/>
        </s:actionContent>

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/UIViews/TextInputView.mxml
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/UIViews/TextInputView.mxml 
b/tourdeflexmobile/src/UIViews/TextInputView.mxml
index 8a765c8..1adae31 100644
--- a/tourdeflexmobile/src/UIViews/TextInputView.mxml
+++ b/tourdeflexmobile/src/UIViews/TextInputView.mxml
@@ -48,13 +48,27 @@ limitations under the License.
        </s:states>
        
        <fx:Declarations>
-               <s:MultiDPIBitmapSource id="aboutIcon" 
source160dpi="@Embed('assets/icons/160/about.png')" 
source240dpi="@Embed('assets/icons/240/about.png')" 
source320dpi="@Embed('assets/icons/320/about.png')"/>
-               <s:MultiDPIBitmapSource id="demoIcon" 
source160dpi="@Embed('assets/icons/160/dock.png')" 
source240dpi="@Embed('assets/icons/240/dock.png')" 
source320dpi="@Embed('assets/icons/320/dock.png')"/>
+               <s:MultiDPIBitmapSource id="aboutIcon" 
+                                                               
source160dpi="@Embed('assets/icons/160/about.png')" 
+                                                               
source240dpi="@Embed('assets/icons/240/about.png')" 
+                                                               
source320dpi="@Embed('assets/icons/320/about.png')" 
+                                                               
source480dpi="assets/icons/480/about.png"/>
+               <s:MultiDPIBitmapSource id="demoIcon" 
+                                                               
source160dpi="@Embed('assets/icons/160/dock.png')" 
+                                                               
source240dpi="@Embed('assets/icons/240/dock.png')" 
+                                                               
source320dpi="@Embed('assets/icons/320/dock.png')" 
+                                                               
source480dpi="assets/icons/480/dock.png"/>
        </fx:Declarations>
        
-       <s:TextInput includeIn="DemoState" id="textInput" 
skinClass="spark.skins.mobile.TextInputSkin" prompt="Type Here and Tap Enter" 
left="5" right="5" top="5" height="40" enter="submitText()" />
+       <s:Rect left="10" right="10" top="10" bottom="10" radiusX="5" 
radiusY="5">
+               <s:fill>
+                       <s:SolidColor color="#FFFFFF"/>
+               </s:fill>
+       </s:Rect>
        
-       <s:Label includeIn="DemoState" id="label" horizontalCenter="0" y="60" 
textAlign="center"/>
+       <s:TextInput includeIn="DemoState" id="textInput" 
skinClass="spark.skins.mobile.TextInputSkin" prompt="Type Here and Tap Enter" 
left="10" right="10" top="10" height="40" enter="submitText()" />
+       
+       <s:Label includeIn="DemoState" id="label" horizontalCenter="0" y="70" 
textAlign="center"/>
        
        <s:TextArea includeIn="InfoState" 
skinClass="spark.skins.mobile.TextAreaSkin" left="10" right="10" top="10" 
bottom="10" editable="false" text="TextInput is a text-entry control that lets 
users enter and edit a single line of uniformly-formatted text.
                                &#xd; &#xd;The TextInput skin for the Spark 
theme uses the RichEditableText class. This means that the Spark TextInput 
control supports the Text Layout Framework (TLF) library, which builds on the 
Flash Text Engine (FTE). In combination, these layers provide text editing with 
high-quality international typography and layout.
@@ -81,6 +95,16 @@ limitations under the License.
                                                                                
                                                                                
                                                                                
                                                                                
                                                                                
                                                                                
                                                                                
                                                                                
                                                                                
                                                                                
                                                                                
                                                                                
                                                                                
         
                                &#xd; &#xd;To use this component in a 
list-based component, such as a List or DataGrid, create an item renderer. For 
information about creating an item renderer, see Custom Spark item renderers."/>
        
+       <s:navigationContent>
+               <s:Button click="navigator.popView()">
+                       <s:icon>
+                               <s:MultiDPIBitmapSource 
source160dpi="@Embed('assets/icons/160/1_navigation_previous_item.png')"
+                                                                               
source240dpi="@Embed('assets/icons/240/1_navigation_previous_item.png')"
+                                                                               
source320dpi="@Embed('assets/icons/320/1_navigation_previous_item.png')"/>
+                       </s:icon>
+               </s:Button>
+       </s:navigationContent>
+       
        <s:actionContent>
                <s:Button click="buttonHandler(event)" 
icon.DemoState="{aboutIcon}" icon.InfoState="{demoIcon}"/>
        </s:actionContent>

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/UIViews/ToggleSwitchView.mxml
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/UIViews/ToggleSwitchView.mxml 
b/tourdeflexmobile/src/UIViews/ToggleSwitchView.mxml
index 5309a75..fb30f37 100644
--- a/tourdeflexmobile/src/UIViews/ToggleSwitchView.mxml
+++ b/tourdeflexmobile/src/UIViews/ToggleSwitchView.mxml
@@ -41,17 +41,41 @@ limitations under the License.
        </s:states>
        
        <fx:Declarations>
-               <s:MultiDPIBitmapSource id="aboutIcon" 
source160dpi="@Embed('assets/icons/160/about.png')" 
source240dpi="@Embed('assets/icons/240/about.png')" 
source320dpi="@Embed('assets/icons/320/about.png')"/>
-               <s:MultiDPIBitmapSource id="demoIcon" 
source160dpi="@Embed('assets/icons/160/dock.png')" 
source240dpi="@Embed('assets/icons/240/dock.png')" 
source320dpi="@Embed('assets/icons/320/dock.png')"/>
+               <s:MultiDPIBitmapSource id="aboutIcon" 
+                                                               
source160dpi="@Embed('assets/icons/160/about.png')" 
+                                                               
source240dpi="@Embed('assets/icons/240/about.png')" 
+                                                               
source320dpi="@Embed('assets/icons/320/about.png')" 
+                                                               
source480dpi="assets/icons/480/about.png"/>
+               <s:MultiDPIBitmapSource id="demoIcon" 
+                                                               
source160dpi="@Embed('assets/icons/160/dock.png')" 
+                                                               
source240dpi="@Embed('assets/icons/240/dock.png')" 
+                                                               
source320dpi="@Embed('assets/icons/320/dock.png')" 
+                                                               
source480dpi="assets/icons/480/dock.png"/>
        </fx:Declarations>
        
-       <s:ToggleSwitch includeIn="DemoState" horizontalCenter="0" y="20" />
+       <s:Rect left="10" right="10" top="10" bottom="10" radiusX="5" 
radiusY="5">
+               <s:fill>
+                       <s:SolidColor color="#FFFFFF"/>
+               </s:fill>
+       </s:Rect>
+       
+       <s:ToggleSwitch includeIn="DemoState" horizontalCenter="0" 
verticalCenter="0" />
        
        <s:TextArea includeIn="InfoState" 
skinClass="spark.skins.mobile.TextAreaSkin" left="10" right="10" top="10" 
bottom="10" editable="false" text="The Spark ToggleSwitch control defines a 
binary switch that can be in the selected or unselected position. The 
ToggleSwitch consists of a thumb skin part that moves between the two ends of 
the track skin part, similar to the Spark Slider control.
                                The ToggleSwitch control has two positions: 
selected and unselected. By default, the label OFF corresponds to the 
unselected position and ON corresponds to the selected position.
                                &#xd; &#xd;Clicking anywhere in the control 
toggles the position. You can also slide the thumb along the track to change 
position. When you release the thumb, it moves to the position, selected or 
unselected, that is closest to the thumb location.
                                &#xd; &#xd;The ToggleSwitch control uses the 
following default values for the unselected and selected labels: OFF 
(unselected) and ON (selected). Define a custom skin to change the labels, or 
to change other visual characteristics of the control."/>
                                
+       <s:navigationContent>
+               <s:Button click="navigator.popView()">
+                       <s:icon>
+                               <s:MultiDPIBitmapSource 
source160dpi="@Embed('assets/icons/160/1_navigation_previous_item.png')"
+                                                                               
source240dpi="@Embed('assets/icons/240/1_navigation_previous_item.png')"
+                                                                               
source320dpi="@Embed('assets/icons/320/1_navigation_previous_item.png')"/>
+                       </s:icon>
+               </s:Button>
+       </s:navigationContent>
+       
        <s:actionContent>
                <s:Button click="buttonHandler(event)" 
icon.DemoState="{aboutIcon}" icon.InfoState="{demoIcon}"/>
        </s:actionContent>

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/assets/appicons/144.png
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/assets/appicons/144.png 
b/tourdeflexmobile/src/assets/appicons/144.png
new file mode 100644
index 0000000..4af316d
Binary files /dev/null and b/tourdeflexmobile/src/assets/appicons/144.png differ

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/assets/appicons/192.png
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/assets/appicons/192.png 
b/tourdeflexmobile/src/assets/appicons/192.png
new file mode 100644
index 0000000..f3b93c4
Binary files /dev/null and b/tourdeflexmobile/src/assets/appicons/192.png differ

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/assets/appicons/36.png
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/assets/appicons/36.png 
b/tourdeflexmobile/src/assets/appicons/36.png
new file mode 100644
index 0000000..d73311a
Binary files /dev/null and b/tourdeflexmobile/src/assets/appicons/36.png differ

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/assets/appicons/48.png
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/assets/appicons/48.png 
b/tourdeflexmobile/src/assets/appicons/48.png
new file mode 100644
index 0000000..a7c64e7
Binary files /dev/null and b/tourdeflexmobile/src/assets/appicons/48.png differ

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/assets/appicons/72.png
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/assets/appicons/72.png 
b/tourdeflexmobile/src/assets/appicons/72.png
new file mode 100644
index 0000000..e5abaad
Binary files /dev/null and b/tourdeflexmobile/src/assets/appicons/72.png differ

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/assets/appicons/96.png
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/assets/appicons/96.png 
b/tourdeflexmobile/src/assets/appicons/96.png
new file mode 100644
index 0000000..2f25b97
Binary files /dev/null and b/tourdeflexmobile/src/assets/appicons/96.png differ

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/assets/icons/160/1_navigation_next_item.png
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/assets/icons/160/1_navigation_next_item.png 
b/tourdeflexmobile/src/assets/icons/160/1_navigation_next_item.png
new file mode 100755
index 0000000..88029a8
Binary files /dev/null and 
b/tourdeflexmobile/src/assets/icons/160/1_navigation_next_item.png differ

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/assets/icons/160/1_navigation_previous_item.png
----------------------------------------------------------------------
diff --git 
a/tourdeflexmobile/src/assets/icons/160/1_navigation_previous_item.png 
b/tourdeflexmobile/src/assets/icons/160/1_navigation_previous_item.png
new file mode 100755
index 0000000..b8b3e1a
Binary files /dev/null and 
b/tourdeflexmobile/src/assets/icons/160/1_navigation_previous_item.png differ

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/assets/icons/240/1_navigation_next_item.png
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/assets/icons/240/1_navigation_next_item.png 
b/tourdeflexmobile/src/assets/icons/240/1_navigation_next_item.png
new file mode 100755
index 0000000..e6495b2
Binary files /dev/null and 
b/tourdeflexmobile/src/assets/icons/240/1_navigation_next_item.png differ

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/assets/icons/240/1_navigation_previous_item.png
----------------------------------------------------------------------
diff --git 
a/tourdeflexmobile/src/assets/icons/240/1_navigation_previous_item.png 
b/tourdeflexmobile/src/assets/icons/240/1_navigation_previous_item.png
new file mode 100755
index 0000000..64538ce
Binary files /dev/null and 
b/tourdeflexmobile/src/assets/icons/240/1_navigation_previous_item.png differ

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/assets/icons/320/1_navigation_next_item.png
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/assets/icons/320/1_navigation_next_item.png 
b/tourdeflexmobile/src/assets/icons/320/1_navigation_next_item.png
new file mode 100755
index 0000000..c36e050
Binary files /dev/null and 
b/tourdeflexmobile/src/assets/icons/320/1_navigation_next_item.png differ

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/assets/icons/320/1_navigation_previous_item.png
----------------------------------------------------------------------
diff --git 
a/tourdeflexmobile/src/assets/icons/320/1_navigation_previous_item.png 
b/tourdeflexmobile/src/assets/icons/320/1_navigation_previous_item.png
new file mode 100755
index 0000000..e97e910
Binary files /dev/null and 
b/tourdeflexmobile/src/assets/icons/320/1_navigation_previous_item.png differ

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/assets/icons/480/1.png
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/assets/icons/480/1.png 
b/tourdeflexmobile/src/assets/icons/480/1.png
new file mode 100644
index 0000000..e7a778d
Binary files /dev/null and b/tourdeflexmobile/src/assets/icons/480/1.png differ

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/assets/icons/480/2.png
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/assets/icons/480/2.png 
b/tourdeflexmobile/src/assets/icons/480/2.png
new file mode 100644
index 0000000..84d2f95
Binary files /dev/null and b/tourdeflexmobile/src/assets/icons/480/2.png differ

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/assets/icons/480/3.png
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/assets/icons/480/3.png 
b/tourdeflexmobile/src/assets/icons/480/3.png
new file mode 100644
index 0000000..39dcfd0
Binary files /dev/null and b/tourdeflexmobile/src/assets/icons/480/3.png differ

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/assets/icons/480/about.png
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/assets/icons/480/about.png 
b/tourdeflexmobile/src/assets/icons/480/about.png
new file mode 100644
index 0000000..0fe809b
Binary files /dev/null and b/tourdeflexmobile/src/assets/icons/480/about.png 
differ

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/assets/icons/480/add.png
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/assets/icons/480/add.png 
b/tourdeflexmobile/src/assets/icons/480/add.png
new file mode 100644
index 0000000..c0cd3d9
Binary files /dev/null and b/tourdeflexmobile/src/assets/icons/480/add.png 
differ

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/assets/icons/480/dock.png
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/assets/icons/480/dock.png 
b/tourdeflexmobile/src/assets/icons/480/dock.png
new file mode 100644
index 0000000..14a1e3e
Binary files /dev/null and b/tourdeflexmobile/src/assets/icons/480/dock.png 
differ

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/assets/icons/480/icon.png
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/assets/icons/480/icon.png 
b/tourdeflexmobile/src/assets/icons/480/icon.png
new file mode 100644
index 0000000..d5f63ca
Binary files /dev/null and b/tourdeflexmobile/src/assets/icons/480/icon.png 
differ

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/assets/icons/480/icon1.png
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/assets/icons/480/icon1.png 
b/tourdeflexmobile/src/assets/icons/480/icon1.png
new file mode 100644
index 0000000..44ade7a
Binary files /dev/null and b/tourdeflexmobile/src/assets/icons/480/icon1.png 
differ

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/assets/icons/book.png
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/assets/icons/book.png 
b/tourdeflexmobile/src/assets/icons/book.png
new file mode 100644
index 0000000..a54a3e7
Binary files /dev/null and b/tourdeflexmobile/src/assets/icons/book.png differ

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/assets/icons/briefcase.png
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/assets/icons/briefcase.png 
b/tourdeflexmobile/src/assets/icons/briefcase.png
new file mode 100644
index 0000000..83f646f
Binary files /dev/null and b/tourdeflexmobile/src/assets/icons/briefcase.png 
differ

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/assets/icons/bug.png
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/assets/icons/bug.png 
b/tourdeflexmobile/src/assets/icons/bug.png
new file mode 100644
index 0000000..f9e99e0
Binary files /dev/null and b/tourdeflexmobile/src/assets/icons/bug.png differ

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/assets/icons/envelope-closed.png
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/assets/icons/envelope-closed.png 
b/tourdeflexmobile/src/assets/icons/envelope-closed.png
new file mode 100644
index 0000000..85eef0c
Binary files /dev/null and 
b/tourdeflexmobile/src/assets/icons/envelope-closed.png differ

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/assets/icons/people.png
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/assets/icons/people.png 
b/tourdeflexmobile/src/assets/icons/people.png
new file mode 100644
index 0000000..ebdafe2
Binary files /dev/null and b/tourdeflexmobile/src/assets/icons/people.png differ

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/assets/icons/phone.png
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/assets/icons/phone.png 
b/tourdeflexmobile/src/assets/icons/phone.png
new file mode 100644
index 0000000..19098e5
Binary files /dev/null and b/tourdeflexmobile/src/assets/icons/phone.png differ

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/assets/icons/puzzle-piece.png
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/assets/icons/puzzle-piece.png 
b/tourdeflexmobile/src/assets/icons/puzzle-piece.png
new file mode 100644
index 0000000..be6d6f0
Binary files /dev/null and b/tourdeflexmobile/src/assets/icons/puzzle-piece.png 
differ

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/assets/icons/rss.png
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/assets/icons/rss.png 
b/tourdeflexmobile/src/assets/icons/rss.png
new file mode 100644
index 0000000..58799a5
Binary files /dev/null and b/tourdeflexmobile/src/assets/icons/rss.png differ

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/assets/icons/video.png
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/assets/icons/video.png 
b/tourdeflexmobile/src/assets/icons/video.png
new file mode 100644
index 0000000..d912be2
Binary files /dev/null and b/tourdeflexmobile/src/assets/icons/video.png differ

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/assets/icons/wrench.png
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/assets/icons/wrench.png 
b/tourdeflexmobile/src/assets/icons/wrench.png
new file mode 100644
index 0000000..19c7634
Binary files /dev/null and b/tourdeflexmobile/src/assets/icons/wrench.png differ

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/assets/images/logo.png
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/assets/images/logo.png 
b/tourdeflexmobile/src/assets/images/logo.png
index 0278b81..d7b87cf 100644
Binary files a/tourdeflexmobile/src/assets/images/logo.png and 
b/tourdeflexmobile/src/assets/images/logo.png differ

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/assets/images/logo_big.png
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/assets/images/logo_big.png 
b/tourdeflexmobile/src/assets/images/logo_big.png
new file mode 100644
index 0000000..e38cc07
Binary files /dev/null and b/tourdeflexmobile/src/assets/images/logo_big.png 
differ

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/assets/images/splash.png
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/assets/images/splash.png 
b/tourdeflexmobile/src/assets/images/splash.png
new file mode 100644
index 0000000..6d27cd4
Binary files /dev/null and b/tourdeflexmobile/src/assets/images/splash.png 
differ

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/assets/terminal-grotesque.ttf
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/assets/terminal-grotesque.ttf 
b/tourdeflexmobile/src/assets/terminal-grotesque.ttf
new file mode 100644
index 0000000..3786710
Binary files /dev/null and b/tourdeflexmobile/src/assets/terminal-grotesque.ttf 
differ

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/renderers/MenuRenderer.mxml
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/renderers/MenuRenderer.mxml 
b/tourdeflexmobile/src/renderers/MenuRenderer.mxml
index 6b79d77..62752de 100644
--- a/tourdeflexmobile/src/renderers/MenuRenderer.mxml
+++ b/tourdeflexmobile/src/renderers/MenuRenderer.mxml
@@ -29,19 +29,8 @@ limitations under the License.
                                
                                if(data){
                                        
-                                       if(data.type == "view"){
-                                               autoDrawBackground = true;
-                                               currentState = "ViewState";     
        
-                                       } else if(data.type == "separator"){
-                                               autoDrawBackground = false;
-                                               opaqueBackground = 0x464646;
-                                               currentState = "SeparatorState";
-                                       } else {
-                                               autoDrawBackground = true;
-                                               currentState = "ViewState";     
-                                       }
-                                       
                                        itemLabel.text = data.label;
+                                       iconImg.source = String(data.icon);
                                        
                                }
                        }
@@ -49,11 +38,7 @@ limitations under the License.
                ]]>
        </fx:Script>
        
-       <s:states>
-               <s:State name="ViewState"/>
-               <s:State name="SeparatorState"/>
-       </s:states>
-       
-       <s:Label id="itemLabel"  color.SeparatorState="#888888" 
color.ViewState="#FFFFFF" x="10" verticalCenter="0"/>
+       <s:BitmapImage id="iconImg" verticalCenter="0" x="10" width="20" 
height="20" smooth="true"/>
+       <s:Label id="itemLabel" x="40" verticalCenter="0" 
styleName="pixelLabel"/>
        
 </s:ItemRenderer>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/renderers/ShowcaseImageRenderer.mxml
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/renderers/ShowcaseImageRenderer.mxml 
b/tourdeflexmobile/src/renderers/ShowcaseImageRenderer.mxml
new file mode 100644
index 0000000..1b2a807
--- /dev/null
+++ b/tourdeflexmobile/src/renderers/ShowcaseImageRenderer.mxml
@@ -0,0 +1,21 @@
+<?xml version="1.0" encoding="utf-8"?>
+<s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009"; 
+               xmlns:s="library://ns.adobe.com/flex/spark" 
autoDrawBackground="false" opaqueBackground="#D7DADD">
+       
+       <fx:Script>
+               <![CDATA[
+                       
+                       override public function set data(value:Object):void{
+                               super.data = value;
+                               
+                               if(data){                               
+                                       thumbnail.source = data;
+                               }
+                       }
+               ]]>
+       </fx:Script>
+       
+       
+       <s:BitmapImage id="thumbnail" width="100%" height="100%" smooth="true"/>
+       
+</s:ItemRenderer>

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/styles.css
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/styles.css b/tourdeflexmobile/src/styles.css
index 3459839..5cc7183 100644
--- a/tourdeflexmobile/src/styles.css
+++ b/tourdeflexmobile/src/styles.css
@@ -19,48 +19,53 @@
 /* CSS file */
 @namespace s "library://ns.adobe.com/flex/spark";
 
-
-s|ActionBar
+@font-face 
 {
-       chromeColor: #303030;
+       src: url("assets/terminal-grotesque.ttf");
+       fontFamily: PixelFont;
+       fontStyle: normal;
+       fontWeight: normal;
+       embedAsCFF: true;
+       advancedAntiAliasing: true;
+       
 }
 
-s|View
-{
-       backgroundColor: #464646;
+.pixelLabel{
+       color: #000000;
+       fontSize: 14px;
+       fontWeight: normal;
+       fontFamily: PixelFont;
 }
 
-s|Application
-{
-       backgroundColor: #464646;
+
+s|Application{
+       backgroundColor: #D7DADD;       
 }
 
-s|List
-{
-       alternatingItemColors: #303030;
-       selectionColor: #000000;
-       downColor: #FA5B0F;
-       contentBackgroundColor: #464646;
+s|View{
+       backgroundColor: #D7DADD;
+}
+
+s|ActionBar{
+       chromeColor: #000000;   
+}
+
+s|ActionBar #titleDisplay{
+       textAlign: left;
+       fontWeight: normal;
        color: #FFFFFF;
+       fontSize: 14px;
 }
 
+
 s|TextArea
 {
        color: #FFFFFF;
        contentBackgroundColor: #303030;
 }
 
-s|CheckBox
-{
-       color: #FFFFFF; 
-}
-
-s|RadioButton
-{
-       color: #FFFFFF; 
-}
 
 s|Label
 {
-       color: #FFFFFF;
+       color: #000000;
 }
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/views/ComponentsView.mxml
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/views/ComponentsView.mxml 
b/tourdeflexmobile/src/views/ComponentsView.mxml
new file mode 100644
index 0000000..8c35879
--- /dev/null
+++ b/tourdeflexmobile/src/views/ComponentsView.mxml
@@ -0,0 +1,79 @@
+<?xml version="1.0" encoding="utf-8"?>
+<s:View xmlns:fx="http://ns.adobe.com/mxml/2009"; 
+               xmlns:s="library://ns.adobe.com/flex/spark" title="Components">
+       <fx:Script>
+               <![CDATA[
+                               
+                       import UIViews.ActionBarView;
+                       import UIViews.ButtonBarView;
+                       import UIViews.BusyIndicatorView;
+                       import UIViews.CalloutButtonView;
+                       import UIViews.CheckboxView;
+                       import UIViews.DateSpinnerView;
+                       import UIViews.HscrubberView;
+                       import UIViews.ListView;
+                       import UIViews.MobileGridView;
+                       import UIViews.RadiobuttonView;
+                       import UIViews.SpinnerListView;
+                       import UIViews.TextInputView;
+                       import UIViews.ToggleSwitchView;
+                       
+                       import LayoutViews.HorizontalLayoutView;
+                       import LayoutViews.VerticalLayoutView;
+                       import LayoutViews.TileLayoutView;
+                       
+                       import AIRViews.AccelerometerView;
+                       import AIRViews.CameraRollView;
+                       import AIRViews.CameraUIView;
+                       import AIRViews.GeolocationView;
+                       import AIRViews.NativeAppView;
+                       import AIRViews.SQLiteView;
+                       
+                       protected function listHandler(event:MouseEvent):void
+                       {
+                               
navigator.pushView(componentsList.selectedItem.view);
+                       }
+                       
+               ]]>
+       </fx:Script>
+       
+       <s:List id="componentsList" width="100%" height="100%" 
click="listHandler(event)">
+               <s:dataProvider>
+                       <s:ArrayList>
+                               <fx:Object label="ActionBar" 
view="{ActionBarView}"/>
+                               <fx:Object label="ButtonBar" 
view="{ButtonBarView}"/>
+                               <fx:Object label="BusyIndicator" 
view="{BusyIndicatorView}"/>
+                               <fx:Object label="CalloutButton" 
view="{CalloutButtonView}"/>
+                               <fx:Object label="Checkbox" 
view="{CheckboxView}"/>
+                               <fx:Object label="DateSpinner" 
view="{DateSpinnerView}"/>
+                               <fx:Object label="HSlider" 
view="{HscrubberView}"/>
+                               <fx:Object label="List" view="{ListView}"/>
+                               <fx:Object label="MobileGrid" 
view="{MobileGridView}"/>
+                               <fx:Object label="RadioButton" 
view="{RadiobuttonView}"/>
+                               <fx:Object label="SpinnerList" 
view="{SpinnerListView}"/>
+                               <fx:Object label="TextInput" 
view="{TextInputView}"/>
+                               <fx:Object label="toggleSwitch" 
view="{ToggleSwitchView}"/>
+                               <fx:Object label="HorizontalLayout" 
view="{HorizontalLayoutView}"/>
+                               <fx:Object label="VerticalLayout" 
view="{VerticalLayoutView}"/>
+                               <fx:Object label="TileLayout" 
view="{TileLayoutView}"/>
+                               <fx:Object label="Accelerometer" 
view="{AccelerometerView}"/>
+                               <fx:Object label="CameraRoll" 
view="{CameraRollView}"/>
+                               <fx:Object label="CameraUI" 
view="{CameraUIView}"/>
+                               <fx:Object label="Geolocation" 
view="{GeolocationView}"/>
+                               <fx:Object label="NativeApp" 
view="{NativeAppView}"/>
+                               <fx:Object label="SQLite" view="{SQLiteView}"/>
+                       </s:ArrayList>
+               </s:dataProvider>
+               <s:itemRenderer>
+                       <fx:Component>
+                               <s:IconItemRenderer>
+                                       <s:decorator>
+                                               <s:MultiDPIBitmapSource 
source160dpi="@Embed('assets/icons/160/1_navigation_next_item.png')"
+                                                                               
                
source240dpi="@Embed('assets/icons/240/1_navigation_next_item.png')"
+                                                                               
                
source320dpi="@Embed('assets/icons/320/1_navigation_next_item.png')"/>
+                                       </s:decorator>
+                               </s:IconItemRenderer>
+                       </fx:Component>
+               </s:itemRenderer>
+       </s:List>
+</s:View>

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/views/HomeView.mxml
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/views/HomeView.mxml 
b/tourdeflexmobile/src/views/HomeView.mxml
new file mode 100644
index 0000000..955fea6
--- /dev/null
+++ b/tourdeflexmobile/src/views/HomeView.mxml
@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="utf-8"?>
+<s:View xmlns:fx="http://ns.adobe.com/mxml/2009"; 
+               xmlns:s="library://ns.adobe.com/flex/spark" title="" 
backgroundColor="#D7DADD">
+       
+       <s:Rect left="10" right="10" top="10" bottom="10" radiusX="5" 
radiusY="5">
+               <s:fill>
+                       <s:SolidColor color="#FFFFFF"/>
+               </s:fill>
+       </s:Rect>
+       
+       <s:Label horizontalCenter="0" verticalCenter="0" text="TO-DO" 
fontSize="40"/>   
+</s:View>

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/views/HttpServiceView.mxml
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/views/HttpServiceView.mxml 
b/tourdeflexmobile/src/views/HttpServiceView.mxml
index 373cd85..0583ebb 100644
--- a/tourdeflexmobile/src/views/HttpServiceView.mxml
+++ b/tourdeflexmobile/src/views/HttpServiceView.mxml
@@ -57,8 +57,16 @@ limitations under the License.
        </s:states>
        
        <fx:Declarations>
-               <s:MultiDPIBitmapSource id="aboutIcon" 
source160dpi="@Embed('assets/icons/160/about.png')" 
source240dpi="@Embed('assets/icons/240/about.png')" 
source320dpi="@Embed('assets/icons/320/about.png')"/>
-               <s:MultiDPIBitmapSource id="demoIcon" 
source160dpi="@Embed('assets/icons/160/dock.png')" 
source240dpi="@Embed('assets/icons/240/dock.png')" 
source320dpi="@Embed('assets/icons/320/dock.png')"/>
+               <s:MultiDPIBitmapSource id="aboutIcon" 
+                                                               
source160dpi="@Embed('assets/icons/160/about.png')" 
+                                                               
source240dpi="@Embed('assets/icons/240/about.png')" 
+                                                               
source320dpi="@Embed('assets/icons/320/about.png')" 
+                                                               
source480dpi="assets/icons/480/about.png"/>
+               <s:MultiDPIBitmapSource id="demoIcon" 
+                                                               
source160dpi="@Embed('assets/icons/160/dock.png')" 
+                                                               
source240dpi="@Embed('assets/icons/240/dock.png')" 
+                                                               
source320dpi="@Embed('assets/icons/320/dock.png')" 
+                                                               
source480dpi="assets/icons/480/dock.png"/>
                <s:HTTPService id="rssService" resultFormat="e4x" 
result="rssResult(event)"/>
        </fx:Declarations>
        

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/views/NewsDetailsView.mxml
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/views/NewsDetailsView.mxml 
b/tourdeflexmobile/src/views/NewsDetailsView.mxml
new file mode 100644
index 0000000..2c462fa
--- /dev/null
+++ b/tourdeflexmobile/src/views/NewsDetailsView.mxml
@@ -0,0 +1,66 @@
+<?xml version="1.0" encoding="utf-8"?>
+<s:View xmlns:fx="http://ns.adobe.com/mxml/2009";
+               xmlns:s="library://ns.adobe.com/flex/spark"
+               tabBarVisible="false" title="{data.title}" 
viewActivate="init(event)" viewDeactivate="goBack(event)" >
+       <fx:Script>
+               <![CDATA[
+                       import mx.core.FlexGlobals;
+                       import mx.events.FlexEvent;
+                       
+                       import spark.events.ViewNavigatorEvent;
+                       
+                       private var myStageWebView:StageWebView;                
+                       private var fontPercent:Number;
+                       private var currentFlexScalingFactor:Number = 
FlexGlobals.topLevelApplication.runtimeDPI/FlexGlobals.topLevelApplication.applicationDPI;
+                       
+                       protected function init(event:ViewNavigatorEvent):void
+                       {               
+                               
NativeApplication.nativeApplication.systemIdleMode = SystemIdleMode.KEEP_AWAKE;
+                               
+                               myStageWebView = new StageWebView(true);
+                               myStageWebView.viewPort = new 
Rectangle(myRect.x, 
myRect.y*currentFlexScalingFactor+FlexGlobals.topLevelApplication.navigator.actionBar.height*currentFlexScalingFactor,
 myRect.width*currentFlexScalingFactor, myRect.height*currentFlexScalingFactor);
+                               myStageWebView.stage = this.stage;
+                               
+                               myStageWebView.loadString("<html><head><style 
type='text/css'>"+
+                                       "body {background-color:#FFFFFF;}"+
+                                       "body {color:black;}"+
+                                       "body {padding:10px;}"+
+                                       "body 
{font-size:"+14*currentFlexScalingFactor+"px;}"+
+                                       "body {font-family:helvetica;}"+
+                                       "a:link {color:#000000;}"+
+                                       "a:visited {color:#000000;}"+  
+                                       "a:hover {color:#000000;}"+
+                                       "a:active {color:#000000;}"+
+                                       
"</style></head><body>"+data.description+"</body></html>");
+                               myRect.addEventListener(Event.RESIZE, resize);
+                       }
+                       
+                       protected function goBack(event:ViewNavigatorEvent):void
+                       {
+                               
NativeApplication.nativeApplication.systemIdleMode = SystemIdleMode.NORMAL;
+                               myStageWebView.dispose();
+                               myRect.removeEventListener(Event.RESIZE, 
resize);
+                       }
+                       
+                       protected function resize(event:Event):void
+                       {
+                               myStageWebView.viewPort = new 
Rectangle(myRect.x, 
myRect.y*currentFlexScalingFactor+FlexGlobals.topLevelApplication.navigator.actionBar.height*currentFlexScalingFactor,
 myRect.width*currentFlexScalingFactor, myRect.height*currentFlexScalingFactor);
+                       }
+                       
+               ]]>
+       </fx:Script>
+       
+       <s:navigationContent>
+               <s:Button click="navigator.popView()">
+                       <s:icon>
+                               <s:MultiDPIBitmapSource 
source160dpi="@Embed('assets/icons/160/1_navigation_previous_item.png')"
+                                                                               
source240dpi="@Embed('assets/icons/240/1_navigation_previous_item.png')"
+                                                                               
source320dpi="@Embed('assets/icons/320/1_navigation_previous_item.png')"/>
+                       </s:icon>
+               </s:Button>
+       </s:navigationContent>
+       
+       <s:Spacer id="myRect" left="10" right="10" top="10" bottom="10"/>
+       
+</s:View>
+

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/views/NewsView.mxml
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/views/NewsView.mxml 
b/tourdeflexmobile/src/views/NewsView.mxml
new file mode 100644
index 0000000..28ff52d
--- /dev/null
+++ b/tourdeflexmobile/src/views/NewsView.mxml
@@ -0,0 +1,75 @@
+<?xml version="1.0" encoding="utf-8"?>
+<s:View xmlns:fx="http://ns.adobe.com/mxml/2009"; 
+               xmlns:s="library://ns.adobe.com/flex/spark" title="News">
+       <fx:Script>
+               <![CDATA[
+                       import mx.collections.XMLListCollection;
+                       import mx.events.FlexEvent;
+                       import mx.rpc.events.ResultEvent;
+                       
+                       import spark.events.IndexChangeEvent;
+                                               
+                       protected function loadBlogNews(event:FlexEvent):void
+                       {
+                               blogService.url = 
"https://blogs.apache.org/flex/feed/entries/rss";;
+                               blogService.send();
+                       }
+                       
+                       protected function 
blogService_resultHandler(event:ResultEvent):void
+                       {
+                               newsList.dataProvider = new 
XMLListCollection(new XMLList(event.result.channel.item));
+                               newsList.labelField = "title";
+                       }
+                       
+                       protected function 
selectItem(event:IndexChangeEvent):void
+                       {
+                               navigator.pushView(NewsDetailsView, 
newsList.selectedItem);
+                       }
+                       
+               ]]>
+       </fx:Script>
+       
+       <fx:Declarations>
+               <s:HTTPService id="blogService" resultFormat="e4x" 
result="blogService_resultHandler(event)"/>
+       </fx:Declarations>
+       
+       <s:states>
+               <s:State name="BlogState" enterState="loadBlogNews(event)" />
+               <s:State name="TwitterState"/>
+       </s:states>
+       
+       <s:ButtonBar left="5" right="5" top="5" height="40" 
requireSelection="true" selectedIndex="0">
+               <s:ArrayList>
+                       <fx:Object label="Blog News"/>
+                       <fx:Object label="Twitter Feed"/>
+               </s:ArrayList>  
+       </s:ButtonBar>
+       
+       <s:List id="newsList" top="50" bottom="0" width="100%" 
change="selectItem(event)">
+               <s:itemRenderer>
+                       <fx:Component>
+                               <s:IconItemRenderer 
labelFunction="myLabelFunction" messageFunction="myMessageFunction">
+                                       <s:decorator>
+                                               <s:MultiDPIBitmapSource 
source160dpi="@Embed('assets/icons/160/1_navigation_next_item.png')"
+                                                                               
                
source240dpi="@Embed('assets/icons/240/1_navigation_next_item.png')"
+                                                                               
                
source320dpi="@Embed('assets/icons/320/1_navigation_next_item.png')"/>
+                                       </s:decorator>
+                                       
+                                       <fx:Script>
+                                               <![CDATA[
+                                                       
+                                                       private function 
myLabelFunction(item:Object):String{
+                                                               return 
unescape(data.title);
+                                                       }
+                                                       
+                                                       private function 
myMessageFunction(item:Object):String{
+                                                               return 
data.pubDate;
+                                                       }
+                                                       
+                                               ]]>
+                                       </fx:Script>
+                               </s:IconItemRenderer>
+                       </fx:Component>
+               </s:itemRenderer>
+       </s:List>
+</s:View>

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/views/ShowcaseDetails.mxml
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/views/ShowcaseDetails.mxml 
b/tourdeflexmobile/src/views/ShowcaseDetails.mxml
new file mode 100644
index 0000000..89643e9
--- /dev/null
+++ b/tourdeflexmobile/src/views/ShowcaseDetails.mxml
@@ -0,0 +1,68 @@
+<?xml version="1.0" encoding="utf-8"?>
+<s:View xmlns:fx="http://ns.adobe.com/mxml/2009"; 
+               xmlns:s="library://ns.adobe.com/flex/spark" title="Flex 
Showcase" viewActivate="init(event)" xmlns:renderers="renderers.*">
+       <fx:Script>
+               <![CDATA[
+                       import mx.collections.ArrayList;
+                       
+                       import spark.components.Label;
+                       import spark.events.ViewNavigatorEvent;
+                       
+                       private var imagesArray:Array;
+                       
+                       protected function init(event:ViewNavigatorEvent):void
+                       {
+                               titleTxt.text = data.@title;
+                               authorTxt.text = data.@author;
+                               
+                               if(data.@website){
+                                       websiteTxt.text = data.@website;
+                               } else {
+                                       //Do Nothing
+                               }
+                               
+                               descriptionTxt.text = data.description;
+                               imagesArray = new Array();
+                                                               
+                               for each (var image:* in data.images.image){
+                                       
imagesArray.push("http://flex.apache.org/showcase/images/"+data.images.@baseDir+"/prev/"+image.@file);
+                               }
+                               
+                               thumbnailList.dataProvider = new 
ArrayList(imagesArray);                                                         
       
+                       }
+                       
+               ]]>
+       </fx:Script>
+
+       <s:Rect left="10" right="10" top="10" bottom="10" radiusX="5" 
radiusY="5">
+               <s:fill>
+                       <s:SolidColor color="#FFFFFF"/>
+               </s:fill>
+       </s:Rect>
+       
+       <s:Scroller id="myScroller" top="10" bottom="10" left="10" right="10">
+               <s:VGroup width="100%" height="100%" gap="10">
+                       <s:Spacer height="5" width="5"/>
+                       <s:Label id="titleTxt" width="100%" paddingLeft="10" 
paddingRight="10"/>
+                       <s:Label id="authorTxt" width="100%" paddingLeft="10" 
paddingRight="10" fontWeight="bold"/>
+                       <s:Label id="websiteTxt" width="100%" paddingLeft="10" 
paddingRight="10" textDecoration="underline" color="#006699"/>
+                       <s:List id="thumbnailList" width="100%" height="250" 
itemRenderer="renderers.ShowcaseImageRenderer" verticalScrollPolicy="off" 
contentBackgroundColor="#D7DADD" pageScrollingEnabled="true">
+                               <s:layout>
+                                       <s:TileLayout useVirtualLayout="true" 
columnWidth="{myScroller.width}" rowHeight="250" orientation="columns" 
horizontalGap="0" verticalGap="0"/>
+                               </s:layout>
+                       </s:List>                       
+                       <s:Label id="descriptionTxt" width="100%" 
paddingLeft="10" paddingRight="10"/>
+                       <s:Spacer height="5" width="5"/>
+               </s:VGroup>     
+       </s:Scroller>
+       
+       <s:navigationContent>
+               <s:Button click="navigator.popView()">
+                       <s:icon>
+                               <s:MultiDPIBitmapSource 
source160dpi="@Embed('assets/icons/160/1_navigation_previous_item.png')"
+                                                                               
source240dpi="@Embed('assets/icons/240/1_navigation_previous_item.png')"
+                                                                               
source320dpi="@Embed('assets/icons/320/1_navigation_previous_item.png')"/>
+                       </s:icon>
+               </s:Button>
+       </s:navigationContent>
+</s:View>

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/views/ShowcaseView.mxml
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/views/ShowcaseView.mxml 
b/tourdeflexmobile/src/views/ShowcaseView.mxml
new file mode 100644
index 0000000..8f7f8d4
--- /dev/null
+++ b/tourdeflexmobile/src/views/ShowcaseView.mxml
@@ -0,0 +1,71 @@
+<?xml version="1.0" encoding="utf-8"?>
+<s:View xmlns:fx="http://ns.adobe.com/mxml/2009"; 
+               xmlns:s="library://ns.adobe.com/flex/spark" title="Showcase" 
viewActivate="init(event)">
+       <fx:Script>
+               <![CDATA[
+                       import mx.collections.XMLListCollection;
+                       import mx.rpc.events.ResultEvent;
+                       
+                       import spark.events.IndexChangeEvent;
+                       import spark.events.ViewNavigatorEvent;
+                       
+                       protected function init(event:ViewNavigatorEvent):void
+                       {
+                               showcaseService.url = 
"http://flex.apache.org/showcase/data/showcase.xml";;
+                               showcaseService.send();
+                       }
+                       
+                       protected function 
shocaseService_resultHandler(event:ResultEvent):void
+                       {
+                               showcaseList.dataProvider = new 
XMLListCollection(new XMLList(event.result.app));
+                       }
+                       
+                       protected function 
selectApp(event:IndexChangeEvent):void
+                       {
+                               navigator.pushView(ShowcaseDetails, 
showcaseList.selectedItem);
+                       }
+                       
+               ]]>
+       </fx:Script>
+       
+       <fx:Declarations>
+               <s:HTTPService id="showcaseService" 
result="shocaseService_resultHandler(event)" resultFormat="e4x" />
+       </fx:Declarations>
+       
+       <s:List id="showcaseList" width="100%" height="100%" 
change="selectApp(event)">
+               <s:itemRenderer>
+                       <fx:Component>
+                               <s:IconItemRenderer 
labelFunction="myLabelFunction" messageFunction="myMessageFunction">
+                                       <s:decorator>
+                                               <s:MultiDPIBitmapSource 
source160dpi="@Embed('assets/icons/160/1_navigation_next_item.png')"
+                                                                               
                
source240dpi="@Embed('assets/icons/240/1_navigation_next_item.png')"
+                                                                               
                
source320dpi="@Embed('assets/icons/320/1_navigation_next_item.png')"/>
+                                       </s:decorator>
+                                       
+                                       <fx:Script>
+                                               <![CDATA[
+                                                                               
                                
+                                                       private function 
myLabelFunction(item:Object):String{
+                                                               return 
data.@title;
+                                                       }
+                                                       
+                                                       private function 
myMessageFunction(item:Object):String{
+                                                               return 
data.@author;
+                                                       }
+                                                       
+                                                       /* Disabled by now.
+                                                       private function 
myIconFunction(item:Object):String{
+                                                               if(data.images 
== undefined){
+                                                                       return 
"";
+                                                               } else {
+                                                                       return 
"http://flex.apache.org/showcase/images/"+data.images.@baseDir+"/prev/"+data.images.image[0].@file;
+                                                               }
+                                                       }*/
+                                                       
+                                               ]]>
+                                       </fx:Script>
+                               </s:IconItemRenderer>
+                       </fx:Component>
+               </s:itemRenderer>
+       </s:List>
+</s:View>

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/views/VideoDetailsView.mxml
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/views/VideoDetailsView.mxml 
b/tourdeflexmobile/src/views/VideoDetailsView.mxml
new file mode 100644
index 0000000..2812a05
--- /dev/null
+++ b/tourdeflexmobile/src/views/VideoDetailsView.mxml
@@ -0,0 +1,69 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+Licensed to the Apache Software Foundation (ASF) under one or more
+contributor license agreements.  See the NOTICE file distributed with
+this work for additional information regarding copyright ownership.
+The ASF licenses this file to You under the Apache License, Version 2.0
+(the "License"); you may not use this file except in compliance with
+the License.  You may obtain a copy of the License at
+
+http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+-->
+<s:View xmlns:fx="http://ns.adobe.com/mxml/2009"; 
+               xmlns:s="library://ns.adobe.com/flex/spark" 
title="{data.title}" viewActivate="init(event)" 
viewDeactivate="deactivate(event)">
+       <fx:Script>
+               <![CDATA[
+                       import mx.core.FlexGlobals;
+                       
+                       import spark.events.ViewNavigatorEvent;
+                       
+                       private var myStageWebView:StageWebView;                
+                       private var currentFlexScalingFactor:Number = 
FlexGlobals.topLevelApplication.runtimeDPI/FlexGlobals.topLevelApplication.applicationDPI;
+                       
+                       protected function init(event:ViewNavigatorEvent):void
+                       {
+                               
NativeApplication.nativeApplication.systemIdleMode = SystemIdleMode.KEEP_AWAKE;
+                               
+                               myStageWebView = new StageWebView(true);
+                               myStageWebView.viewPort = new 
Rectangle(myRect.x, 
myRect.y*currentFlexScalingFactor+FlexGlobals.topLevelApplication.navigator.actionBar.height*currentFlexScalingFactor,
 myRect.width*currentFlexScalingFactor, myRect.height*currentFlexScalingFactor);
+                               myStageWebView.stage = this.stage;
+                               
myStageWebView.loadURL("http://www.youtube.com/embed/"+data.url);
+                               myRect.addEventListener(Event.RESIZE, 
resizeWebView);
+                       }
+                       
+                       protected function 
deactivate(event:ViewNavigatorEvent):void
+                       {
+                               
NativeApplication.nativeApplication.systemIdleMode = SystemIdleMode.NORMAL;
+                               myStageWebView.dispose();
+                               myRect.removeEventListener(Event.RESIZE, 
resizeWebView);
+                       }
+                       
+                       private function resizeWebView(event:Event):void{
+                               
+                               myStageWebView.viewPort = new 
Rectangle(myRect.x, 
myRect.y*currentFlexScalingFactor+FlexGlobals.topLevelApplication.navigator.actionBar.height*currentFlexScalingFactor,
 myRect.width*currentFlexScalingFactor, myRect.height*currentFlexScalingFactor);
+                       }
+                       
+               ]]>
+       </fx:Script>
+
+       
+       <s:Spacer id="myRect" left="10" right="10" top="10" bottom="10"/>
+       
+       <s:navigationContent>
+               <s:Button click="navigator.popView()">
+                       <s:icon>
+                               <s:MultiDPIBitmapSource 
source160dpi="@Embed('assets/icons/160/1_navigation_previous_item.png')"
+                                                                               
source240dpi="@Embed('assets/icons/240/1_navigation_previous_item.png')"
+                                                                               
source320dpi="@Embed('assets/icons/320/1_navigation_previous_item.png')"/>
+                       </s:icon>
+               </s:Button>
+       </s:navigationContent>
+</s:View>

http://git-wip-us.apache.org/repos/asf/flex-examples/blob/39062eb0/tourdeflexmobile/src/views/VideosView.mxml
----------------------------------------------------------------------
diff --git a/tourdeflexmobile/src/views/VideosView.mxml 
b/tourdeflexmobile/src/views/VideosView.mxml
new file mode 100644
index 0000000..6f8fa28
--- /dev/null
+++ b/tourdeflexmobile/src/views/VideosView.mxml
@@ -0,0 +1,161 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+Licensed to the Apache Software Foundation (ASF) under one or more
+contributor license agreements.  See the NOTICE file distributed with
+this work for additional information regarding copyright ownership.
+The ASF licenses this file to You under the Apache License, Version 2.0
+(the "License"); you may not use this file except in compliance with
+the License.  You may obtain a copy of the License at
+
+http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+-->
+
+<s:View xmlns:fx="http://ns.adobe.com/mxml/2009"; 
+               xmlns:s="library://ns.adobe.com/flex/spark" title="Videos" 
viewActivate="init(event)">
+       <fx:Script>
+               <![CDATA[
+                       import mx.collections.ArrayList;
+                       import mx.events.FlexEvent;
+                       import mx.events.PropertyChangeEvent;
+                       import mx.rpc.events.ResultEvent;
+                       
+                       import spark.events.IndexChangeEvent;
+                       import spark.events.ViewNavigatorEvent;
+                       
+                       private static const YOUTUBE_API_KEY:String = 
"COPY_YOUR_YOUTUBE_APIKEY_HERE";
+                       private var pageToken:String;
+                       private var loading:Boolean;
+                                                                       
+                       protected function init(event:ViewNavigatorEvent):void
+                       {
+                               myBusy.visible = true;
+                               pageToken = "";
+                               youtubeService.url = 
"https://www.googleapis.com/youtube/v3/search?q=Apache%20Flex%7CAdobe%20Flex&maxResults=50&order=date&type=video&part=snippet&key="+YOUTUBE_API_KEY;
+                               youtubeService.send();
+                       }
+                       
+                       protected function 
changeSearch(event:IndexChangeEvent):void
+                       {                       
+                               
+                               pageToken = "";
+                               myBusy.visible = true;
+                               
+                               if(myButtonBar.selectedItem.search == 
"RecentVideos"){
+                                       youtubeService.url = 
"https://www.googleapis.com/youtube/v3/search?q=Apache%20Flex%7CAdobe%20Flex&maxResults=50&order=date&type=video&part=snippet&key="+YOUTUBE_API_KEY;
+                               } else {
+                                       youtubeService.url = 
"https://www.googleapis.com/youtube/v3/search?q=Apache%20Flex%7CAdobe%20Flex&maxResults=50&order=relevance&type=video&part=snippet&key="+YOUTUBE_API_KEY;
+                               }
+                               
+                               videosList.dataProvider = null;
+                               youtubeService.send();
+                       }
+                       
+                       protected function 
youtubeService_resultHandler(event:ResultEvent):void
+                       {
+                               var rawData:Object = 
JSON.parse(String(event.result));
+                               pageToken = rawData.nextPageToken;
+                               
+                               if(videosList.dataProvider == null){
+                                       var videosArray:ArrayList = new 
ArrayList(rawData.items as Array);
+                                       videosList.dataProvider = videosArray;
+                               } else {
+                                       for each (var item:* in rawData.items){
+                                               
videosList.dataProvider.addItem(item);
+                                       }
+                               }
+                               
+                               loading = false;
+                               myBusy.visible = false;
+                       }
+                       
+                       protected function 
selectVideo(event:IndexChangeEvent):void
+                       {
+                               var myObject:Object = new Object();
+                               myObject.title = 
videosList.selectedItem.snippet.title;
+                               myObject.url = 
videosList.selectedItem.id.videoId;
+                               navigator.pushView(VideoDetailsView, myObject);
+                       }
+                       
+                       protected function 
videosList_creationCompleteHandler(event:FlexEvent):void
+                       {
+                               
videosList.scroller.viewport.addEventListener(PropertyChangeEvent.PROPERTY_CHANGE,
 propertyChangeHandler);
+                       }
+                       
+                       protected function propertyChangeHandler( event : 
PropertyChangeEvent):void {
+                               if(event.property == "verticalScrollPosition"){
+                                       if(event.newValue == ( 
event.currentTarget.measuredHeight - event.currentTarget.height)){
+                                               loadMore();
+                                       }
+                               }
+                       }
+                       
+                       public function loadMore():void{
+                               if(!loading){
+                                       myBusy.visible = true;
+                                       loading = true;
+                                       
+                                       if(myButtonBar.selectedItem.search == 
"RecentVideos"){
+                                               youtubeService.url = 
"https://www.googleapis.com/youtube/v3/search?q=Apache%20Flex%7CAdobe%20Flex&maxResults=50&pageToken="+pageToken+"&order=date&type=video&part=snippet&key="+YOUTUBE_API_KEY;
+                                       } else {
+                                               youtubeService.url = 
"https://www.googleapis.com/youtube/v3/search?q=Apache%20Flex%7CAdobe%20Flex&maxResults=50&pageToken="+pageToken+"&order=relevance&type=video&part=snippet&key="+YOUTUBE_API_KEY;
+                                       }
+                                       
+                                       youtubeService.send();
+                               }
+                       }
+                       
+               ]]>
+       </fx:Script>
+       
+       <fx:Declarations>
+               <s:HTTPService id="youtubeService" resultFormat="text" 
result="youtubeService_resultHandler(event)"/>
+       </fx:Declarations>
+               
+       <s:ButtonBar  id="myButtonBar" change="changeSearch(event)" left="5" 
right="5" top="5" height="40" requireSelection="true" selectedIndex="0">
+               <s:ArrayList>
+                       <fx:Object label="Recent Videos" search="RecentVideos"/>
+                       <fx:Object label="Popular Videos" 
search="PopularVideos"/>
+               </s:ArrayList>  
+       </s:ButtonBar>
+       
+       <s:List id="videosList" 
creationComplete="videosList_creationCompleteHandler(event)" 
change="selectVideo(event)" width="100%" top="50" bottom="0">
+               <s:itemRenderer>
+                       <fx:Component>
+                               <s:IconItemRenderer 
labelFunction="myLabelFunction" messageFunction="myMessageFunction" 
iconFunction="myIconFunction" iconWidth="60" iconHeight="50" 
iconScaleMode="letterbox">
+                                       <s:decorator>
+                                               <s:MultiDPIBitmapSource 
source160dpi="@Embed('assets/icons/160/1_navigation_next_item.png')"
+                                                                               
                
source240dpi="@Embed('assets/icons/240/1_navigation_next_item.png')"
+                                                                               
                
source320dpi="@Embed('assets/icons/320/1_navigation_next_item.png')"/>
+                                       </s:decorator>
+                                       
+                                       <fx:Script>
+                                               <![CDATA[
+                                                       
+                                                       private function 
myIconFunction(item:Object):String{            
+                                                               return 
data.snippet.thumbnails.medium.url;                                             
         
+                                                       }
+                                                       
+                                                       private function 
myLabelFunction(item:Object):String{                                            
               
+                                                               return 
data.snippet.title;
+                                                       }
+                                                       
+                                                       private function 
myMessageFunction(item:Object):String{                                          
               
+                                                               return 
data.snippet.channelTitle+ "\n" + String(data.snippet.publishedAt).substr(0, 
10);
+                                                       }
+                                               ]]>
+                                       </fx:Script>
+                               </s:IconItemRenderer>
+                       </fx:Component>
+               </s:itemRenderer>
+       </s:List>
+       
+       <s:BusyIndicator id="myBusy" verticalCenter="0" horizontalCenter="0" 
visible="false"/>
+</s:View>

Reply via email to