Added:
flex/site/trunk/content/tourdeflex/spark/i18n/SparkSortandSortFieldExample.mxml
URL:
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/i18n/SparkSortandSortFieldExample.mxml?rev=1619987&view=auto
==============================================================================
---
flex/site/trunk/content/tourdeflex/spark/i18n/SparkSortandSortFieldExample.mxml
(added)
+++
flex/site/trunk/content/tourdeflex/spark/i18n/SparkSortandSortFieldExample.mxml
Sat Aug 23 08:47:51 2014
@@ -0,0 +1,122 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+ Licensed to the Apache Software Foundation (ASF) under one or more
+ contributor license agreements. See the NOTICE file distributed with
+ this work for additional information regarding copyright ownership.
+ The ASF licenses this file to You under the Apache License, Version 2.0
+ (the "License"); you may not use this file except in compliance with
+ the License. You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+
+-->
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009";
+ xmlns:s="library://ns.adobe.com/flex/spark"
+ xmlns:mx="library://ns.adobe.com/flex/mx"
+ width="100%" height="100%">
+ <fx:Style>
+ @namespace s "library://ns.adobe.com/flex/spark";
+ @namespace mx "library://ns.adobe.com/flex/mx";
+ s|Label {
+ color: #FFFFFF;
+ font-weight: bold;
+ }
+ #titleL {
+ font-size: 20;
+ }
+ s|ComboBox {
+ alternating-item-colors: #424242;
+ }
+
+ s|Form {
+ background-color: #424242;
+ }
+ </fx:Style>
+
+ <fx:Script>
+ <![CDATA[
+ import mx.collections.ArrayCollection;
+
+ [Bindable]
+ private var _locales:ArrayCollection = new
ArrayCollection(['en-US','de-DE','ja-JP','ru-RU','ar-SA','zh-CN']);
+
+ private function sortInOrder(order:int):void {
+ switch (order)
+ {
+ case 1:
+ mySort.fields =
[firstField,lastField,ageField];
+ break;
+ case 2:
+ mySort.fields =
[lastField,firstField,ageField];
+ break;
+ case 3:
+ mySort.fields =
[ageField,firstField,lastField];
+ break;
+ case 4:
+ mySort.fields =
[firstField,ageField,lastField];
+ break;
+ }
+
+ employeeArrColl.sort = mySort;
+ employeeArrColl.refresh();
+ }
+ ]]>
+ </fx:Script>
+ <fx:Declarations>
+ <!-- Place non-visual elements (e.g., services, value objects)
here -->
+ <s:Sort id="mySort" locale="{localeCB.selectedItem}"/>
+
+ <s:SortField id="firstField" name="first"/>
+ <s:SortField id="lastField" name="last"/>
+ <s:SortField id="ageField" name="age"/>
+
+ <s:ArrayCollection id="employeeArrColl">
+ <fx:Object first="Anders" last="Ãhlund" age="36"/>
+ <fx:Object first="Eileen" last="Oehland" age="25"/>
+ <fx:Object first="Anders" last="Zorn" age="36"/>
+ <fx:Object first="Steve" last="Aaron" age="40"/>
+ <fx:Object first="Toren" last="Ohlin" age="20"/>
+ <fx:Object first="Toren" last="Aaron" age="36"/>
+ <fx:Object first="Torolf" last="Aaron" age="40"/>
+ </s:ArrayCollection>
+ </fx:Declarations>
+ <s:Scroller id="scroller" width="100%" height="100%">
+ <s:Group>
+ <s:Form>
+ <s:Label id="titleL" text="Spark Sort and
SortField"/>
+ <s:Label text="Select a locale to see the
strings sorting result:"/>
+ <s:Spacer height="15"/>
+
+ <s:FormItem label="Locale: ">
+ <s:ComboBox id="localeCB"
dataProvider="{_locales}" selectedIndex="0"/>
+ </s:FormItem>
+ <s:Label text="
==========================================================================="/>
+ <s:FormItem label="Sorting Priority:"
toolTip="Click priority radio button to sort multiple columns">
+ <s:RadioButton id="flaRB"
groupName="priority" label="first name > last name > age"
click="sortInOrder(1)"/>
+ <s:RadioButton id="lfaRB"
groupName="priority" label="last name > first name > age"
click="sortInOrder(2)"/>
+ <s:RadioButton id="alfRB"
groupName="priority" label="age > first name > last name"
click="sortInOrder(3)"/>
+ <s:RadioButton id="falRB"
groupName="priority" label="first name > age > last name"
click="sortInOrder(4)"/>
+ </s:FormItem>
+ <s:FormItem label="Employee Table:"
toolTip="Click data grid column header to sort single one column">
+ <s:DataGrid id="dg"
dataProvider="{employeeArrColl}" width="100%">
+ <s:columns>
+ <s:ArrayList>
+ <s:GridColumn
dataField="first" headerText="First Name"/>
+ <s:GridColumn
dataField="last" headerText="Last Name"/>
+ <s:GridColumn
dataField="age" headerText="Age"/>
+ </s:ArrayList>
+ </s:columns>
+ </s:DataGrid>
+ </s:FormItem>
+ </s:Form>
+ </s:Group>
+ </s:Scroller>
+
+</s:Application>
Propchange:
flex/site/trunk/content/tourdeflex/spark/i18n/SparkSortandSortFieldExample.mxml
------------------------------------------------------------------------------
svn:eol-style = native
Added:
flex/site/trunk/content/tourdeflex/spark/i18n/SparkSortandSortFieldExample.swf
URL:
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/i18n/SparkSortandSortFieldExample.swf?rev=1619987&view=auto
==============================================================================
Binary file - no diff available.
Propchange:
flex/site/trunk/content/tourdeflex/spark/i18n/SparkSortandSortFieldExample.swf
------------------------------------------------------------------------------
svn:mime-type = application/octet-stream
Added:
flex/site/trunk/content/tourdeflex/spark/i18n/SparkStringToolsExample.mxml
URL:
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/i18n/SparkStringToolsExample.mxml?rev=1619987&view=auto
==============================================================================
--- flex/site/trunk/content/tourdeflex/spark/i18n/SparkStringToolsExample.mxml
(added)
+++ flex/site/trunk/content/tourdeflex/spark/i18n/SparkStringToolsExample.mxml
Sat Aug 23 08:47:51 2014
@@ -0,0 +1,124 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+ Licensed to the Apache Software Foundation (ASF) under one or more
+ contributor license agreements. See the NOTICE file distributed with
+ this work for additional information regarding copyright ownership.
+ The ASF licenses this file to You under the Apache License, Version 2.0
+ (the "License"); you may not use this file except in compliance with
+ the License. You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+
+-->
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009";
+ xmlns:s="library://ns.adobe.com/flex/spark"
+ xmlns:mx="library://ns.adobe.com/flex/mx"
+ width="100%" height="100%">
+ <fx:Style>
+ @namespace s "library://ns.adobe.com/flex/spark";
+ @namespace mx "library://ns.adobe.com/flex/mx";
+ s|Label {
+ color: #FFFFFF;
+ font-weight: bold;
+ }
+ #titleL {
+ font-size: 20;
+ }
+ s|ComboBox {
+ alternating-item-colors: #424242;
+ }
+
+ s|Form {
+ background-color: #424242;
+ }
+
+ s|List {
+ alternating-item-colors: #424242;
+ }
+ </fx:Style>
+ <fx:Script>
+ <![CDATA[
+ import mx.collections.ArrayCollection;
+
+ [Bindable]
+ private var _locales:ArrayCollection = new
ArrayCollection(['en-US','zh-CN','ja-JP','de-DE','fr-FR','ru-RU','ar-SA']);
+ [Bindable]
+ private var _initStr:String = 'Turkish I: iI & ıİ;
Greek: ΣÏÏβΰÎΣ; German: Ã';
+ protected function localesCB_changeHandler():void
+ {
+ st.setStyle('locale',localesCB.selectedItem);
+ initStrs(localesCB.selectedItem);
+ converString();
+ }
+
+ private function initStrs(locale:String):void
+ {
+ switch(locale)
+ {
+ case 'en-US':
+ _initStr = 'Turkish I: iI &
ıİ; Greek: ΣÏÏβΰÎΣ; German: Ã';
+ break;
+ case 'zh-CN':
+ _initStr =
'è¿æ¯ä¸ä¸ªä¸ææµè¯è¯å¥';
+ break;
+ case 'ja-JP':
+ _initStr =
'ç¾ä»£ã®æ¥æ¬èªã§ã¯ã主ã«ä»¥ä¸ã®3種é¡ã®æåä½ç³»ãç¨ããããã';
+ break;
+ case 'de-DE':
+ _initStr = 'Wie heiÃen Sieï¼';
+ break;
+ case 'fr-FR':
+ _initStr = 'Le français parlé
aujourdâhui tire son nom de cet ancien franceis';
+ break;
+ case 'ru-RU':
+ _initStr = 'болÑÑой';
+ break;
+ case 'ar-SA':
+ _initStr = 'جاÙ
عة
اÙدÙ٠اÙعربÙØ©';
+ break;
+ }
+ }
+ private function converString():void
+ {
+ upperL.text = st.toUpperCase(inputTI.text);
+ lowerL.text = st.toLowerCase(inputTI.text);
+ }
+ ]]>
+ </fx:Script>
+ <fx:Declarations>
+ <!-- Place non-visual elements (e.g., services, value objects)
here -->
+ <s:StringTools id="st"/>
+ </fx:Declarations>
+ <s:layout>
+ <s:VerticalLayout/>
+ </s:layout>
+ <s:Scroller id="scroller" width="100%" height="100%">
+ <s:Group>
+ <s:Form>
+ <s:Label id="titleL" text="Spark StringTools"/>
+ <s:Label text="Enter strings and find the case
conversion result"/>
+ <s:Spacer height="15"/>
+ <s:FormItem label="Locales:">
+ <s:ComboBox id="localesCB"
dataProvider="{_locales}" selectedIndex="0" change="localesCB_changeHandler()"/>
+ </s:FormItem>
+ <s:FormItem label="Please enter a string:">
+ <s:TextInput id="inputTI" width="380"
text="{_initStr}" change="converString()"/>
+ </s:FormItem>
+ <s:FormItem label="ToLowerCase:">
+ <s:Label id="lowerL"/>
+ </s:FormItem>
+ <s:FormItem label="ToUpperCase:">
+ <s:Label id="upperL"/>
+ </s:FormItem>
+ </s:Form>
+ </s:Group>
+ </s:Scroller>
+</s:Application>
+
Propchange:
flex/site/trunk/content/tourdeflex/spark/i18n/SparkStringToolsExample.mxml
------------------------------------------------------------------------------
svn:eol-style = native
Added: flex/site/trunk/content/tourdeflex/spark/i18n/SparkStringToolsExample.swf
URL:
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/i18n/SparkStringToolsExample.swf?rev=1619987&view=auto
==============================================================================
Binary file - no diff available.
Propchange:
flex/site/trunk/content/tourdeflex/spark/i18n/SparkStringToolsExample.swf
------------------------------------------------------------------------------
svn:mime-type = application/octet-stream
Added: flex/site/trunk/content/tourdeflex/spark/itemRenderers/Item.as
URL:
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/itemRenderers/Item.as?rev=1619987&view=auto
==============================================================================
--- flex/site/trunk/content/tourdeflex/spark/itemRenderers/Item.as (added)
+++ flex/site/trunk/content/tourdeflex/spark/itemRenderers/Item.as Sat Aug 23
08:47:51 2014
@@ -0,0 +1,62 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+// Licensed to the Apache Software Foundation (ASF) under one or more
+// contributor license agreements. See the NOTICE file distributed with
+// this work for additional information regarding copyright ownership.
+// The ASF licenses this file to You under the Apache License, Version 2.0
+// (the "License"); you may not use this file except in compliance with
+// the License. You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+////////////////////////////////////////////////////////////////////////////////
+package
+{
+ [Bindable]
+ public class Item
+ {
+ private var _name:String;
+ private var _photo:String;
+ private var _price:String;
+
+ public function Item()
+ {
+ }
+
+ public function get name():String
+ {
+ return _name;
+ }
+
+ public function set name(name:String):void
+ {
+ _name = name;
+ }
+
+ public function get photo():String
+ {
+ return _photo;
+ }
+
+ public function set photo(photo:String):void
+ {
+ _photo = photo;
+ }
+
+ public function get price():String
+ {
+ return _price;
+ }
+ public function set price(price:String):void
+ {
+ _price = price;
+ }
+
+ }
+}
\ No newline at end of file
Propchange: flex/site/trunk/content/tourdeflex/spark/itemRenderers/Item.as
------------------------------------------------------------------------------
svn:eol-style = native
Added:
flex/site/trunk/content/tourdeflex/spark/itemRenderers/ItemRenderer1Example.mxml
URL:
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/itemRenderers/ItemRenderer1Example.mxml?rev=1619987&view=auto
==============================================================================
---
flex/site/trunk/content/tourdeflex/spark/itemRenderers/ItemRenderer1Example.mxml
(added)
+++
flex/site/trunk/content/tourdeflex/spark/itemRenderers/ItemRenderer1Example.mxml
Sat Aug 23 08:47:51 2014
@@ -0,0 +1,60 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+ Licensed to the Apache Software Foundation (ASF) under one or more
+ contributor license agreements. See the NOTICE file distributed with
+ this work for additional information regarding copyright ownership.
+ The ASF licenses this file to You under the Apache License, Version 2.0
+ (the "License"); you may not use this file except in compliance with
+ the License. You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+
+-->
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009";
+ xmlns:s="library://ns.adobe.com/flex/spark"
+ xmlns:mx="library://ns.adobe.com/flex/mx"
+ initialize="init()">
+
+
+ <fx:Script>
+ <![CDATA[
+ import mx.collections.XMLListCollection;
+
+ import skins.TDFPanelSkin;
+
+ [Bindable]
+ private var employees:XMLListCollection;
+
+ [Embed(source="data/list.xml",
mimeType="application/octet-stream")]
+ private var XMLData:Class;
+
+ private function init():void
+ {
+ var data:XML = XML(new XMLData());
+
+ employees = new
XMLListCollection(data.employee);
+ }
+ ]]>
+ </fx:Script>
+
+ <s:Panel width="100%" height="100%" title="Custom Item Renderer with
Animation" skinClass="skins.TDFPanelSkin">
+ <s:layout>
+ <s:HorizontalLayout paddingLeft="100" paddingRight="10"
paddingTop="10" paddingBottom="10"/>
+ </s:layout>
+ <s:DataGroup dataProvider="{employees}" width="300"
itemRenderer="renderers.ImageRenderer1">
+ <s:layout>
+ <s:TileLayout horizontalGap="0"
verticalGap="0"/>
+ </s:layout>
+ </s:DataGroup>
+ <s:Label color="0x323232" width="200" text="The item renderer
on this DataGroup uses the Spark Animate to scale the image
+when hovered over each item. See the ImageRenderer1.mxml source for more
information."/>
+ </s:Panel>
+
+</s:Application>
Propchange:
flex/site/trunk/content/tourdeflex/spark/itemRenderers/ItemRenderer1Example.mxml
------------------------------------------------------------------------------
svn:eol-style = native
Added:
flex/site/trunk/content/tourdeflex/spark/itemRenderers/ItemRenderer1Example.swf
URL:
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/itemRenderers/ItemRenderer1Example.swf?rev=1619987&view=auto
==============================================================================
Binary file - no diff available.
Propchange:
flex/site/trunk/content/tourdeflex/spark/itemRenderers/ItemRenderer1Example.swf
------------------------------------------------------------------------------
svn:mime-type = application/octet-stream
Added:
flex/site/trunk/content/tourdeflex/spark/itemRenderers/ItemRenderer2Example.mxml
URL:
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/itemRenderers/ItemRenderer2Example.mxml?rev=1619987&view=auto
==============================================================================
---
flex/site/trunk/content/tourdeflex/spark/itemRenderers/ItemRenderer2Example.mxml
(added)
+++
flex/site/trunk/content/tourdeflex/spark/itemRenderers/ItemRenderer2Example.mxml
Sat Aug 23 08:47:51 2014
@@ -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:Application xmlns:fx="http://ns.adobe.com/mxml/2009";
+ xmlns:s="library://ns.adobe.com/flex/spark"
+ xmlns:mx="library://ns.adobe.com/flex/mx"
+ initialize="init()">
+
+ <fx:Style>
+
+ @namespace s "library://ns.adobe.com/flex/spark";
+ @namespace mx "library://ns.adobe.com/flex/halo";
+
+ s|Application {
+ font-size: 14;
+ }
+
+ </fx:Style>
+
+ <fx:Script>
+ <![CDATA[
+ import mx.collections.XMLListCollection;
+
+ [Bindable]
+ private var employees:XMLListCollection;
+
+ [Embed(source="data/list.xml",
mimeType="application/octet-stream")]
+ private var XMLData:Class;
+
+ private function init():void
+ {
+ var data:XML = XML(new XMLData());
+
+ employees = new
XMLListCollection(data.employee);
+ }
+ ]]>
+ </fx:Script>
+
+ <s:Panel width="100%" height="100%" title="Custom Item Renderer with
Animation" skinClass="skins.TDFPanelSkin">
+ <s:layout>
+ <s:HorizontalLayout paddingTop="2" paddingLeft="50"
paddingRight="8"/>
+ </s:layout>
+
+ <s:DataGroup dataProvider="{employees}" width="440"
itemRenderer="renderers.ImageRenderer2" horizontalCenter="0" verticalCenter="0">
+ <s:layout>
+ <s:TileLayout />
+ </s:layout>
+ </s:DataGroup>
+ <s:Label color="0x323232" width="200" text="The item renderer
on this DataGroup uses effects to provide a
+Spark 3D rotation effect when hovered over each item. See the
ImageRenderer2.mxml source for more information. This sample also
+shows the use of a special font for the text."/>
+ </s:Panel>
+</s:Application>
Propchange:
flex/site/trunk/content/tourdeflex/spark/itemRenderers/ItemRenderer2Example.mxml
------------------------------------------------------------------------------
svn:eol-style = native
Added:
flex/site/trunk/content/tourdeflex/spark/itemRenderers/ItemRenderer2Example.swf
URL:
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/itemRenderers/ItemRenderer2Example.swf?rev=1619987&view=auto
==============================================================================
Binary file - no diff available.
Propchange:
flex/site/trunk/content/tourdeflex/spark/itemRenderers/ItemRenderer2Example.swf
------------------------------------------------------------------------------
svn:mime-type = application/octet-stream
Added:
flex/site/trunk/content/tourdeflex/spark/itemRenderers/ListItemRendererExample.mxml
URL:
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/itemRenderers/ListItemRendererExample.mxml?rev=1619987&view=auto
==============================================================================
---
flex/site/trunk/content/tourdeflex/spark/itemRenderers/ListItemRendererExample.mxml
(added)
+++
flex/site/trunk/content/tourdeflex/spark/itemRenderers/ListItemRendererExample.mxml
Sat Aug 23 08:47:51 2014
@@ -0,0 +1,102 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+ Licensed to the Apache Software Foundation (ASF) under one or more
+ contributor license agreements. See the NOTICE file distributed with
+ this work for additional information regarding copyright ownership.
+ The ASF licenses this file to You under the Apache License, Version 2.0
+ (the "License"); you may not use this file except in compliance with
+ the License. You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+
+-->
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009";
+ xmlns:s="library://ns.adobe.com/flex/spark"
+ xmlns:mx="library://ns.adobe.com/flex/mx"
+ xmlns:local="*" viewSourceURL="srcview/index.html">
+ <fx:Script>
+ <![CDATA[
+ import spark.events.IndexChangeEvent;
+
+ [Bindable]
+ private var totalPrice:Number = 0.00;
+
+ protected function
itemIndexChangeHandler(event:IndexChangeEvent):void
+ {
+ if (ta.text.length!=0)
+
ta.text=ta.text+"\n"+myList.selectedItem.name + " $"+myList.selectedItem.price;
+ else ta.text=myList.selectedItem.name+ "
$"+myList.selectedItem.price;
+ totalPrice += Number(myList.selectedItem.price);
+ }
+ protected function
buyBtn_clickHandler(event:MouseEvent):void
+ {
+ txtResponse.text="Thank you for your order
totaling: " + usdFormatter.format(totalPrice) + "\nItems will ship in 3 days.";
+ }
+
+ ]]>
+ </fx:Script>
+ <fx:Declarations>
+ <mx:CurrencyFormatter id="usdFormatter" precision="2"
currencySymbol="$"
+
decimalSeparatorFrom="." decimalSeparatorTo="." useNegativeSign="true"
+
useThousandsSeparator="true" alignSymbol="left"/>
+ </fx:Declarations>
+ <fx:Style>
+ @namespace "library://ns.adobe.com/flex/spark";
+ #vGrp {
+ color: #000000;
+ fontFamily: "Arial";
+ fontSize: "12";
+ }
+ </fx:Style>
+
+ <s:Panel title="List Sample"
+ width="100%" height="100%"
+ skinClass="skins.TDFPanelSkin">
+ <s:VGroup id="vGrp" horizontalCenter="0" top="3"
+ width="80%" height="75%">
+ <s:HGroup verticalAlign="middle">
+ <s:Label text="Select items to add, price will
be shown when added:"
+
verticalAlign="bottom"/>
+ </s:HGroup>
+ <s:HGroup >
+ <s:List id="myList" height="157" width="160"
+
itemRenderer="MyListItemRenderer"
+
change="itemIndexChangeHandler(event)">
+ <s:dataProvider>
+ <s:ArrayCollection>
+ <local:Item
name="Backpack" photo="assets/ApacheFlexIcon.png" price="29.99"/>
+ <local:Item
name="Boots" photo="assets/ApacheFlexIcon.png" price="69.99"/>
+ <local:Item
name="Compass" photo="assets/ApacheFlexIcon.png" price="12.99"/>
+ <local:Item
name="Goggles" photo="assets/ApacheFlexIcon.png" price="14.99"/>
+ <local:Item
name="Helmet" photo="assets/ApacheFlexIcon.png" price="47.99"/>
+ </s:ArrayCollection>
+ </s:dataProvider>
+ </s:List>
+ <s:TextArea id="ta" width="{myList.width}"
height="{myList.height}"
+ color="0xAE0A0A"
fontWeight="bold"/>
+ <s:VGroup>
+ <mx:Spacer height="10"/>
+ <s:Label text="Total of Items selected:
{usdFormatter.format(this.totalPrice)}"/>
+ <s:Button id="buyBtn"
horizontalCenter="0" bottom="30" label="Buy Now!"
+ fontWeight="bold"
+
click="buyBtn_clickHandler(event)"/>
+ <s:Label id="txtResponse"/>
+ </s:VGroup>
+ </s:HGroup>
+ </s:VGroup>
+ <s:Label bottom="15" horizontalCenter="0" width="95%"
verticalAlign="justify" color="#323232"
+ text="The Spark List control displays
a list of data items. Its functionality is
+very similar to that of the SELECT form element in HTML. The user can select
one or more items from the list.
+The List control automatically displays horizontal and vertical scroll bar
when the list items do not fit
+the size of the control."/>
+ </s:Panel>
+
+
+</s:Application>
Propchange:
flex/site/trunk/content/tourdeflex/spark/itemRenderers/ListItemRendererExample.mxml
------------------------------------------------------------------------------
svn:eol-style = native
Added:
flex/site/trunk/content/tourdeflex/spark/itemRenderers/ListItemRendererExample.swf
URL:
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/itemRenderers/ListItemRendererExample.swf?rev=1619987&view=auto
==============================================================================
Binary file - no diff available.
Propchange:
flex/site/trunk/content/tourdeflex/spark/itemRenderers/ListItemRendererExample.swf
------------------------------------------------------------------------------
svn:mime-type = application/octet-stream
Added:
flex/site/trunk/content/tourdeflex/spark/itemRenderers/MyListItemRenderer.mxml
URL:
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/itemRenderers/MyListItemRenderer.mxml?rev=1619987&view=auto
==============================================================================
---
flex/site/trunk/content/tourdeflex/spark/itemRenderers/MyListItemRenderer.mxml
(added)
+++
flex/site/trunk/content/tourdeflex/spark/itemRenderers/MyListItemRenderer.mxml
Sat Aug 23 08:47:51 2014
@@ -0,0 +1,39 @@
+<!--
+
+Licensed to the Apache Software Foundation (ASF) under one or more
+contributor license agreements. See the NOTICE file distributed with
+this work for additional information regarding copyright ownership.
+The ASF licenses this file to You under the Apache License, Version 2.0
+(the "License"); you may not use this file except in compliance with
+the License. You may obtain a copy of the License at
+
+http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+
+-->
+<s:ItemRenderer
+ xmlns:fx="http://ns.adobe.com/mxml/2009";
+ xmlns:s="library://ns.adobe.com/flex/spark"
+ xmlns:mx="library://ns.adobe.com/flex/mx">
+
+ <s:states>
+ <s:State name="normal"/>
+ <s:State name="hovered"/>
+ <s:State name="selected" />
+ </s:states>
+
+ <s:layout>
+ <s:VerticalLayout/>
+ </s:layout>
+
+ <s:HGroup verticalAlign="middle" paddingTop="0" paddingBottom="0">
+ <mx:Image source="{data.photo}" width="50" height="40"
alpha.hovered=".5"/>
+ <s:Label text="{data.name}" color.hovered="0x1313cd"
color.selected="0x000000" verticalAlign="bottom"/>
+ </s:HGroup>
+
+</s:ItemRenderer>
\ No newline at end of file
Propchange:
flex/site/trunk/content/tourdeflex/spark/itemRenderers/MyListItemRenderer.mxml
------------------------------------------------------------------------------
svn:eol-style = native
Added: flex/site/trunk/content/tourdeflex/spark/itemRenderers/assets/1.jpg
URL:
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/itemRenderers/assets/1.jpg?rev=1619987&view=auto
==============================================================================
Binary file - no diff available.
Propchange: flex/site/trunk/content/tourdeflex/spark/itemRenderers/assets/1.jpg
------------------------------------------------------------------------------
svn:mime-type = image/jpeg
Added: flex/site/trunk/content/tourdeflex/spark/itemRenderers/assets/2.jpg
URL:
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/itemRenderers/assets/2.jpg?rev=1619987&view=auto
==============================================================================
Binary file - no diff available.
Propchange: flex/site/trunk/content/tourdeflex/spark/itemRenderers/assets/2.jpg
------------------------------------------------------------------------------
svn:mime-type = image/jpeg
Added: flex/site/trunk/content/tourdeflex/spark/itemRenderers/assets/3.jpg
URL:
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/itemRenderers/assets/3.jpg?rev=1619987&view=auto
==============================================================================
Binary file - no diff available.
Propchange: flex/site/trunk/content/tourdeflex/spark/itemRenderers/assets/3.jpg
------------------------------------------------------------------------------
svn:mime-type = image/jpeg
Added: flex/site/trunk/content/tourdeflex/spark/itemRenderers/assets/4.jpg
URL:
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/itemRenderers/assets/4.jpg?rev=1619987&view=auto
==============================================================================
Binary file - no diff available.
Propchange: flex/site/trunk/content/tourdeflex/spark/itemRenderers/assets/4.jpg
------------------------------------------------------------------------------
svn:mime-type = image/jpeg
Added: flex/site/trunk/content/tourdeflex/spark/itemRenderers/assets/5.jpg
URL:
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/itemRenderers/assets/5.jpg?rev=1619987&view=auto
==============================================================================
Binary file - no diff available.
Propchange: flex/site/trunk/content/tourdeflex/spark/itemRenderers/assets/5.jpg
------------------------------------------------------------------------------
svn:mime-type = image/jpeg
Added: flex/site/trunk/content/tourdeflex/spark/itemRenderers/assets/6.jpg
URL:
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/itemRenderers/assets/6.jpg?rev=1619987&view=auto
==============================================================================
Binary file - no diff available.
Propchange: flex/site/trunk/content/tourdeflex/spark/itemRenderers/assets/6.jpg
------------------------------------------------------------------------------
svn:mime-type = image/jpeg
Added: flex/site/trunk/content/tourdeflex/spark/itemRenderers/assets/7.jpg
URL:
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/itemRenderers/assets/7.jpg?rev=1619987&view=auto
==============================================================================
Binary file - no diff available.
Propchange: flex/site/trunk/content/tourdeflex/spark/itemRenderers/assets/7.jpg
------------------------------------------------------------------------------
svn:mime-type = image/jpeg
Added: flex/site/trunk/content/tourdeflex/spark/itemRenderers/assets/8.jpg
URL:
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/itemRenderers/assets/8.jpg?rev=1619987&view=auto
==============================================================================
Binary file - no diff available.
Propchange: flex/site/trunk/content/tourdeflex/spark/itemRenderers/assets/8.jpg
------------------------------------------------------------------------------
svn:mime-type = image/jpeg
Added: flex/site/trunk/content/tourdeflex/spark/itemRenderers/assets/9.jpg
URL:
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/itemRenderers/assets/9.jpg?rev=1619987&view=auto
==============================================================================
Binary file - no diff available.
Propchange: flex/site/trunk/content/tourdeflex/spark/itemRenderers/assets/9.jpg
------------------------------------------------------------------------------
svn:mime-type = image/jpeg
Added:
flex/site/trunk/content/tourdeflex/spark/itemRenderers/assets/ApacheFlexIcon.png
URL:
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/itemRenderers/assets/ApacheFlexIcon.png?rev=1619987&view=auto
==============================================================================
Binary file - no diff available.
Propchange:
flex/site/trunk/content/tourdeflex/spark/itemRenderers/assets/ApacheFlexIcon.png
------------------------------------------------------------------------------
svn:mime-type = image/png
Added: flex/site/trunk/content/tourdeflex/spark/itemRenderers/data/list.xml
URL:
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/itemRenderers/data/list.xml?rev=1619987&view=auto
==============================================================================
--- flex/site/trunk/content/tourdeflex/spark/itemRenderers/data/list.xml (added)
+++ flex/site/trunk/content/tourdeflex/spark/itemRenderers/data/list.xml Sat
Aug 23 08:47:51 2014
@@ -0,0 +1,96 @@
+<?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.
+
+-->
+<list>
+ <employee employeeId="1">
+ <firstName>Michael</firstName>
+ <lastName>Scott</lastName>
+ <image>assets/2.jpg</image>
+ </employee>
+ <employee employeeId="2">
+ <firstName>Pam</firstName>
+ <lastName>Beesly</lastName>
+ <image>assets/3.jpg</image>
+ </employee>
+ <employee employeeId="3">
+ <firstName>Andy</firstName>
+ <lastName>Bernard</lastName>
+ <image>assets/4.jpg</image>
+ </employee>
+ <employee employeeId="3">
+ <firstName>Creed</firstName>
+ <lastName>Bratton</lastName>
+ <image>assets/5.jpg</image>
+ </employee>
+ <employee employeeId="3">
+ <firstName>Toby</firstName>
+ <lastName>Flenderson</lastName>
+ <image>assets/6.jpg</image>
+ </employee>
+ <employee employeeId="3">
+ <firstName>Jim</firstName>
+ <lastName>Halpert</lastName>
+ <image>assets/7.jpg</image>
+ </employee>
+ <employee employeeId="3">
+ <firstName>Ryan</firstName>
+ <lastName>Howard</lastName>
+ <image>assets/8.jpg</image>
+ </employee>
+ <employee employeeId="3">
+ <firstName>Stanley</firstName>
+ <lastName>Hudson</lastName>
+ <image>assets/9.jpg</image>
+ </employee>
+ <employee employeeId="3">
+ <firstName>Kelly</firstName>
+ <lastName>Kapoor</lastName>
+ <image>assets/1.jpg</image>
+ </employee>
+ <employee employeeId="3">
+ <firstName>Phyllis</firstName>
+ <lastName>Lapin</lastName>
+ <image>assets/2.jpg</image>
+ </employee>
+ <employee employeeId="3">
+ <firstName>Kevin</firstName>
+ <lastName>Malone</lastName>
+ <image>assets/3.jpg</image>
+ </employee>
+ <employee employeeId="3">
+ <firstName>Angela</firstName>
+ <lastName>Martin</lastName>
+ <image>assets/4.jpg</image>
+ </employee>
+ <employee employeeId="3">
+ <firstName>Oscar</firstName>
+ <lastName>Martinez</lastName>
+ <image>assets/5.jpg</image>
+ </employee>
+ <employee employeeId="3">
+ <firstName>Meredith</firstName>
+ <lastName>Palmer</lastName>
+ <image>assets/6.jpg</image>
+ </employee>
+ <employee employeeId="3">
+ <firstName>Dwight</firstName>
+ <lastName>Schrute</lastName>
+ <image>assets/7.jpg</image>
+ </employee>
+</list>
\ No newline at end of file
Propchange: flex/site/trunk/content/tourdeflex/spark/itemRenderers/data/list.xml
------------------------------------------------------------------------------
svn:eol-style = native
Added:
flex/site/trunk/content/tourdeflex/spark/itemRenderers/renderers/ImageRenderer1.mxml
URL:
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/itemRenderers/renderers/ImageRenderer1.mxml?rev=1619987&view=auto
==============================================================================
---
flex/site/trunk/content/tourdeflex/spark/itemRenderers/renderers/ImageRenderer1.mxml
(added)
+++
flex/site/trunk/content/tourdeflex/spark/itemRenderers/renderers/ImageRenderer1.mxml
Sat Aug 23 08:47:51 2014
@@ -0,0 +1,56 @@
+<?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:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009";
+ xmlns:s="library://ns.adobe.com/flex/spark"
+ xmlns:mx="library://ns.adobe.com/flex/mx"
+ autoDrawBackground="false"
+ depth="0" depth.hovered="1">
+
+ <s:states>
+ <s:State name="normal" />
+ <s:State name="hovered" />
+ </s:states>
+
+ <s:postLayoutTransformOffsets>
+ <mx:TransformOffsets id="offsets" x.hovered="-40"
y.hovered="-40" scaleX.hovered="2" scaleY.hovered="2" />
+ </s:postLayoutTransformOffsets>
+
+ <s:transitions>
+ <mx:Transition fromState="normal" toState="hovered"
autoReverse="true">
+ <s:Animate target="{offsets}" duration="200">
+ <s:SimpleMotionPath property="scaleX" />
+ <s:SimpleMotionPath property="scaleY" />
+ <s:SimpleMotionPath property="x" />
+ <s:SimpleMotionPath property="y" />
+ </s:Animate>
+ </mx:Transition>
+ <mx:Transition fromState="hovered" toState="normal"
autoReverse="true">
+ <s:Animate target="{offsets}" duration="200">
+ <s:SimpleMotionPath property="scaleX" />
+ <s:SimpleMotionPath property="scaleY" />
+ <s:SimpleMotionPath property="x" />
+ <s:SimpleMotionPath property="y" />
+ </s:Animate>
+ </mx:Transition>
+ </s:transitions>
+
+ <mx:Image id="image" source="{data.image}" width="60" height="60"
horizontalCenter="0" verticalCenter="0"/>
+
+</s:ItemRenderer>
\ No newline at end of file
Propchange:
flex/site/trunk/content/tourdeflex/spark/itemRenderers/renderers/ImageRenderer1.mxml
------------------------------------------------------------------------------
svn:eol-style = native
Added:
flex/site/trunk/content/tourdeflex/spark/itemRenderers/renderers/ImageRenderer2.mxml
URL:
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/itemRenderers/renderers/ImageRenderer2.mxml?rev=1619987&view=auto
==============================================================================
---
flex/site/trunk/content/tourdeflex/spark/itemRenderers/renderers/ImageRenderer2.mxml
(added)
+++
flex/site/trunk/content/tourdeflex/spark/itemRenderers/renderers/ImageRenderer2.mxml
Sat Aug 23 08:47:51 2014
@@ -0,0 +1,54 @@
+<?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:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009";
+ xmlns:s="library://ns.adobe.com/flex/spark"
+ xmlns:mx="library://ns.adobe.com/flex/mx"
+ autoDrawBackground="false"
+ depth="0" depth.hovered="1">
+
+ <s:states>
+ <s:State name="normal" />
+ <s:State name="hovered" />
+ </s:states>
+
+ <s:transitions>
+ <s:Transition fromState="normal" toState="hovered"
autoReverse="true">
+ <s:Parallel>
+ <s:Rotate3D target="{image}" angleYFrom="0"
angleYTo="360" autoCenterProjection="true" autoCenterTransform="true"
duration="400"/>
+ <s:Fade target="{image}" startDelay="400"
duration="200"/>
+ <s:Fade target="{group}" startDelay="400"
duration="200"/>
+ </s:Parallel>
+ </s:Transition>
+ </s:transitions>
+
+ <s:Rect id="rect" left="0" right="0" top="0" bottom="0">
+ <s:fill>
+ <s:SolidColor color="black" alpha="0.7"/>
+ </s:fill>
+ </s:Rect>
+
+ <s:Group id="group" left="0" right="0" top="0" bottom="0"
visible.normal="false">
+ <s:Label text="{data.firstName}" verticalCenter="-10"
horizontalCenter="0" color="white"/>
+ <s:Label text="{data.lastName}" verticalCenter="10"
horizontalCenter="0" color="white"/>
+ </s:Group>
+
+ <mx:Image id="image" source="{data.image}" width="70" height="70"
horizontalCenter="0" verticalCenter="0" visible.hovered="false"/>
+
+</s:ItemRenderer>
\ No newline at end of file
Propchange:
flex/site/trunk/content/tourdeflex/spark/itemRenderers/renderers/ImageRenderer2.mxml
------------------------------------------------------------------------------
svn:eol-style = native
Added:
flex/site/trunk/content/tourdeflex/spark/itemRenderers/skins/TDFPanelSkin.mxml
URL:
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/itemRenderers/skins/TDFPanelSkin.mxml?rev=1619987&view=auto
==============================================================================
---
flex/site/trunk/content/tourdeflex/spark/itemRenderers/skins/TDFPanelSkin.mxml
(added)
+++
flex/site/trunk/content/tourdeflex/spark/itemRenderers/skins/TDFPanelSkin.mxml
Sat Aug 23 08:47:51 2014
@@ -0,0 +1,170 @@
+<?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.
+
+-->
+
+
+<!--- Custom Spark Panel Skin created for Tour de Flex.
+
+@langversion 3.0
+@playerversion Flash 10
+@playerversion AIR 1.5
+@productversion Flex 4
+-->
+<s:SparkSkin xmlns:fx="http://ns.adobe.com/mxml/2009";
xmlns:s="library://ns.adobe.com/flex/spark" alpha.disabled="0.5"
+ blendMode.disabled="layer">
+
+ <fx:Metadata>
+ <![CDATA[
+ /**
+ * @copy spark.skins.spark.ApplicationSkin#hostComponent
+ */
+ [HostComponent("spark.components.Panel")]
+ ]]>
+ </fx:Metadata>
+
+ <fx:Script>
+ /* Define the skin elements that should not be colorized.
+ For panel, border and title backround are skinned, but the
content area and title text are not. */
+ static private const exclusions:Array = ["background",
"titleDisplay", "contentGroup", "bgFill"];
+
+ /**
+ * @copy spark.skins.SparkSkin#colorizeExclusions
+ */
+ override public function get colorizeExclusions():Array {return
exclusions;}
+
+ /* Define the content fill items that should be colored by the
"contentBackgroundColor" style. */
+ static private const contentFill:Array = [];
+
+ /**
+ * @inheritDoc
+ */
+ override public function get contentItems():Array {return
contentFill};
+ </fx:Script>
+
+ <s:states>
+ <s:State name="normal" />
+ <s:State name="disabled" />
+ <s:State name="normalWithControlBar" />
+ <s:State name="disabledWithControlBar" />
+ </s:states>
+
+ <!-- drop shadow -->
+ <s:RectangularDropShadow id="shadow" blurX="20" blurY="20" alpha="0.32"
distance="11"
+ angle="90"
color="#000000" left="0" top="0" right="0" bottom="0"/>
+
+ <!-- layer 1: border -->
+ <s:Rect left="0" right="0" top="0" bottom="0">
+ <s:stroke>
+ <s:SolidColorStroke color="0" alpha="0.50" weight="1" />
+ </s:stroke>
+ </s:Rect>
+
+
+ <!-- layer 2: background fill -->
+ <s:Rect left="0" right="0" bottom="0" height="15">
+ <s:fill>
+ <s:LinearGradient rotation="90">
+ <s:GradientEntry color="0xE2E2E2" />
+ <s:GradientEntry color="0x000000" />
+ </s:LinearGradient>
+ </s:fill>
+ </s:Rect>
+
+ <!-- layer 3: contents -->
+ <!--- contains the vertical stack of titlebar content and controlbar -->
+ <s:Group left="1" right="1" top="1" bottom="1" >
+ <s:layout>
+ <s:VerticalLayout gap="0" horizontalAlign="justify" />
+ </s:layout>
+
+ <s:Group id="topGroup" >
+ <!-- layer 0: title bar fill -->
+ <!-- Note: We have custom skinned the title bar to be
solid black for Tour de Flex -->
+ <s:Rect id="tbFill" left="0" right="0" top="0"
bottom="1" >
+ <s:fill>
+ <s:SolidColor color="0x000000" />
+ </s:fill>
+ </s:Rect>
+
+ <!-- layer 1: title bar highlight -->
+ <s:Rect id="tbHilite" left="0" right="0" top="0"
bottom="0" >
+ <s:stroke>
+ <s:LinearGradientStroke rotation="90"
weight="1">
+ <s:GradientEntry
color="0xEAEAEA" />
+ <s:GradientEntry
color="0xD9D9D9" />
+ </s:LinearGradientStroke>
+ </s:stroke>
+ </s:Rect>
+
+ <!-- layer 2: title bar divider -->
+ <s:Rect id="tbDiv" left="0" right="0" height="1"
bottom="0">
+ <s:fill>
+ <s:SolidColor color="0xC0C0C0" />
+ </s:fill>
+ </s:Rect>
+
+ <!-- layer 3: text -->
+ <!--- Defines the appearance of the PanelSkin class's
title bar. -->
+ <!-- Note: The title text display has been slightly
modified for Tour de Flex. -->
+ <s:Label id="titleDisplay" lineBreak="explicit"
+ left="9" top="1" bottom="0"
minHeight="30"
+ verticalAlign="middle"
fontWeight="bold" color="#E2E2E2">
+ </s:Label>
+ </s:Group>
+
+ <!--
+ Note: setting the minimum size to 0 here so that changes to the
host component's
+ size will not be thwarted by this skin part's minimum size.
This is a compromise,
+ more about it here: http://bugs.adobe.com/jira/browse/SDK-21143
+ -->
+ <s:Group id="contentGroup" width="100%" height="100%"
minWidth="0" minHeight="0">
+ </s:Group>
+
+ <s:Group id="bottomGroup" minWidth="0" minHeight="0"
+ includeIn="normalWithControlBar,
disabledWithControlBar" >
+
+ <!-- layer 0: control bar background -->
+ <!-- Note: We are skinning this to be the gradient in
case we do specify control
+ bar content, but it will only display if there's a
controlBarContent
+ property specified.-->
+ <s:Rect left="0" right="0" bottom="0" top="0"
height="15">
+ <s:fill>
+ <s:LinearGradient rotation="90">
+ <s:GradientEntry
color="0xE2E2E2" />
+ <s:GradientEntry
color="0x000000" />
+ </s:LinearGradient>
+ </s:fill>
+ </s:Rect>
+
+ <!-- layer 1: control bar divider line -->
+ <s:Rect left="0" right="0" top="0" height="1" >
+ <s:fill>
+ <s:SolidColor color="0xCDCDCD" />
+ </s:fill>
+ </s:Rect>
+
+ <!-- layer 2: control bar -->
+ <s:Group id="controlBarGroup" left="0" right="0"
top="1" bottom="0" minWidth="0" minHeight="0">
+ <s:layout>
+ <s:HorizontalLayout paddingLeft="10"
paddingRight="10" paddingTop="10" paddingBottom="10" />
+ </s:layout>
+ </s:Group>
+ </s:Group>
+ </s:Group>
+</s:SparkSkin>
Propchange:
flex/site/trunk/content/tourdeflex/spark/itemRenderers/skins/TDFPanelSkin.mxml
------------------------------------------------------------------------------
svn:eol-style = native
Added:
flex/site/trunk/content/tourdeflex/spark/layouts/CustomLayoutAnimatedExample.mxml
URL:
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/layouts/CustomLayoutAnimatedExample.mxml?rev=1619987&view=auto
==============================================================================
---
flex/site/trunk/content/tourdeflex/spark/layouts/CustomLayoutAnimatedExample.mxml
(added)
+++
flex/site/trunk/content/tourdeflex/spark/layouts/CustomLayoutAnimatedExample.mxml
Sat Aug 23 08:47:51 2014
@@ -0,0 +1,112 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+ Licensed to the Apache Software Foundation (ASF) under one or more
+ contributor license agreements. See the NOTICE file distributed with
+ this work for additional information regarding copyright ownership.
+ The ASF licenses this file to You under the Apache License, Version 2.0
+ (the "License"); you may not use this file except in compliance with
+ the License. You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+
+-->
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009";
+ xmlns:s="library://ns.adobe.com/flex/spark"
+ xmlns:mx="library://ns.adobe.com/flex/mx"
+ xmlns:local="*" xmlns:layouts="layouts.*"
+ backgroundColor="0x323232" color="0xFFFFFF"
+ initialize="init()">
+
+ <fx:Style>
+
+ @namespace s "library://ns.adobe.com/flex/spark";
+ @namespace mx "library://ns.adobe.com/flex/mx";
+
+
+ s|Application {
+ font-family: main;
+ font-size: 14;
+ }
+
+ </fx:Style>
+
+ <fx:Script>
+ <![CDATA[
+ import mx.collections.ArrayCollection;
+ import mx.rpc.xml.SimpleXMLDecoder;
+ import mx.rpc.xml.SimpleXMLEncoder;
+ import mx.utils.ArrayUtil;
+
+ [Bindable]
+ private var items:ArrayCollection;
+
+ [Bindable]
+ private var filteredItems:ArrayCollection;
+
+ [Bindable]
+ private var _maxPrice:Number = 1000;
+
+ [Bindable]
+ private var _camera:Boolean = false;
+
+ [Bindable]
+ private var _video:Boolean = false;
+
+ [Bindable]
+ private var _triband:Boolean = false;
+
+ [Embed(source="data/catalog.xml",
mimeType="application/octet-stream")]
+ private var XMLData:Class;
+
+ private function init():void
+ {
+ var data:XML = XML(new XMLData());
+ var xmlDoc:XMLDocument = new XMLDocument(data);
+ var decoder:SimpleXMLDecoder = new SimpleXMLDecoder(true);
+ var object:Object = decoder.decodeXML(xmlDoc);
+
+ items = object.catalog.product;
+ filteredItems = new
ArrayCollection(items.source);
+ filteredItems.filterFunction = filter;
+ }
+
+ private function selectionChange():void
+ {
+ filteredItems.refresh();
+ filterLayout.filter();
+ }
+
+ private function filter(item:Object):Boolean
+ {
+ return (item.price <= _maxPrice) &&
+ (!_camera || item.camera) &&
+ (!_video || item.video) &&
+ (!_triband || item.triband);
+ }
+
+ ]]>
+ </fx:Script>
+
+ <s:HGroup verticalAlign="middle" paddingLeft="8" left="50" top="5">
+ <s:Label text="Max Price:"/>
+ <s:HSlider id="priceSlider" minimum="0" maximum="1000"
snapInterval="100" value="@{_maxPrice}" change="selectionChange()"/>
+ <mx:Spacer width="20"/>
+ <s:CheckBox label="Camera" selected="@{_camera}"
change="selectionChange()"/>
+ <s:CheckBox label="Video" selected="@{_video}"
change="selectionChange()"/>
+ <s:CheckBox label="Triband" selected="@{_triband}"
change="selectionChange()"/>
+ </s:HGroup>
+
+ <s:DataGroup dataProvider="{items}"
itemRenderer="renderers.PhoneRenderer" top="50" left="0" right="0"
horizontalCenter="0">
+ <s:layout>
+ <layouts:FilteredTileLayout id="filterLayout"
filteredItems="{filteredItems}" />
+ </s:layout>
+ </s:DataGroup>
+
+</s:Application>
Propchange:
flex/site/trunk/content/tourdeflex/spark/layouts/CustomLayoutAnimatedExample.mxml
------------------------------------------------------------------------------
svn:eol-style = native
Added:
flex/site/trunk/content/tourdeflex/spark/layouts/CustomLayoutAnimatedExample.swf
URL:
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/layouts/CustomLayoutAnimatedExample.swf?rev=1619987&view=auto
==============================================================================
Binary file - no diff available.
Propchange:
flex/site/trunk/content/tourdeflex/spark/layouts/CustomLayoutAnimatedExample.swf
------------------------------------------------------------------------------
svn:mime-type = application/octet-stream
Added:
flex/site/trunk/content/tourdeflex/spark/layouts/CustomLayoutFlickrWheelExample.mxml
URL:
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/layouts/CustomLayoutFlickrWheelExample.mxml?rev=1619987&view=auto
==============================================================================
---
flex/site/trunk/content/tourdeflex/spark/layouts/CustomLayoutFlickrWheelExample.mxml
(added)
+++
flex/site/trunk/content/tourdeflex/spark/layouts/CustomLayoutFlickrWheelExample.mxml
Sat Aug 23 08:47:51 2014
@@ -0,0 +1,83 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+ Licensed to the Apache Software Foundation (ASF) under one or more
+ contributor license agreements. See the NOTICE file distributed with
+ this work for additional information regarding copyright ownership.
+ The ASF licenses this file to You under the Apache License, Version 2.0
+ (the "License"); you may not use this file except in compliance with
+ the License. You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+
+-->
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009";
+ xmlns:s="library://ns.adobe.com/flex/spark"
+ xmlns:mx="library://ns.adobe.com/flex/mx"
+ xmlns:my="*" minWidth="600" minHeight="350"
+ applicationComplete="requestPhotos()"
backgroundColor="0x323232">
+
+ <fx:Script>
+ <![CDATA[
+ import mx.collections.ArrayCollection;
+ import mx.rpc.events.ResultEvent;
+
+ import spark.components.Group;
+ import spark.components.supportClasses.GroupBase;
+ import spark.effects.animation.MotionPath;
+
+ [Bindable]
+ private var photoFeed:ArrayCollection;
+
+ private function requestPhotos():void {
+ var params:Object = new Object();
+ params.format = 'rss_200_enc';
+ params.tags = searchTerms.text;
+ photoService.send(params);
+ }
+
+ private function photoHandler(event:ResultEvent):void {
+ photoFeed = event.result.rss.channel.item as ArrayCollection;
+ }
+ ]]>
+ </fx:Script>
+
+ <fx:Declarations>
+ <s:HTTPService id="photoService"
+ url="http://api.flickr.com/services/feeds/photos_public.gne";
+ result="photoHandler(event)" />
+ </fx:Declarations>
+
+ <s:layout>
+ <s:VerticalLayout paddingTop="10" paddingLeft="10" paddingRight="10"
paddingBottom="10"/>
+ </s:layout>
+
+ <s:HGroup verticalAlign="middle">
+ <s:Label text="Flickr tags or search terms:" color="0xFFFFFF"/>
+ <s:TextInput id="searchTerms"
+ enter="requestPhotos()" text="bugs" />
+ <s:Button label="Search"
+ click="requestPhotos()" />
+ <!-- The slider to control the axis angle -->
+ <s:HSlider id="axisSlider" minimum="-90" maximum="90"
+ value="10" liveDragging="true" width="300"/>
+ </s:HGroup>
+
+ <s:List width="700" height="225"
+ dataProvider="{photoFeed}"
+ itemRenderer="FlickrThumbnail"
+ id="theList">
+
+ <s:layout>
+ <my:WheelLayout gap="20" axisAngle="{axisSlider.value}"/>
+ </s:layout>
+ </s:List>
+
+
+</s:Application>
Propchange:
flex/site/trunk/content/tourdeflex/spark/layouts/CustomLayoutFlickrWheelExample.mxml
------------------------------------------------------------------------------
svn:eol-style = native
Added:
flex/site/trunk/content/tourdeflex/spark/layouts/CustomLayoutFlickrWheelExample.swf
URL:
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/layouts/CustomLayoutFlickrWheelExample.swf?rev=1619987&view=auto
==============================================================================
Binary file - no diff available.
Propchange:
flex/site/trunk/content/tourdeflex/spark/layouts/CustomLayoutFlickrWheelExample.swf
------------------------------------------------------------------------------
svn:mime-type = application/octet-stream
Added:
flex/site/trunk/content/tourdeflex/spark/layouts/CustomLayoutFlowExample.mxml
URL:
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/layouts/CustomLayoutFlowExample.mxml?rev=1619987&view=auto
==============================================================================
---
flex/site/trunk/content/tourdeflex/spark/layouts/CustomLayoutFlowExample.mxml
(added)
+++
flex/site/trunk/content/tourdeflex/spark/layouts/CustomLayoutFlowExample.mxml
Sat Aug 23 08:47:51 2014
@@ -0,0 +1,85 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+ Licensed to the Apache Software Foundation (ASF) under one or more
+ contributor license agreements. See the NOTICE file distributed with
+ this work for additional information regarding copyright ownership.
+ The ASF licenses this file to You under the Apache License, Version 2.0
+ (the "License"); you may not use this file except in compliance with
+ the License. You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+
+-->
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009";
+ xmlns:s="library://ns.adobe.com/flex/spark"
+ xmlns:mx="library://ns.adobe.com/flex/halo"
+ xmlns:my="*">
+
+ <s:Panel width="100%" height="100%" title="Custom Layout - Flow Layout"
skinClass="skins.TDFPanelSkin">
+ <s:layout>
+ <s:VerticalLayout horizontalAlign="center"
+ paddingTop="10"
gap="10"/>
+ </s:layout>
+
+ <!-- The drop-down to select vertical alignment -->
+ <s:HGroup verticalAlign="middle">
+ <s:Label text="Vertical align"/>
+ <s:DropDownList id="vAlign" requireSelection="true"
color="0x000000">
+ <s:ArrayCollection>
+ <fx:String>bottom</fx:String>
+ <fx:String>middle</fx:String>
+ <fx:String>top</fx:String>
+ </s:ArrayCollection>
+ </s:DropDownList>
+ </s:HGroup>
+
+ <!-- The drop-down to select vertical alignment -->
+ <s:HGroup verticalAlign="middle">
+ <s:Label text="Horizontal align"/>
+ <s:DropDownList id="hAlign" requireSelection="true">
+ <s:ArrayCollection>
+ <fx:String>left</fx:String>
+ <fx:String>center</fx:String>
+ <fx:String>right</fx:String>
+ </s:ArrayCollection>
+ </s:DropDownList>
+ </s:HGroup>
+
+ <!-- The slider to control the list width -->
+ <s:HGroup verticalAlign="bottom">
+ <s:Label text="Container width"/>
+ <s:HSlider id="widthSlider" minimum="10" maximum="400"
+ value="200" liveDragging="true"/>
+ </s:HGroup>
+
+ <!-- The slider to control the horizontal gap -->
+ <s:HGroup verticalAlign="bottom">
+ <s:Label text="Horizontal gap"/>
+ <s:HSlider id="hGapSlider" minimum="0" maximum="50"
+ value="10" liveDragging="true"/>
+ </s:HGroup>
+
+ <!-- A Spark List -->
+ <s:List id="list1" width="{widthSlider.value}" height="112"
+ selectedIndex="7"
+ dataProvider="{new ArrayCollection(
+ 'The quick fox jumped over the lazy
sleepy\n\dog'.split(' '))}">
+
+ <!-- Configure the layout to be the FlowLayout -->
+ <s:layout>
+ <my:FlowLayout1
horizontalAlign="{hAlign.selectedItem}"
+
verticalAlign="{vAlign.selectedItem}"
+
horizontalGap="{hGapSlider.value}"/>
+ </s:layout>
+ </s:List>
+ </s:Panel>
+
+</s:Application>
+
Propchange:
flex/site/trunk/content/tourdeflex/spark/layouts/CustomLayoutFlowExample.mxml
------------------------------------------------------------------------------
svn:eol-style = native
Added:
flex/site/trunk/content/tourdeflex/spark/layouts/CustomLayoutFlowExample.swf
URL:
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/layouts/CustomLayoutFlowExample.swf?rev=1619987&view=auto
==============================================================================
Binary file - no diff available.
Propchange:
flex/site/trunk/content/tourdeflex/spark/layouts/CustomLayoutFlowExample.swf
------------------------------------------------------------------------------
svn:mime-type = application/octet-stream
Added:
flex/site/trunk/content/tourdeflex/spark/layouts/CustomLayoutHBaselineExample.mxml
URL:
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/layouts/CustomLayoutHBaselineExample.mxml?rev=1619987&view=auto
==============================================================================
---
flex/site/trunk/content/tourdeflex/spark/layouts/CustomLayoutHBaselineExample.mxml
(added)
+++
flex/site/trunk/content/tourdeflex/spark/layouts/CustomLayoutHBaselineExample.mxml
Sat Aug 23 08:47:51 2014
@@ -0,0 +1,118 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+ Licensed to the Apache Software Foundation (ASF) under one or more
+ contributor license agreements. See the NOTICE file distributed with
+ this work for additional information regarding copyright ownership.
+ The ASF licenses this file to You under the Apache License, Version 2.0
+ (the "License"); you may not use this file except in compliance with
+ the License. You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+
+-->
+<!--
http://evtimmy.com/2010/02/extending-horizontallayout-to-support-baseline-align-to-text/
-->
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009";
+ xmlns:s="library://ns.adobe.com/flex/spark"
+ xmlns:mx="library://ns.adobe.com/flex/mx"
+ xmlns:local="*">
+ <fx:Script>
+ <![CDATA[
+ import mx.events.FlexEvent;
+
+ import skins.TDFPanelSkin;
+
+ protected function update(event:Event):void
+ {
+ globalBaseline.top = theLayout.actualBaseline;
+ checkBoxBaseline.top = checkBox.y +
checkBox.baselinePosition;
+ labelBaseline.top = label.y +
label.baselinePosition;
+ labelBaseline.left = label.x;
+ buttonBaseline.top = button.y +
button.baselinePosition;
+ buttonBaseline.left = button.x;
+ }
+
+ ]]>
+ </fx:Script>
+
+ <s:Panel width="100%" height="100%" skinClass="skins.TDFPanelSkin"
title="CustomLayout with HBaselineLayout">
+
+ <!-- Controls -->
+ <s:HGroup left="14" top="5">
+ <s:VGroup>
+ <s:CheckBox label="Checkbox" id="showCheckBox"
selected="true"/>
+ <s:CheckBox label="Label" id="showLabel"
selected="true"/>
+ <s:CheckBox label="Button " id="showButton"
selected="true"/>
+ <s:CheckBox label="Layout " id="showLayout"
selected="true"/>
+ </s:VGroup>
+
+ <s:TileGroup requestedColumnCount="2">
+ <s:CheckBox id="baseline1Check" label="Offset
Checkbox baseline" selected="true"/>
+ <s:HSlider id="baseline1Slider" minimum="-100"
maximum="100" enabled="{baseline1Check.selected}" width="160"/>
+ <s:CheckBox id="baseline2Check" label="Offset
Label baseline" selected="true"/>
+ <s:HSlider id="baseline2Slider" minimum="-100"
maximum="100" enabled="{baseline2Check.selected}" width="160"/>
+ <s:CheckBox id="baseline3Check" label="Offset
Button baseline" selected="true"/>
+ <s:HSlider id="baseline3Slider" minimum="-100"
maximum="100" enabled="{baseline3Check.selected}" width="160"/>
+ <s:CheckBox id="baseline4Check" label="Offset
Layout baseline"/>
+ <s:HSlider id="baseline4Slider" minimum="-100"
maximum="100" enabled="{baseline4Check.selected}" width="160" value="15"/>
+ <s:CheckBox id="buttonHeightCheck"
label="Override Button height" selected="true"/>
+ <s:HSlider id="buttonHeightSlider" minimum="21"
maximum="150" enabled="{buttonHeightCheck.selected}" width="160" value="21"/>
+ </s:TileGroup>
+ </s:HGroup>
+
+
+ <s:Group id="container" updateComplete="update(event)"
top="138" horizontalCenter="0">
+ <s:layout>
+ <local:HBaselineLayout id="theLayout"
verticalAlign="baseline"
+
globalBaseline="{baseline4Check.selected ? baseline4Slider.value : NaN}"/>
+ </s:layout>
+ <s:CheckBox id="checkBox" label="One check box"
move="update(event)"
+
baseline="{baseline1Check.selected ? baseline1Slider.value : 0}"/>
+ <s:Label id="label" text="...and some random text..."
move="update(event)"
+ baseline="{baseline2Check.selected ?
baseline2Slider.value : 0}"/>
+ <s:Button id="button" label="and a Button!"
move="update(event)"
+ height="{buttonHeightCheck.selected ?
buttonHeightSlider.value : 21}"
+ baseline="{baseline3Check.selected ?
baseline3Slider.value : 0}"/>
+ <!-- visual guides for the baselines -->
+ <s:Group includeInLayout="false">
+ <s:Line width="{container.width}"
id="globalBaseline" top="{theLayout.actualBaseline}"
+ visible="{showLayout.selected}">
+ <s:stroke>
+ <s:SolidColorStroke
color="0x00FF00" weight="2"/>
+ </s:stroke>
+ </s:Line>
+
+ <s:Line width="{checkBox.width-1}"
id="checkBoxBaseline"
+
visible="{showCheckBox.selected}">
+ <s:stroke>
+ <s:SolidColorStroke
color="0xFF0000" alpha="0.5" weight="2"/>
+ </s:stroke>
+ </s:Line>
+
+ <s:Line width="{label.width-1}"
id="labelBaseline"
+ visible="{showLabel.selected}">
+ <s:stroke>
+ <s:SolidColorStroke
color="0x0000FF" alpha="0.5" weight="2"/>
+ </s:stroke>
+ </s:Line>
+
+ <s:Line width="{button.width-1}"
id="buttonBaseline"
+ visible="{showButton.selected}">
+ <s:stroke>
+ <s:SolidColorStroke
color="0xFF00FF" alpha="0.5" weight="2"/>
+ </s:stroke>
+ </s:Line>
+ </s:Group>
+ </s:Group>
+ <s:Label right="14" top="7" color="0x323232" width="200"
+ text="This sample shows how you can create a
custom layout to extend the HorizontalLayout to provide
+ baseline alignment functionality."/>
+ </s:Panel>
+
+</s:Application>
Propchange:
flex/site/trunk/content/tourdeflex/spark/layouts/CustomLayoutHBaselineExample.mxml
------------------------------------------------------------------------------
svn:eol-style = native
Added:
flex/site/trunk/content/tourdeflex/spark/layouts/CustomLayoutHBaselineExample.swf
URL:
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/layouts/CustomLayoutHBaselineExample.swf?rev=1619987&view=auto
==============================================================================
Binary file - no diff available.
Propchange:
flex/site/trunk/content/tourdeflex/spark/layouts/CustomLayoutHBaselineExample.swf
------------------------------------------------------------------------------
svn:mime-type = application/octet-stream
Added: flex/site/trunk/content/tourdeflex/spark/layouts/FlickrThumbnail.mxml
URL:
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/layouts/FlickrThumbnail.mxml?rev=1619987&view=auto
==============================================================================
--- flex/site/trunk/content/tourdeflex/spark/layouts/FlickrThumbnail.mxml
(added)
+++ flex/site/trunk/content/tourdeflex/spark/layouts/FlickrThumbnail.mxml Sat
Aug 23 08:47:51 2014
@@ -0,0 +1,80 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+ Licensed to the Apache Software Foundation (ASF) under one or more
+ contributor license agreements. See the NOTICE file distributed with
+ this work for additional information regarding copyright ownership.
+ The ASF licenses this file to You under the Apache License, Version 2.0
+ (the "License"); you may not use this file except in compliance with
+ the License. You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+
+-->
+<s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009";
+ xmlns:s="library://ns.adobe.com/flex/spark"
+ xmlns:mx="library://ns.adobe.com/flex/mx"
click="itemrenderer1_clickHandler(event)">
+
+ <fx:Script>
+ <![CDATA[
+ import spark.components.supportClasses.GroupBase;
+ import spark.effects.Animate;
+ import spark.effects.animation.MotionPath;
+ import spark.effects.animation.SimpleMotionPath;
+ protected function
itemrenderer1_clickHandler(event:MouseEvent):void
+ {
+ var g:GroupBase = parent as GroupBase;
+ var p:Point =
g.layout.getScrollPositionDeltaToElement(this.itemIndex);
+ if (p)
+ {
+ var startX:Number = g.horizontalScrollPosition;
+ var startY:Number = g.verticalScrollPosition;
+ var anim:Animate = new Animate();
+ anim.motionPaths = new <MotionPath>[
+ new SimpleMotionPath("horizontalScrollPosition",
startX, startX + p.x, 500),
+ new SimpleMotionPath("verticalScrollPosition", startY,
startY + p.y, 500)
+ ];
+
+ var interpolator:NumberInterpolatorWrapping = new
NumberInterpolatorWrapping(0, g.contentWidth - g.width);
+ var scrollLength:Number = interpolator.getLength(startX,
startX + p.x);
+ anim.interpolator = interpolator;
+ anim.duration = Math.max(550, Math.min(2500, scrollLength
* 2));
+
+ anim.play([g]);
+ }
+ }
+ ]]>
+ </fx:Script>
+
+
+ <s:states>
+ <s:State name="normal"/>
+ <s:State name="hovered"/>
+ <s:State name="selected"/>
+ </s:states>
+
+ <s:Rect id="border" left="0" right="0" top="0" bottom="0">
+ <s:fill>
+ <s:SolidColor color="0xDFDFDF" color.hovered="0xFF0000"
color.selected="0x00FF00"/>
+ </s:fill>
+ </s:Rect>
+
+ <s:Group left="1" right="1" top="1" bottom="1">
+ <s:layout>
+ <s:VerticalLayout horizontalAlign="center"/>
+ </s:layout>
+
+ <mx:Image
+ width="75" height="75"
+ source="{data.thumbnail.url}" />
+ <s:Label text="{data.credit}" maxWidth="100" textAlign="center"/>
+ </s:Group>
+
+</s:ItemRenderer>
+
Propchange:
flex/site/trunk/content/tourdeflex/spark/layouts/FlickrThumbnail.mxml
------------------------------------------------------------------------------
svn:eol-style = native
Added: flex/site/trunk/content/tourdeflex/spark/layouts/FlowLayout1.as
URL:
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/layouts/FlowLayout1.as?rev=1619987&view=auto
==============================================================================
--- flex/site/trunk/content/tourdeflex/spark/layouts/FlowLayout1.as (added)
+++ flex/site/trunk/content/tourdeflex/spark/layouts/FlowLayout1.as Sat Aug 23
08:47:51 2014
@@ -0,0 +1,195 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+// Licensed to the Apache Software Foundation (ASF) under one or more
+// contributor license agreements. See the NOTICE file distributed with
+// this work for additional information regarding copyright ownership.
+// The ASF licenses this file to You under the Apache License, Version 2.0
+// (the "License"); you may not use this file except in compliance with
+// the License. You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+////////////////////////////////////////////////////////////////////////////////
+package
+{
+import mx.core.ILayoutElement;
+
+import spark.components.supportClasses.GroupBase;
+import spark.layouts.supportClasses.LayoutBase;
+
+public class FlowLayout1 extends LayoutBase
+{
+
+ //---------------------------------------------------------------
+ //
+ // Class properties
+ //
+ //---------------------------------------------------------------
+
+ //---------------------------------------------------------------
+ // horizontalGap
+ //---------------------------------------------------------------
+
+ private var _horizontalGap:Number = 10;
+
+ public function set horizontalGap(value:Number):void
+ {
+ _horizontalGap = value;
+
+ // We must invalidate the layout
+ var layoutTarget:GroupBase = target;
+ if (layoutTarget)
+ layoutTarget.invalidateDisplayList();
+ }
+
+ //---------------------------------------------------------------
+ // verticalAlign
+ //---------------------------------------------------------------
+
+ private var _verticalAlign:String = "bottom";
+
+ public function set verticalAlign(value:String):void
+ {
+ _verticalAlign = value;
+
+ // We must invalidate the layout
+ var layoutTarget:GroupBase = target;
+ if (layoutTarget)
+ layoutTarget.invalidateDisplayList();
+ }
+
+ //---------------------------------------------------------------
+ // horizontalAlign
+ //---------------------------------------------------------------
+
+ private var _horizontalAlign:String = "left"; // center, right
+
+ public function set horizontalAlign(value:String):void
+ {
+ _horizontalAlign = value;
+
+ // We must invalidate the layout
+ var layoutTarget:GroupBase = target;
+ if (layoutTarget)
+ layoutTarget.invalidateDisplayList();
+ }
+
+ //---------------------------------------------------------------
+ //
+ // Class methods
+ //
+ //---------------------------------------------------------------
+
+ override public function updateDisplayList(containerWidth:Number,
+ containerHeight:Number):void
+ {
+ var element:ILayoutElement;
+ var layoutTarget:GroupBase = target;
+ var count:int = layoutTarget.numElements;
+ var hGap:Number = _horizontalGap;
+
+ // The position for the current element
+ var x:Number = 0;
+ var y:Number = 0;
+ var elementWidth:Number;
+ var elementHeight:Number;
+
+ var vAlign:Number = 0;
+ switch (_verticalAlign)
+ {
+ case "middle" : vAlign = 0.5; break;
+ case "bottom" : vAlign = 1; break;
+ }
+
+ // Keep track of per-row height, maximum row width
+ var maxRowWidth:Number = 0;
+
+ // loop through the elements
+ // while we can start a new row
+ var rowStart:int = 0;
+ while (rowStart < count)
+ {
+ // The row always contains the start element
+ element = useVirtualLayout ?
layoutTarget.getVirtualElementAt(rowStart) :
+
layoutTarget.getElementAt(rowStart);
+
+ var rowWidth:Number = element.getPreferredBoundsWidth();
+ var rowHeight:Number = element.getPreferredBoundsHeight();
+
+ // Find the end of the current row
+ var rowEnd:int = rowStart;
+ while (rowEnd + 1 < count)
+ {
+ element = useVirtualLayout ?
layoutTarget.getVirtualElementAt(rowEnd + 1) :
+
layoutTarget.getElementAt(rowEnd + 1);
+
+ // Since we haven't resized the element just yet, get its
preferred size
+ elementWidth = element.getPreferredBoundsWidth();
+ elementHeight = element.getPreferredBoundsHeight();
+
+ // Can we add one more element to this row?
+ if (rowWidth + hGap + elementWidth > containerWidth)
+ break;
+
+ rowWidth += hGap + elementWidth;
+ rowHeight = Math.max(rowHeight, elementHeight);
+ rowEnd++;
+ }
+
+ x = 0;
+ switch (_horizontalAlign)
+ {
+ case "center" : x = Math.round(containerWidth -
rowWidth) / 2; break;
+ case "right" : x = containerWidth - rowWidth;
+ }
+
+ // Keep track of the maximum row width so that we can
+ // set the correct contentSize
+ maxRowWidth = Math.max(maxRowWidth, x + rowWidth);
+
+ // Layout all the elements within the row
+ for (var i:int = rowStart; i <= rowEnd; i++)
+ {
+ element = useVirtualLayout ?
layoutTarget.getVirtualElementAt(i) :
+
layoutTarget.getElementAt(i);
+
+ // Resize the element to its preferred size by passing
+ // NaN for the width and height constraints
+ element.setLayoutBoundsSize(NaN, NaN);
+
+ // Find out the element's dimensions sizes.
+ // We do this after the element has been already resized
+ // to its preferred size.
+ elementWidth = element.getLayoutBoundsWidth();
+ elementHeight = element.getLayoutBoundsHeight();
+
+ // Calculate the position within the row
+ var elementY:Number = Math.round((rowHeight - elementHeight) *
vAlign);
+
+ // Position the element
+ element.setLayoutBoundsPosition(x, y + elementY);
+
+ x += hGap + elementWidth;
+ }
+
+ // Next row will start with the first element after the current
row's end
+ rowStart = rowEnd + 1;
+
+ // Update the position to the beginning of the row
+ x = 0;
+ y += rowHeight;
+ }
+
+ // Set the content size which determines the scrolling limits
+ // and is used by the Scroller to calculate whether to show up
+ // the scrollbars when the the scroll policy is set to "auto"
+ layoutTarget.setContentSize(maxRowWidth, y);
+ }
+}
+}
\ No newline at end of file
Propchange: flex/site/trunk/content/tourdeflex/spark/layouts/FlowLayout1.as
------------------------------------------------------------------------------
svn:eol-style = native
Added: flex/site/trunk/content/tourdeflex/spark/layouts/HBaselineLayout.as
URL:
http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/layouts/HBaselineLayout.as?rev=1619987&view=auto
==============================================================================
--- flex/site/trunk/content/tourdeflex/spark/layouts/HBaselineLayout.as (added)
+++ flex/site/trunk/content/tourdeflex/spark/layouts/HBaselineLayout.as Sat Aug
23 08:47:51 2014
@@ -0,0 +1,199 @@
+////////////////////////////////////////////////////////////////////////////////
+//
+// Licensed to the Apache Software Foundation (ASF) under one or more
+// contributor license agreements. See the NOTICE file distributed with
+// this work for additional information regarding copyright ownership.
+// The ASF licenses this file to You under the Apache License, Version 2.0
+// (the "License"); you may not use this file except in compliance with
+// the License. You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+//
+////////////////////////////////////////////////////////////////////////////////
+package {
+
+import mx.core.ILayoutElement;
+import mx.events.PropertyChangeEvent;
+import mx.formatters.NumberBase;
+
+import spark.components.supportClasses.GroupBase;
+import spark.layouts.HorizontalLayout;
+
+public class HBaselineLayout extends HorizontalLayout
+{
+ public function HBaselineLayout()
+ {
+ super();
+ }
+
+ //----------------------------------
+ // globalBaseline
+ //----------------------------------
+
+ [Inspectable(category="General")]
+
+ private var _globalBaseline:Number = NaN;
+ public function get globalBaseline():Number
+ {
+ return _globalBaseline;
+ }
+
+ public function set globalBaseline(value:Number):void
+ {
+ _globalBaseline = value;
+ var target:GroupBase = this.target;
+ if (target)
+ {
+ target.invalidateSize();
+ target.invalidateDisplayList();
+ }
+ }
+
+ //----------------------------------
+ // actualBaseline
+ //----------------------------------
+
+ private var _actualBaseline:Number;
+
+ [Bindable("propertyChange")]
+ [Inspectable(category="General")]
+
+ public function get actualBaseline():Number
+ {
+ return _actualBaseline;
+ }
+
+ private function setActualBaseline(value:Number):void
+ {
+ if (value == _actualBaseline)
+ return;
+
+ var oldValue:Number = _actualBaseline;
+ _actualBaseline = value;
+ dispatchEvent(PropertyChangeEvent.createUpdateEvent(this,
"actualBaseline", oldValue, value));
+ }
+
+ //----------------------------------
+ // verticalAlign
+ //----------------------------------
+
+ [Inspectable(category="General",
enumeration="top,bottom,middle,justify,contentJustify,baseline",
defaultValue="top")]
+ override public function get verticalAlign():String
+ {
+ return super.verticalAlign;
+ }
+
+ /**
+ * @private
+ */
+ override public function measure():void
+ {
+ super.measure();
+
+ var target:GroupBase = this.target;
+ if (!target || verticalAlign != "baseline")
+ return;
+
+ measureBaseline(true /*usePreferredSize*/);
+ if (!isNaN(_globalBaseline))
+ measuredBaselineTop = _globalBaseline;
+
+ // The measured height is the sum of the space above and below
the baseline
+ if (isNaN(paddingTop))
+ measuredBaselineTop += paddingTop;
+ if (isNaN(paddingBottom))
+ measuredBaselineBottom += paddingBottom;
+ target.measuredHeight = Math.round(measuredBaselineTop +
measuredBaselineBottom);
+ }
+
+ /**
+ * @private
+ */
+ override public function updateDisplayList(unscaledWidth:Number,
unscaledHeight:Number):void
+ {
+ super.updateDisplayList(unscaledWidth, unscaledHeight);
+
+ var target:GroupBase = this.target;
+ if (!target || verticalAlign != "baseline")
+ return;
+
+ measureBaseline(false /*usePreferredSize*/);
+ if (!isNaN(_globalBaseline))
+ measuredBaselineTop = _globalBaseline;
+
+ if (isNaN(paddingTop))
+ measuredBaselineTop += paddingTop;
+
+ // Adjust the position of the elements
+ var contentHeight:Number = 0;
+ var count:int = target.numElements;
+ for (var i:int = 0; i < count; i++)
+ {
+ var element:ILayoutElement = target.getElementAt(i);
+ if (!element || !element.includeInLayout)
+ continue;
+
+ var elementBaseline:Number = element.baseline as Number;
+ if (isNaN(elementBaseline))
+ elementBaseline = 0;
+
+ var baselinePosition:Number = element.baselinePosition;
+ var y:Number = measuredBaselineTop + (elementBaseline -
baselinePosition);
+
element.setLayoutBoundsPosition(element.getLayoutBoundsX(), y);
+ contentHeight = Math.max(contentHeight,
element.getLayoutBoundsHeight() + y);
+ }
+
+ // Adjust the content height
+ if (isNaN(paddingBottom))
+ contentHeight += paddingBottom;
+ target.setContentSize(target.contentWidth, contentHeight);
+
+ // Update the baseline
+ setActualBaseline(measuredBaselineTop);
+ }
+
+ private var measuredBaselineTop:Number = 0; // How
much space is needed above the baseline to fit all the elements
+ private var measuredBaselineBottom:Number = 0; // How much
space is needed below the baseline to fit all the elements
+
+ /**
+ * @private
+ */
+ private function measureBaseline(usePreferredSize:Boolean):void
+ {
+ var elementBaseline:Number = 0; // The
current element's explicit baseline constraint
+ var elementBaselineTop:Number = 0; // The
portiono of the current element that's above the baseline
+ var elementBaselineBottom:Number = 0; // The portion
of the current element that's below the baseline
+
+ measuredBaselineTop = 0;
+ measuredBaselineBottom = 0;
+
+ var count:int = target.numElements;
+ for (var i:int = 0; i < count; i++)
+ {
+ var element:ILayoutElement = target.getElementAt(i);
+ if (!element || !element.includeInLayout)
+ continue;
+
+ var elementHeight:Number = usePreferredSize ?
element.getPreferredBoundsHeight() :
+
element.getLayoutBoundsHeight();
+ elementBaseline = element.baseline as Number;
+ if (isNaN(elementBaseline))
+ elementBaseline = 0;
+
+ var baselinePosition:Number = element.baselinePosition;
+
+ elementBaselineTop = baselinePosition - elementBaseline;
+ elementBaselineBottom = elementHeight -
elementBaselineTop;
+
+ measuredBaselineTop = Math.max(elementBaselineTop,
measuredBaselineTop);
+ measuredBaselineBottom =
Math.max(elementBaselineBottom, measuredBaselineBottom);
+ }
+ }
+}
+}
\ No newline at end of file
Propchange: flex/site/trunk/content/tourdeflex/spark/layouts/HBaselineLayout.as
------------------------------------------------------------------------------
svn:eol-style = native
