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. 

 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. 

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. 
 
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. 
 
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. 
 
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. 
 
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>
