You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@flex.apache.org by bi...@apache.org on 2014/08/23 10:48:22 UTC
svn commit: r1619987 [9/22] - in /flex/site/trunk/content/tourdeflex: ./ mx/
mx/charts/ mx/containers/ mx/containers/assets/ mx/controls/
mx/controls/assets/ mx/core/ mx/effects/ mx/effects/assets/ mx/formatters/
mx/printing/ mx/states/ mx/validators/ ...
Added: flex/site/trunk/content/tourdeflex/spark/containers/SampleHGroup.mxml
URL: http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/containers/SampleHGroup.mxml?rev=1619987&view=auto
==============================================================================
--- flex/site/trunk/content/tourdeflex/spark/containers/SampleHGroup.mxml (added)
+++ flex/site/trunk/content/tourdeflex/spark/containers/SampleHGroup.mxml Sat Aug 23 08:47:51 2014
@@ -0,0 +1,98 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+ Licensed to the Apache Software Foundation (ASF) under one or more
+ contributor license agreements. See the NOTICE file distributed with
+ this work for additional information regarding copyright ownership.
+ The ASF licenses this file to You under the Apache License, Version 2.0
+ (the "License"); you may not use this file except in compliance with
+ the License. You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+
+-->
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
+ xmlns:s="library://ns.adobe.com/flex/spark"
+ xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
+
+ <fx:Declarations>
+ <!-- Place non-visual elements (e.g., services, value objects) here -->
+ </fx:Declarations>
+
+ <fx:Script>
+ <![CDATA[
+ import skins.TDFPanelSkin;
+
+ private function applyProperties():void
+ {
+ this.mainHGroup.paddingTop = this.padTop.value;
+ this.mainHGroup.paddingLeft = this.padLeft.value;
+ this.mainHGroup.paddingRight = this.padRight.value;
+ this.mainHGroup.paddingBottom = this.padBottom.value;
+ this.mainHGroup.gap = this.gap.value;
+ }
+ ]]>
+ </fx:Script>
+
+ <s:Panel skinClass="skins.TDFPanelSkin" title="HGroup" width="100%" height="100%">
+
+ <s:HGroup left="300" top="25" id="mainHGroup">
+ <s:Rect width="100" height="75">
+ <s:fill>
+ <s:SolidColor color="0xd54f4f"/>
+ </s:fill>
+ </s:Rect>
+ <s:Rect width="100" height="75">
+ <s:fill>
+ <s:SolidColor color="0x2f977d"/>
+ </s:fill>
+ </s:Rect>
+ <s:Rect width="100" height="75">
+ <s:fill>
+ <s:SolidColor color="0xfffca2"/>
+ </s:fill>
+ </s:Rect>
+ </s:HGroup>
+
+ <s:VGroup top="10" left="15">
+ <s:HGroup verticalAlign="middle">
+ <s:Label text="Gap:"/>
+ <s:NumericStepper id="gap" maximum="400"/>
+ </s:HGroup>
+
+ <s:HGroup verticalAlign="middle">
+ <s:Label text="Padding Top:"/>
+ <s:NumericStepper id="padTop" maximum="400"/>
+ </s:HGroup>
+
+ <s:HGroup verticalAlign="middle">
+ <s:Label text="Padding Left:"/>
+ <s:NumericStepper id="padLeft" maximum="400"/>
+ </s:HGroup>
+
+ <s:HGroup verticalAlign="middle">
+ <s:Label text="Padding Right:"/>
+ <s:NumericStepper id="padRight" maximum="400"/>
+ </s:HGroup>
+
+ <s:HGroup verticalAlign="middle">
+ <s:Label text="Padding Bottom:"/>
+ <s:NumericStepper id="padBottom" maximum="400"/>
+ </s:HGroup>
+
+ <s:Button label="Apply Properties" click="this.applyProperties()"/>
+ <s:Label width="75%" horizontalCenter="0" color="#323232"
+ text="The HGroup container is an instance of the Group container that uses the HorizontalLayout class. You can use
+ the properties of the HGroup class to modify the characteristics of the HorizontalLayout class."/>
+ </s:VGroup>
+
+
+ </s:Panel>
+
+</s:Application>
\ No newline at end of file
Propchange: flex/site/trunk/content/tourdeflex/spark/containers/SampleHGroup.mxml
------------------------------------------------------------------------------
svn:eol-style = native
Added: flex/site/trunk/content/tourdeflex/spark/containers/SampleHGroup.swf
URL: http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/containers/SampleHGroup.swf?rev=1619987&view=auto
==============================================================================
Binary file - no diff available.
Propchange: flex/site/trunk/content/tourdeflex/spark/containers/SampleHGroup.swf
------------------------------------------------------------------------------
svn:mime-type = application/octet-stream
Added: flex/site/trunk/content/tourdeflex/spark/containers/SampleVGroup.mxml
URL: http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/containers/SampleVGroup.mxml?rev=1619987&view=auto
==============================================================================
--- flex/site/trunk/content/tourdeflex/spark/containers/SampleVGroup.mxml (added)
+++ flex/site/trunk/content/tourdeflex/spark/containers/SampleVGroup.mxml Sat Aug 23 08:47:51 2014
@@ -0,0 +1,97 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+ Licensed to the Apache Software Foundation (ASF) under one or more
+ contributor license agreements. See the NOTICE file distributed with
+ this work for additional information regarding copyright ownership.
+ The ASF licenses this file to You under the Apache License, Version 2.0
+ (the "License"); you may not use this file except in compliance with
+ the License. You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+
+-->
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
+ xmlns:s="library://ns.adobe.com/flex/spark"
+ xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
+
+ <fx:Declarations>
+ <!-- Place non-visual elements (e.g., services, value objects) here -->
+ </fx:Declarations>
+
+ <fx:Script>
+ <![CDATA[
+ import skins.TDFPanelSkin;
+
+ private function applyProperties():void
+ {
+ this.mainVGroup.paddingTop = this.padTop.value;
+ this.mainVGroup.paddingLeft = this.padLeft.value;
+ this.mainVGroup.paddingRight = this.padRight.value;
+ this.mainVGroup.paddingBottom = this.padBottom.value;
+ this.mainVGroup.gap = this.gap.value;
+ }
+ ]]>
+ </fx:Script>
+
+ <s:Panel skinClass="skins.TDFPanelSkin" title="VGroup Sample" width="100%" height="100%">
+ <s:HGroup width="100%" height="100%" top="10" left="10">
+ <s:VGroup top="10" left="10" width="172">
+ <s:HGroup verticalAlign="middle">
+ <s:Label text="Gap:"/>
+ <s:NumericStepper id="gap" maximum="400"/>
+ </s:HGroup>
+
+ <s:HGroup verticalAlign="middle">
+ <s:Label text="Padding Top:"/>
+ <s:NumericStepper id="padTop" maximum="400"/>
+ </s:HGroup>
+
+ <s:HGroup verticalAlign="middle">
+ <s:Label text="Padding Left:"/>
+ <s:NumericStepper id="padLeft" maximum="400"/>
+ </s:HGroup>
+
+ <s:HGroup verticalAlign="middle">
+ <s:Label text="Padding Right:"/>
+ <s:NumericStepper id="padRight" maximum="400"/>
+ </s:HGroup>
+
+ <s:HGroup verticalAlign="middle">
+ <s:Label text="Padding Bottom:"/>
+ <s:NumericStepper id="padBottom" maximum="400"/>
+ </s:HGroup>
+
+ <s:Button label="Apply Properties" click="this.applyProperties()"/>
+ </s:VGroup>
+ <s:VGroup left="300" top="10" id="mainVGroup">
+ <s:Rect width="100" height="75">
+ <s:fill>
+ <s:SolidColor color="0xd54f4f"/>
+ </s:fill>
+ </s:Rect>
+ <s:Rect width="100" height="75">
+ <s:fill>
+ <s:SolidColor color="0x2f977d"/>
+ </s:fill>
+ </s:Rect>
+ <s:Rect width="100" height="75">
+ <s:fill>
+ <s:SolidColor color="0xfffca2"/>
+ </s:fill>
+ </s:Rect>
+ </s:VGroup>
+ <mx:Spacer width="10"/>
+ <s:Label width="40%" horizontalCenter="0" color="#323232"
+ text="The VGroup container is an instance of the Group container that uses the VerticalLayout class. You can use the properties of the VGroup class to modify the characteristics of the VerticalLayout class." height="100%"/>
+
+ </s:HGroup>
+ </s:Panel>
+
+</s:Application>
Propchange: flex/site/trunk/content/tourdeflex/spark/containers/SampleVGroup.mxml
------------------------------------------------------------------------------
svn:eol-style = native
Added: flex/site/trunk/content/tourdeflex/spark/containers/SampleVGroup.swf
URL: http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/containers/SampleVGroup.swf?rev=1619987&view=auto
==============================================================================
Binary file - no diff available.
Propchange: flex/site/trunk/content/tourdeflex/spark/containers/SampleVGroup.swf
------------------------------------------------------------------------------
svn:mime-type = application/octet-stream
Added: flex/site/trunk/content/tourdeflex/spark/containers/SampleVerticalHorizontalAlign.mxml
URL: http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/containers/SampleVerticalHorizontalAlign.mxml?rev=1619987&view=auto
==============================================================================
--- flex/site/trunk/content/tourdeflex/spark/containers/SampleVerticalHorizontalAlign.mxml (added)
+++ flex/site/trunk/content/tourdeflex/spark/containers/SampleVerticalHorizontalAlign.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.
+
+-->
+<!-- http://evtimmy.com/2010/01/verticalalign-for-vgroup-and-horizontalalign-for-hgroup/ -->
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
+ xmlns:s="library://ns.adobe.com/flex/spark"
+ xmlns:mx="library://ns.adobe.com/flex/mx" backgroundColor="0x323232" color="0xFFFFFF">
+
+ <s:VGroup verticalAlign="middle" width="526" height="230" top="57" left="10">
+ <s:HGroup verticalAlign="middle" height="100%" color="0x000000">
+ <s:Label text="VGroup" rotation="-90" color="0xFF0000"/>
+ <s:BorderContainer minWidth="0" minHeight="0">
+ <s:VGroup height="{heightSlider.value}"
+ verticalAlign="{verticalAlignChoice.selectedItem}"
+ gap="0">
+ <s:Label text="Lorem ipsum dolor sit amet, " height="22" verticalAlign="middle"/>
+ <s:Label text="consectetur adipiscing elit." height="22" verticalAlign="middle"/>
+
+ </s:VGroup>
+ </s:BorderContainer>
+
+ <s:Label text="VGroup in Scroller" rotation="-90" color="0xFF0000"/>
+ <s:BorderContainer minWidth="0" minHeight="0">
+ <s:Scroller height="{heightSlider.value}">
+ <s:VGroup verticalAlign="{verticalAlignChoice.selectedItem}"
+ gap="0">
+ <s:Label text="Lorem ipsum dolor sit amet, " height="22" verticalAlign="middle"/>
+ <s:Label text="consectetur adipiscing elit." height="22" verticalAlign="middle"/>
+
+ </s:VGroup>
+ </s:Scroller>
+ </s:BorderContainer>
+
+ <s:Label text="List" rotation="-90" color="0xFF0000"/>
+
+ <s:List minWidth="0" minHeight="0" height="{heightSlider.value+2}">
+ <s:layout>
+ <s:VerticalLayout requestedMinRowCount="0"
+ verticalAlign="{verticalAlignChoice.selectedItem}"
+ gap="0"/>
+ </s:layout>
+ <s:ArrayCollection>
+ <fx:String>Lorem ipsum dolor sit amet, </fx:String>
+ <fx:String>consectetur adipiscing elit.</fx:String>
+ </s:ArrayCollection>
+ </s:List>
+ </s:HGroup>
+ </s:VGroup>
+
+ <s:HGroup horizontalAlign="center" paddingTop="10" paddingLeft="10">
+ <s:HGroup>
+ <s:Label text="VerticalAlign:"/>
+ <s:DropDownList id="verticalAlignChoice" requireSelection="true" color="0x000000">
+ <s:dataProvider>
+ <s:ArrayCollection source="{'top bottom middle'.split(' ')}"/>
+ </s:dataProvider>
+ </s:DropDownList>
+ </s:HGroup>
+ <s:HGroup>
+ <s:Label text="Height:"/>
+ <s:HSlider id="heightSlider" minimum="0" maximum="425" value="100" width="300"/>
+ </s:HGroup>
+ </s:HGroup>
+ <s:Label right="7" top="26" width="200"
+ text="This sample show the use of the verticalAlign and horizontalAlign properties for use with a VGroup and
+HGroup accordingly."/>
+</s:Application>
Propchange: flex/site/trunk/content/tourdeflex/spark/containers/SampleVerticalHorizontalAlign.mxml
------------------------------------------------------------------------------
svn:eol-style = native
Added: flex/site/trunk/content/tourdeflex/spark/containers/SampleVerticalHorizontalAlign.swf
URL: http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/containers/SampleVerticalHorizontalAlign.swf?rev=1619987&view=auto
==============================================================================
Binary file - no diff available.
Propchange: flex/site/trunk/content/tourdeflex/spark/containers/SampleVerticalHorizontalAlign.swf
------------------------------------------------------------------------------
svn:mime-type = application/octet-stream
Added: flex/site/trunk/content/tourdeflex/spark/containers/SkinableDataContainerExample.mxml
URL: http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/containers/SkinableDataContainerExample.mxml?rev=1619987&view=auto
==============================================================================
--- flex/site/trunk/content/tourdeflex/spark/containers/SkinableDataContainerExample.mxml (added)
+++ flex/site/trunk/content/tourdeflex/spark/containers/SkinableDataContainerExample.mxml Sat Aug 23 08:47:51 2014
@@ -0,0 +1,62 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+ Licensed to the Apache Software Foundation (ASF) under one or more
+ contributor license agreements. See the NOTICE file distributed with
+ this work for additional information regarding copyright ownership.
+ The ASF licenses this file to You under the Apache License, Version 2.0
+ (the "License"); you may not use this file except in compliance with
+ the License. You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+
+-->
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
+ xmlns:s="library://ns.adobe.com/flex/spark"
+ xmlns:mx="library://ns.adobe.com/flex/mx">
+
+ <s:Panel width="100%" height="100%" title="SkinnableDataContainer" skinClass="skins.TDFPanelSkin">
+ <s:layout><s:HorizontalLayout paddingLeft="8" paddingTop="8" paddingRight="12"/></s:layout>
+
+ <s:VGroup>
+ <s:Label text="Famous Astronauts" fontWeight="bold" fontSize="14"/>
+ <s:SkinnableDataContainer horizontalCenter="-66" verticalCenter="0" width="301">
+ <s:layout>
+ <s:VerticalLayout/>
+ </s:layout>
+ <s:itemRenderer>
+ <fx:Component>
+ <s:ItemRenderer>
+ <s:VGroup horizontalCenter="0" verticalCenter="0">
+ <s:HGroup verticalAlign="middle">
+ <s:Label text="{data.firstName}"/>
+ <s:Label text="{data.lastName}"/>
+ <s:Label text="{data.phoneNumber}"/>
+ <mx:LinkButton label="{data.college}" color="0x3380DD" click="navigateToURL(new URLRequest(data.url), '_blank')"
+ textDecoration="underline" fontWeight="normal" icon="@Embed('assets/arrow_icon_sm.png')" />
+ </s:HGroup>
+ </s:VGroup>
+ </s:ItemRenderer>
+ </fx:Component>
+ </s:itemRenderer>
+
+ <s:ArrayCollection>
+ <fx:Object firstName="John" lastName="Glenn" phoneNumber="888-555-1111" college="West Point" url="http://www.usma.edu/"/>
+ <fx:Object firstName="Neil" lastName="Armstrong" phoneNumber="888-555-2222" college="Purdue" url="http://www.purdue.edu/"/>
+ <fx:Object firstName="Buzz" lastName="Aldrin" phoneNumber="888-555-3333" college="Muskingum" url="http://www.muskingum.edu/"/>
+ <fx:Object firstName="James" lastName="Lovell" phoneNumber="888-555-4444" college="US Naval Academy" url="http://www.usna.edu/"/>
+ </s:ArrayCollection>
+ </s:SkinnableDataContainer>
+ </s:VGroup>
+ <s:Label color="0x323232" width="200" text="The SkinnableDataContainer is the skinnable version of the DataGroup and
+while it can hold visual elements, they are often used only to hold data items as children. Data items can be simple data items
+such String and Number objects, and more complicated data items such as Object and XMLNode objects."/>
+ </s:Panel>
+
+</s:Application>
Propchange: flex/site/trunk/content/tourdeflex/spark/containers/SkinableDataContainerExample.mxml
------------------------------------------------------------------------------
svn:eol-style = native
Added: flex/site/trunk/content/tourdeflex/spark/containers/SkinableDataContainerExample.swf
URL: http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/containers/SkinableDataContainerExample.swf?rev=1619987&view=auto
==============================================================================
Binary file - no diff available.
Propchange: flex/site/trunk/content/tourdeflex/spark/containers/SkinableDataContainerExample.swf
------------------------------------------------------------------------------
svn:mime-type = application/octet-stream
Added: flex/site/trunk/content/tourdeflex/spark/containers/TabNavigator1Example.mxml
URL: http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/containers/TabNavigator1Example.mxml?rev=1619987&view=auto
==============================================================================
--- flex/site/trunk/content/tourdeflex/spark/containers/TabNavigator1Example.mxml (added)
+++ flex/site/trunk/content/tourdeflex/spark/containers/TabNavigator1Example.mxml Sat Aug 23 08:47:51 2014
@@ -0,0 +1,116 @@
+<?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 mx.events.ListEvent;
+
+ [Bindable]
+ private var contact:Contact = new Contact();
+
+ protected function submitBtn_clickHandler(event:MouseEvent):void
+ {
+ contact.name = nameTxt.text;
+ contact.address = address.text;
+ contact.city = city.text;
+ contact.state = state.text;
+ contact.zip = zip.text;
+ trace(contacts.contains(contact));
+
+ if (!contacts.contains(contact))
+ contacts.addItem(contact);
+ contact = new Contact();
+ }
+
+ protected function dg_itemClickHandler(event:ListEvent):void
+ {
+ contact = dg.selectedItem as Contact;
+ }
+
+ ]]>
+ </fx:Script>
+
+ <fx:Declarations>
+ <s:ArrayCollection id="contacts"/>
+ </fx:Declarations>
+
+ <s:Panel width="100%" height="100%" skinClass="skins.TDFPanelSkin" title="TabBar Sample" >
+ <s:TabBar id="tabs" left="8" y="2" dataProvider="{vs}"/>
+ <mx:ViewStack id="vs" width="95%" height="85%" left="8" y="23">
+ <s:NavigatorContent label="Contact Info" width="100%" height="100%">
+ <s:BorderContainer width="100%" height="100%" borderWeight="2" cornerRadius="3" dropShadowVisible="true">
+ <s:backgroundFill>
+ <s:LinearGradient rotation="90">
+ <s:GradientEntry color="0xE2E2E2" />
+ <s:GradientEntry color="0x323232" />
+ </s:LinearGradient>
+ </s:backgroundFill>
+ <mx:Form id="contactForm" defaultButton="{submitBtn}" width="100%" height="100%">
+ <mx:FormItem label="Name:">
+ <s:TextInput id="nameTxt" text="{contact.name}"/>
+ </mx:FormItem>
+ <mx:FormItem label="Address:">
+ <s:TextInput id="address" text="{contact.address}"/>
+ </mx:FormItem>
+ <mx:FormItem label="City:">
+ <s:TextInput id="city" text="{contact.city}"/>
+ </mx:FormItem>
+ <mx:FormItem label="State:">
+ <s:TextInput id="state" text="{contact.state}"/>
+ </mx:FormItem>
+ <mx:FormItem label="Zip:">
+ <s:TextInput id="zip" text="{contact.zip}" maxChars="5"/>
+ </mx:FormItem>
+ <mx:FormItem>
+ <s:Button id="submitBtn" label="Submit" click="submitBtn_clickHandler(event)"/>
+ </mx:FormItem>
+ </mx:Form>
+ </s:BorderContainer>
+ </s:NavigatorContent>
+ <s:NavigatorContent label="Contact List" width="100%" height="100%" >
+ <s:BorderContainer width="100%" height="100%" borderWeight="2"
+ cornerRadius="3" dropShadowVisible="true">
+ <s:backgroundFill>
+ <s:LinearGradient rotation="90">
+ <s:GradientEntry color="0xE2E2E2" />
+ <s:GradientEntry color="0x323232" />
+ </s:LinearGradient>
+ </s:backgroundFill>
+ <mx:DataGrid id="dg" dataProvider="{contacts}" x="5" y="5" doubleClickEnabled="true"
+ doubleClick="{tabs.selectedIndex=0}" itemClick="dg_itemClickHandler(event)">
+ <mx:columns>
+ <mx:DataGridColumn headerText="Name" dataField="name"/>
+ <mx:DataGridColumn headerText="Address" dataField="address"/>
+ <mx:DataGridColumn headerText="City" dataField="city"/>
+ <mx:DataGridColumn headerText="State" dataField="state"/>
+ <mx:DataGridColumn headerText="Zip" dataField="zip"/>
+ </mx:columns>
+ </mx:DataGrid>
+ </s:BorderContainer>
+
+ </s:NavigatorContent>
+
+ </mx:ViewStack>
+
+ </s:Panel>
+</s:Application>
Propchange: flex/site/trunk/content/tourdeflex/spark/containers/TabNavigator1Example.mxml
------------------------------------------------------------------------------
svn:eol-style = native
Added: flex/site/trunk/content/tourdeflex/spark/containers/TabNavigator1Example.swf
URL: http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/containers/TabNavigator1Example.swf?rev=1619987&view=auto
==============================================================================
Binary file - no diff available.
Propchange: flex/site/trunk/content/tourdeflex/spark/containers/TabNavigator1Example.swf
------------------------------------------------------------------------------
svn:mime-type = application/octet-stream
Added: flex/site/trunk/content/tourdeflex/spark/containers/TabNavigator2Example.mxml
URL: http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/containers/TabNavigator2Example.mxml?rev=1619987&view=auto
==============================================================================
--- flex/site/trunk/content/tourdeflex/spark/containers/TabNavigator2Example.mxml (added)
+++ flex/site/trunk/content/tourdeflex/spark/containers/TabNavigator2Example.mxml Sat Aug 23 08:47:51 2014
@@ -0,0 +1,110 @@
+<?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="*">
+
+ <fx:Script>
+ <![CDATA[
+ import mx.events.ListEvent;
+
+ [Bindable]
+ private var contact:Contact = new Contact();
+
+ protected function submitBtn_clickHandler(event:MouseEvent):void
+ {
+ // Note: this sample uses bidirectional data binding, so we do not have to
+ // explicitly set the contact fields to save them!
+ if (!contacts.contains(contact))
+ contacts.addItem(contact);
+ contact = new Contact();
+ }
+
+ protected function dg_itemClickHandler(event:ListEvent):void
+ {
+ contact = dg.selectedItem as Contact;
+ }
+
+ ]]>
+ </fx:Script>
+
+ <fx:Declarations>
+ <s:ArrayCollection id="contacts"/>
+ </fx:Declarations>
+
+ <s:Panel width="100%" height="100%" skinClass="skins.TDFPanelSkin" title="TabBar Sample with Custom Skin and Bidirectional Binding" >
+ <s:TabBar id="tabs" left="8" y="2" dataProvider="{vs}" skinClass="skins.CustomTabBarSkin" cornerRadius="4"/>
+ <mx:ViewStack id="vs" width="95%" height="85%" left="8" y="23">
+ <s:NavigatorContent label="Contact Info" width="100%" height="100%">
+ <s:BorderContainer borderColor="0xCC0000" width="100%" height="100%" borderWeight="2" cornerRadius="3"
+ dropShadowVisible="true">
+ <!-- This background fill could also be specified in a custom skin to apply to other containers as well -->
+ <s:backgroundFill>
+ <s:LinearGradient rotation="90">
+ <s:GradientEntry color="0xE2E2E2"/>
+ <s:GradientEntry color="0xCC0000" alpha=".5" />
+ </s:LinearGradient>
+ </s:backgroundFill>
+ <mx:Form id="contactForm" defaultButton="{submitBtn}" width="100%" height="100%">
+ <mx:FormItem label="Name:">
+ <s:TextInput id="nameTxt" text="@{contact.name}"/>
+ </mx:FormItem>
+ <mx:FormItem label="Address:">
+ <s:TextInput id="address" text="@{contact.address}"/>
+ </mx:FormItem>
+ <mx:FormItem label="City:">
+ <s:TextInput id="city" text="@{contact.city}"/>
+ </mx:FormItem>
+ <mx:FormItem label="State:">
+ <s:TextInput id="state" text="@{contact.state}"/>
+ </mx:FormItem>
+ <mx:FormItem label="Zip:">
+ <s:TextInput id="zip" text="@{contact.zip}" maxChars="5"/>
+ </mx:FormItem>
+ <mx:FormItem>
+ <s:Button id="submitBtn" label="Submit" click="submitBtn_clickHandler(event)"/>
+ </mx:FormItem>
+ </mx:Form>
+ </s:BorderContainer>
+ </s:NavigatorContent>
+ <s:NavigatorContent label="Contact List" width="100%" height="100%" >
+ <s:BorderContainer borderColor="0xCC0000" width="100%" height="100%" borderWeight="2" cornerRadius="3"
+ dropShadowVisible="true">
+ <s:backgroundFill>
+ <s:LinearGradient rotation="90">
+ <s:GradientEntry color="0xCC0000" />
+ <s:GradientEntry color="0xE2E2E2" />
+ </s:LinearGradient>
+ </s:backgroundFill>
+ <mx:DataGrid id="dg" dataProvider="{contacts}" x="5" y="5" doubleClickEnabled="true"
+ doubleClick="{tabs.selectedIndex=0}" itemClick="dg_itemClickHandler(event)">
+ <mx:columns>
+ <mx:DataGridColumn headerText="Name" dataField="name"/>
+ <mx:DataGridColumn headerText="Address" dataField="address"/>
+ <mx:DataGridColumn headerText="City" dataField="city"/>
+ <mx:DataGridColumn headerText="State" dataField="state"/>
+ <mx:DataGridColumn headerText="Zip" dataField="zip"/>
+ </mx:columns>
+ </mx:DataGrid>
+ </s:BorderContainer>
+ </s:NavigatorContent>
+ </mx:ViewStack>
+ </s:Panel>
+</s:Application>
Propchange: flex/site/trunk/content/tourdeflex/spark/containers/TabNavigator2Example.mxml
------------------------------------------------------------------------------
svn:eol-style = native
Added: flex/site/trunk/content/tourdeflex/spark/containers/TabNavigator2Example.swf
URL: http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/containers/TabNavigator2Example.swf?rev=1619987&view=auto
==============================================================================
Binary file - no diff available.
Propchange: flex/site/trunk/content/tourdeflex/spark/containers/TabNavigator2Example.swf
------------------------------------------------------------------------------
svn:mime-type = application/octet-stream
Added: flex/site/trunk/content/tourdeflex/spark/containers/TileGroupExample.mxml
URL: http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/containers/TileGroupExample.mxml?rev=1619987&view=auto
==============================================================================
--- flex/site/trunk/content/tourdeflex/spark/containers/TileGroupExample.mxml (added)
+++ flex/site/trunk/content/tourdeflex/spark/containers/TileGroupExample.mxml Sat Aug 23 08:47:51 2014
@@ -0,0 +1,101 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+ Licensed to the Apache Software Foundation (ASF) under one or more
+ contributor license agreements. See the NOTICE file distributed with
+ this work for additional information regarding copyright ownership.
+ The ASF licenses this file to You under the Apache License, Version 2.0
+ (the "License"); you may not use this file except in compliance with
+ the License. You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+
+-->
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
+ xmlns:s="library://ns.adobe.com/flex/spark"
+ xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
+
+ <fx:Declarations>
+ <fx:Array id="orientArray">
+ <fx:String>Rows</fx:String>
+ <fx:String>Columns</fx:String>
+ </fx:Array>
+ </fx:Declarations>
+
+ <fx:Script>
+ <![CDATA[
+ import mx.collections.ArrayList;
+ import skins.TDFPanelSkin;
+
+ private function applyProperties():void
+ {
+ this.mainGroup.orientation = this.orientation.selectedItem;
+ this.mainGroup.horizontalGap = this.hgap.value;
+ this.mainGroup.verticalGap = this.vgap.value;
+ this.mainGroup.requestedColumnCount = this.colCount.value;
+ this.mainGroup.requestedRowCount = this.rowCount.value;
+ }
+ ]]>
+ </fx:Script>
+
+ <s:Panel skinClass="skins.TDFPanelSkin" title="TileGroup Sample" width="100%" height="100%">
+ <s:TileGroup left="300" top="10" id="mainGroup">
+ <s:Rect width="100" height="75">
+ <s:fill>
+ <s:SolidColor color="0xd54f4f"/>
+ </s:fill>
+ </s:Rect>
+ <s:Rect width="100" height="75">
+ <s:fill>
+ <s:SolidColor color="0x2f977d"/>
+ </s:fill>
+ </s:Rect>
+ <s:Rect width="100" height="75">
+ <s:fill>
+ <s:SolidColor color="0xfffca2"/>
+ </s:fill>
+ </s:Rect>
+ </s:TileGroup>
+
+ <s:VGroup top="10" left="10">
+ <s:HGroup verticalAlign="middle">
+ <s:Label text="Orientation:"/>
+ <s:DropDownList id="orientation" dataProvider="{new ArrayList(orientArray)}" prompt="columns"/>
+ </s:HGroup>
+
+ <s:HGroup verticalAlign="middle">
+ <s:Label text="Horizontal Gap:"/>
+ <s:NumericStepper id="hgap" maximum="400"/>
+ </s:HGroup>
+
+ <s:HGroup verticalAlign="middle">
+ <s:Label text="Vertical Gap:"/>
+ <s:NumericStepper id="vgap" maximum="400"/>
+ </s:HGroup>
+
+ <s:HGroup verticalAlign="middle">
+ <s:Label text="Requested Column Count:"/>
+ <s:NumericStepper id="colCount"/>
+ </s:HGroup>
+
+ <s:HGroup verticalAlign="middle">
+ <s:Label text="Requested Row Count:"/>
+ <s:NumericStepper id="rowCount"/>
+ </s:HGroup>
+ <s:Button label="Apply Properties" click="this.applyProperties()"/>
+ <mx:Spacer height="10"/>
+ <s:Label width="85%" horizontalCenter="0" color="#323232"
+ text="The TileGroup container is an instance of the Group container that uses the TileLayout class. You can use the properties of the
+ TileGroup class to modify the characteristics of the TileLayout class."/>
+
+ </s:VGroup>
+
+ </s:Panel>
+
+</s:Application>
Propchange: flex/site/trunk/content/tourdeflex/spark/containers/TileGroupExample.mxml
------------------------------------------------------------------------------
svn:eol-style = native
Added: flex/site/trunk/content/tourdeflex/spark/containers/TileGroupExample.swf
URL: http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/containers/TileGroupExample.swf?rev=1619987&view=auto
==============================================================================
Binary file - no diff available.
Propchange: flex/site/trunk/content/tourdeflex/spark/containers/TileGroupExample.swf
------------------------------------------------------------------------------
svn:mime-type = application/octet-stream
Added: flex/site/trunk/content/tourdeflex/spark/containers/assets/arrow_icon_sm.png
URL: http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/containers/assets/arrow_icon_sm.png?rev=1619987&view=auto
==============================================================================
Binary file - no diff available.
Propchange: flex/site/trunk/content/tourdeflex/spark/containers/assets/arrow_icon_sm.png
------------------------------------------------------------------------------
svn:mime-type = image/png
Added: flex/site/trunk/content/tourdeflex/spark/containers/personIcon.png
URL: http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/containers/personIcon.png?rev=1619987&view=auto
==============================================================================
Binary file - no diff available.
Propchange: flex/site/trunk/content/tourdeflex/spark/containers/personIcon.png
------------------------------------------------------------------------------
svn:mime-type = image/png
Added: flex/site/trunk/content/tourdeflex/spark/containers/skins/CustomTabBarButtonSkin.mxml
URL: http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/containers/skins/CustomTabBarButtonSkin.mxml?rev=1619987&view=auto
==============================================================================
--- flex/site/trunk/content/tourdeflex/spark/containers/skins/CustomTabBarButtonSkin.mxml (added)
+++ flex/site/trunk/content/tourdeflex/spark/containers/skins/CustomTabBarButtonSkin.mxml Sat Aug 23 08:47:51 2014
@@ -0,0 +1,264 @@
+<?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.
+
+-->
+
+
+<!---
+The default skin class for Spark TabBar buttons.
+
+@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"
+ xmlns:fb="http://ns.adobe.com/flashbuilder/2009"
+ minWidth="21" minHeight="21" alpha.disabledStates="0.5">
+
+ <!-- host component -->
+ <fx:Metadata>
+ <![CDATA[
+ /**
+ * @copy spark.skins.spark.ApplicationSkin#hostComponent
+ */
+ [HostComponent("spark.components.ButtonBarButton")]
+ ]]>
+ </fx:Metadata>
+
+ <fx:Script fb:purpose="styling" >
+
+ import spark.components.TabBar;
+
+ static private const exclusions:Array = ["labelDisplay"];
+
+ /**
+ * @private
+ */
+ override public function get colorizeExclusions():Array {return exclusions;}
+
+ /**
+ * @private
+ */
+ override protected function initializationComplete():void
+ {
+ //useBaseColor = true;
+ super.initializationComplete();
+ }
+
+ private var cornerRadius:Number = 4
+
+ /**
+ * @private
+ * The borderTop s:Path is just a s:Rect with the bottom edge left out.
+ * Given the rounded corners per the cornerRadius style, the result is
+ * roughly an inverted U with the specified width, height, and cornerRadius.
+ *
+ * Circular arcs are drawn with two curves per flash.display.Graphics.GraphicsUtil.
+ */
+ private function updateBorderTop(width:Number, height:Number):void
+ {
+ var left:Number = -0.5;
+ var right:Number = width - 0.5;
+ var top:Number = 0.5;
+ var bottom:Number = height;
+
+ var a:Number = cornerRadius * 0.292893218813453;
+ var s:Number = cornerRadius * 0.585786437626905;
+
+ var path:String = "";
+ path += "M " + left + " " + bottom;
+ path += " L " + left + " " + (top + cornerRadius);
+ path += " Q " + left + " " + (top + s) + " " + (left + a) + " " + (top + a);
+ path += " Q " + (left + s) + " " + top + " " + (left + cornerRadius) + " " + top;
+ path += " L " + (right - cornerRadius) + " " + top;
+ path += " Q " + (right - s) + " " + top + " " + (right - a) + " " + (top + a);
+ path += " Q " + right + " " + (top + s) + " " + right + " " + (top + cornerRadius);
+ path += " L " + right + " " + bottom;
+ borderTop.data = path;
+ }
+
+ /**
+ * @private
+ * The cornerRadius style is specified by the TabBar, not the button itself.
+ *
+ * Rather than bind the corner radius properties of the s:Rect's in the markup
+ * below to hostComponent.owner.getStyle("cornerRadius"), we reset them here,
+ * each time a change in the value of the style is detected. Note that each
+ * corner radius property is explicitly initialized to the default value of
+ * the style; the initial value of the private cornerRadius property.
+ */
+ private function updateCornerRadius():void
+ {
+ var cr:Number = getStyle("cornerRadius");
+ if (cornerRadius != cr)
+ {
+ cornerRadius = cr;
+ fill.topLeftRadiusX = cornerRadius;
+ fill.topRightRadiusX = cornerRadius;
+ lowlight.radiusX = cornerRadius;
+ highlight.radiusX = cornerRadius;
+ highlightStroke.topLeftRadiusX = cornerRadius;
+ highlightStroke.topRightRadiusX = cornerRadius;
+ }
+ }
+
+ /**
+ * @private
+ */
+ override protected function updateDisplayList(unscaledWidth:Number, unscaleHeight:Number):void
+ {
+ updateCornerRadius();
+ updateBorderTop(unscaledWidth, unscaledHeight);
+ super.updateDisplayList(unscaledWidth, unscaledHeight);
+ }
+ </fx:Script>
+
+ <!-- states -->
+ <s:states>
+ <s:State name="up" />
+ <s:State name="over" stateGroups="overStates" />
+ <s:State name="down" stateGroups="downStates" />
+ <s:State name="disabled" stateGroups="disabledStates" />
+ <s:State name="upAndSelected" stateGroups="selectedStates, selectedUpStates" />
+ <s:State name="overAndSelected" stateGroups="overStates, selectedStates" />
+ <s:State name="downAndSelected" stateGroups="downStates, selectedStates" />
+ <s:State name="disabledAndSelected" stateGroups="selectedUpStates, disabledStates, selectedStates" />
+ </s:states>
+
+ <s:Group left="-1" right="0" top="-1" bottom="-1">
+
+ <!-- layer 2: fill -->
+ <s:Rect id="fill" left="2" right="1" top="2" bottom="2" topLeftRadiusX="4" topRightRadiusX="4" width="69" height="21">
+ <s:fill>
+ <s:LinearGradient rotation="90">
+ <s:GradientEntry color="0xFFFFFF"
+ color.selectedUpStates="0xFFFFFF"
+ color.overStates="0xCC0000"
+ color.downStates="0xCC0000"
+ alpha="0.85"
+ alpha.overAndSelected="1" />
+ <s:GradientEntry color="0xCCCCCC"
+ color.selectedUpStates="0x9FA0A1"
+ color.over="0xCC0000"
+ color.overAndSelected="0xFFFFFF"
+ color.downStates="0xCC0000"
+ alpha="0.85"
+ alpha.overAndSelected="1" />
+ </s:LinearGradient>
+ </s:fill>
+ </s:Rect>
+
+ <!-- layer 3: fill lowlight -->
+ <s:Rect id="lowlight" left="2" right="1" bottom="2" height="9" radiusX="4">
+ <s:fill>
+ <s:LinearGradient rotation="90">
+ <s:GradientEntry color="0xCC0000" alpha="0.0099" />
+ <s:GradientEntry color="0xCC0000" alpha="0.0627" />
+ </s:LinearGradient>
+ </s:fill>
+ </s:Rect>
+
+ <!-- layer 4: fill highlight -->
+ <s:Rect id="highlight" left="2" right="1" top="2" height="9" radiusX="4">
+ <s:fill>
+ <s:SolidColor color="0xCC0000"
+ alpha="0.33"
+ alpha.selectedUpStates="0.22"
+ alpha.overStates="0.22"
+ alpha.downStates="0.12" />
+ </s:fill>
+ </s:Rect>
+
+ <!-- layer 5: highlight stroke (all states except down) -->
+ <s:Rect id="highlightStroke" left="2" right="1" top="2" bottom="2" topLeftRadiusX="4" topRightRadiusX="4">
+ <s:stroke>
+ <s:LinearGradientStroke rotation="90" weight="1">
+ <s:GradientEntry color="0xCC0000" alpha.overStates="0.22" alpha.selectedUpStates="0.33" />
+ </s:LinearGradientStroke>
+ </s:stroke>
+ </s:Rect>
+
+ <!-- layer 6: highlight stroke (down state only) -->
+ <s:Rect left="2" top="2" bottom="2" width="1" includeIn="downStates, selectedUpStates, overAndSelected">
+ <s:fill>
+ <s:SolidColor color="0xCC0000" alpha="0.07" />
+ </s:fill>
+ </s:Rect>
+ <s:Rect right="1" top="2" bottom="2" width="1" includeIn="downStates, selectedUpStates, overAndSelected">
+ <s:fill>
+ <s:SolidColor color="0xCC0000" alpha="0.07" />
+ </s:fill>
+ </s:Rect>
+ <s:Rect left="3" top="2" right="1" height="1" includeIn="downStates, selectedUpStates, overAndSelected">
+ <s:fill>
+ <s:SolidColor color="0xCC0000" alpha="0.25" />
+ </s:fill>
+ </s:Rect>
+ <s:Rect left="2" top="3" right="1" height="1" includeIn="downStates, selectedUpStates, overAndSelected">
+ <s:fill>
+ <s:SolidColor color="0xCC0000" alpha="0.09" />
+ </s:fill>
+ </s:Rect>
+
+ <!-- layer 7: border - put on top of the fill so it doesn't disappear when scale is less than 1 -->
+ <s:Line id="borderBottom" left="1" right="0" bottom="1">
+ <s:stroke>
+ <s:SolidColorStroke weight="1"
+ color="0xCC0000"
+ color.selectedStates="0x434343"
+ alpha="0.75"
+ alpha.down="0.85"
+ alpha.selectedStates="0.5" />
+ </s:stroke>
+ </s:Line>
+ <s:Path id="borderTop" left="1" right="0" top="1" bottom="1" width="69" height="21">
+ <s:stroke>
+ <s:LinearGradientStroke rotation="90" weight="1">
+ <s:GradientEntry color="0xCC0000"
+ alpha="0.5625"
+ />
+ <s:GradientEntry color="0xFFFFFF"
+ color.selectedUpStates="0xFFFFFF"
+ color.overStates="0xFFFFFF"
+ color.downStates="0xCC0000"
+ alpha="0.85"
+ alpha.overAndSelected="1" />
+ </s:LinearGradientStroke>
+ </s:stroke>
+ </s:Path>
+ </s:Group>
+
+ <!-- layer 8: text -->
+ <!--- The defines the appearance of the label for the first button in the ButtonBar component. -->
+ <s:Group left="2" top="2">
+ <s:BitmapImage source="@Embed('../personIcon.png')" width="16" height="16"/>
+
+ <s:Label id="labelDisplay"
+ textAlign="right"
+ verticalAlign="middle"
+ maxDisplayedLines="1"
+ horizontalCenter="7" verticalCenter="1"
+ left="10" right="10" top="2" bottom="2" color.down="#FFFFFF">
+ </s:Label>
+ </s:Group>
+
+</s:SparkSkin>
\ No newline at end of file
Propchange: flex/site/trunk/content/tourdeflex/spark/containers/skins/CustomTabBarButtonSkin.mxml
------------------------------------------------------------------------------
svn:eol-style = native
Added: flex/site/trunk/content/tourdeflex/spark/containers/skins/CustomTabBarSkin.mxml
URL: http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/containers/skins/CustomTabBarSkin.mxml?rev=1619987&view=auto
==============================================================================
--- flex/site/trunk/content/tourdeflex/spark/containers/skins/CustomTabBarSkin.mxml (added)
+++ flex/site/trunk/content/tourdeflex/spark/containers/skins/CustomTabBarSkin.mxml Sat Aug 23 08:47:51 2014
@@ -0,0 +1,97 @@
+<?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.
+
+-->
+
+
+<!---
+
+The default skin class for the Spark TabBar component. The ButtonBarButtons
+created by the TabBar component use the TabBarButtonSkin class.
+
+@see spark.components.TabBar
+@see spark.components.ButtonBarButton
+
+@langversion 3.0
+@playerversion Flash 10
+@playerversion AIR 1.5
+@productversion Flex 4
+
+-->
+
+<s:Skin
+ xmlns:fx="http://ns.adobe.com/mxml/2009"
+ xmlns:s="library://ns.adobe.com/flex/spark"
+ xmlns:fb="http://ns.adobe.com/flashbuilder/2009"
+ alpha.disabled="0.5">
+
+ <fx:Metadata>
+ <![CDATA[
+ /**
+ * @copy spark.skins.spark.ApplicationSkin#hostComponent
+ */
+ [HostComponent("spark.components.TabBar")]
+ ]]>
+ </fx:Metadata>
+
+ <fx:Script fb:purpose="styling" >
+ <![CDATA[
+
+ import mx.core.UIComponent;
+
+ /**
+ * @private
+ * Push the cornerRadius style to the item renderers.
+ */
+ override protected function updateDisplayList(unscaledWidth:Number, unscaleHeight:Number):void
+ {
+ const numElements:int = dataGroup.numElements;
+ const cornerRadius:int = hostComponent.getStyle("cornerRadius");
+ for (var i:int = 0; i < numElements; i++)
+ {
+ var elt:UIComponent = dataGroup.getElementAt(i) as UIComponent;
+ if (elt)
+ elt.setStyle("cornerRadius", cornerRadius);
+ }
+
+ super.updateDisplayList(unscaledWidth, unscaledHeight);
+ }
+
+ ]]>
+ </fx:Script>
+
+ <s:states>
+ <s:State name="normal" />
+ <s:State name="disabled" />
+ </s:states>
+
+ <!---
+ @copy spark.components.SkinnableDataContainer#dataGroup
+ -->
+ <s:DataGroup id="dataGroup" width="100%" height="100%">
+ <s:layout>
+ <s:ButtonBarHorizontalLayout gap="-1"/>
+ </s:layout>
+ <s:itemRenderer>
+ <fx:Component>
+ <s:ButtonBarButton skinClass="skins.CustomTabBarButtonSkin" />
+ </fx:Component>
+ </s:itemRenderer>
+ </s:DataGroup>
+
+</s:Skin>
\ No newline at end of file
Propchange: flex/site/trunk/content/tourdeflex/spark/containers/skins/CustomTabBarSkin.mxml
------------------------------------------------------------------------------
svn:eol-style = native
Added: flex/site/trunk/content/tourdeflex/spark/containers/skins/TDFPanelSkin.mxml
URL: http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/containers/skins/TDFPanelSkin.mxml?rev=1619987&view=auto
==============================================================================
--- flex/site/trunk/content/tourdeflex/spark/containers/skins/TDFPanelSkin.mxml (added)
+++ flex/site/trunk/content/tourdeflex/spark/containers/skins/TDFPanelSkin.mxml Sat Aug 23 08:47:51 2014
@@ -0,0 +1,171 @@
+<?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 -->
+ <!-- This layer was modified for Tour de Flex samples to have a gradient border at the bottom. -->
+ <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/containers/skins/TDFPanelSkin.mxml
------------------------------------------------------------------------------
svn:eol-style = native
Added: flex/site/trunk/content/tourdeflex/spark/controls/AccordionExample.mxml
URL: http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/controls/AccordionExample.mxml?rev=1619987&view=auto
==============================================================================
--- flex/site/trunk/content/tourdeflex/spark/controls/AccordionExample.mxml (added)
+++ flex/site/trunk/content/tourdeflex/spark/controls/AccordionExample.mxml Sat Aug 23 08:47:51 2014
@@ -0,0 +1,66 @@
+<?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"
+ skinClass="TDFGradientBackgroundSkin">
+
+ <s:layout>
+ <s:HorizontalLayout verticalAlign="middle" horizontalAlign="center" />
+ </s:layout>
+
+ <s:Panel title="Accordion Container" width="600" height="100%"
+ color="0x000000"
+ borderAlpha="0.15">
+
+ <s:layout>
+ <s:VerticalLayout paddingLeft="10" paddingRight="10" paddingTop="10" paddingBottom="10"/>
+ </s:layout>
+
+ <s:Label width="100%" color="0x323232"
+ text="Select an Accordion navigator button to change the panel."/>
+
+ <mx:Accordion id="accordion" color="0x323232" width="100%" height="100%">
+ <!-- Define each panel using a VBox container. -->
+ <s:NavigatorContent label="Accordion Button for Panel 1">
+ <mx:Label text="Accordion container panel 1"/>
+ </s:NavigatorContent>
+
+ <s:NavigatorContent label="Accordion Button for Panel 2">
+ <mx:Label text="Accordion container panel 2"/>
+ </s:NavigatorContent>
+
+ <s:NavigatorContent label="Accordion Button for Panel 3">
+ <mx:Label text="Accordion container panel 3"/>
+ </s:NavigatorContent>
+ </mx:Accordion>
+
+ <s:Label width="100%" color="0x323232"
+ text="Programmatically select the panel using a Button control."/>
+
+ <s:HGroup color="0x323232">
+ <s:Button label="Select Panel 1" click="accordion.selectedIndex=0;"/>
+ <s:Button label="Select Panel 2" click="accordion.selectedIndex=1;"/>
+ <s:Button label="Select Panel 3" click="accordion.selectedIndex=2;"/>
+ </s:HGroup>
+
+ </s:Panel>
+
+</s:Application>
\ No newline at end of file
Propchange: flex/site/trunk/content/tourdeflex/spark/controls/AccordionExample.mxml
------------------------------------------------------------------------------
svn:eol-style = native
Added: flex/site/trunk/content/tourdeflex/spark/controls/AccordionExample.swf
URL: http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/controls/AccordionExample.swf?rev=1619987&view=auto
==============================================================================
Binary file - no diff available.
Propchange: flex/site/trunk/content/tourdeflex/spark/controls/AccordionExample.swf
------------------------------------------------------------------------------
svn:mime-type = application/octet-stream
Added: flex/site/trunk/content/tourdeflex/spark/controls/AdvancedDatagridExample.mxml
URL: http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/controls/AdvancedDatagridExample.mxml?rev=1619987&view=auto
==============================================================================
--- flex/site/trunk/content/tourdeflex/spark/controls/AdvancedDatagridExample.mxml (added)
+++ flex/site/trunk/content/tourdeflex/spark/controls/AdvancedDatagridExample.mxml Sat Aug 23 08:47:51 2014
@@ -0,0 +1,92 @@
+<?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"
+ skinClass="TDFGradientBackgroundSkin">
+
+ <fx:Script>
+ <![CDATA[
+ import mx.collections.ArrayCollection;
+
+ [Bindable]
+ private var dpFlat:ArrayCollection = new ArrayCollection([
+ {Region:"Southwest", Territory:"Arizona",
+ Territory_Rep:"Barbara Jennings", Actual:38865, Estimate:40000},
+ {Region:"Southwest", Territory:"Arizona",
+ Territory_Rep:"Dana Binn", Actual:29885, Estimate:30000},
+ {Region:"Southwest", Territory:"Central California",
+ Territory_Rep:"Joe Smith", Actual:29134, Estimate:30000},
+ {Region:"Southwest", Territory:"Nevada",
+ Territory_Rep:"Bethany Pittman", Actual:52888, Estimate:45000},
+ {Region:"Southwest", Territory:"Northern California",
+ Territory_Rep:"Lauren Ipsum", Actual:38805, Estimate:40000},
+ {Region:"Southwest", Territory:"Northern California",
+ Territory_Rep:"T.R. Smith", Actual:55498, Estimate:40000},
+ {Region:"Southwest", Territory:"Southern California",
+ Territory_Rep:"Alice Treu", Actual:44985, Estimate:45000},
+ {Region:"Southwest", Territory:"Southern California",
+ Territory_Rep:"Jane Grove", Actual:44913, Estimate:45000},
+ {Region:"NorthEast", Territory:"New York",
+ Territory_Rep:"Jose Rodriguez", Actual:26992, Estimate:30000},
+ {Region:"NorthEast", Territory:"New York",
+ Territory_Rep:"lisa Sims", Actual:47885, Estimate:50000},
+ {Region:"NorthEast", Territory:"Massachusetts",
+ Territory_Rep:"kelly o'connell", Actual:172911, Estimate:20000},
+ {Region:"NorthEast", Territory:"Pennsylvania",
+ Territory_Rep:"John Barnes", Actual:32105, Estimate:30000},
+ {Region:"MidWest", Territory:"Illinois",
+ Territory_Rep:"Seth Brown", Actual:42511, Estimate:40000}
+ ]);
+ ]]>
+ </fx:Script>
+
+ <s:layout>
+ <s:HorizontalLayout verticalAlign="middle" horizontalAlign="center" />
+ </s:layout>
+
+ <s:Panel title="AdvancedDataGrid Control"
+ color="0x000000"
+ borderAlpha="0.15"
+ width="600">
+
+ <mx:AdvancedDataGrid id="myADG"
+ width="100%" height="100%"
+ color="0x323232"
+ dataProvider="{dpFlat}">
+
+ <mx:groupedColumns>
+
+ <mx:AdvancedDataGridColumn dataField="Region" />
+ <mx:AdvancedDataGridColumn dataField="Territory" />
+ <mx:AdvancedDataGridColumn dataField="Territory_Rep"
+ headerText="Territory Rep"/>
+ <mx:AdvancedDataGridColumnGroup headerText="Revenues">
+ <mx:AdvancedDataGridColumn dataField="Actual"/>
+ <mx:AdvancedDataGridColumn dataField="Estimate"/>
+ </mx:AdvancedDataGridColumnGroup>
+
+ </mx:groupedColumns>
+
+ </mx:AdvancedDataGrid>
+
+ </s:Panel>
+
+</s:Application>
\ No newline at end of file
Propchange: flex/site/trunk/content/tourdeflex/spark/controls/AdvancedDatagridExample.mxml
------------------------------------------------------------------------------
svn:eol-style = native
Added: flex/site/trunk/content/tourdeflex/spark/controls/AdvancedDatagridExample.swf
URL: http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/controls/AdvancedDatagridExample.swf?rev=1619987&view=auto
==============================================================================
Binary file - no diff available.
Propchange: flex/site/trunk/content/tourdeflex/spark/controls/AdvancedDatagridExample.swf
------------------------------------------------------------------------------
svn:mime-type = application/octet-stream
Added: flex/site/trunk/content/tourdeflex/spark/controls/ButtonBarExample.mxml
URL: http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/controls/ButtonBarExample.mxml?rev=1619987&view=auto
==============================================================================
--- flex/site/trunk/content/tourdeflex/spark/controls/ButtonBarExample.mxml (added)
+++ flex/site/trunk/content/tourdeflex/spark/controls/ButtonBarExample.mxml Sat Aug 23 08:47:51 2014
@@ -0,0 +1,106 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+ Licensed to the Apache Software Foundation (ASF) under one or more
+ contributor license agreements. See the NOTICE file distributed with
+ this work for additional information regarding copyright ownership.
+ The ASF licenses this file to You under the Apache License, Version 2.0
+ (the "License"); you may not use this file except in compliance with
+ the License. You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+
+-->
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
+ xmlns:s="library://ns.adobe.com/flex/spark"
+ xmlns:mx="library://ns.adobe.com/flex/mx" viewSourceURL="srcview/index.html">
+
+ <fx:Style>
+ @namespace "library://ns.adobe.com/flex/spark";
+
+ ButtonBar ToggleButton:upAndSelected,
+ ButtonBar ToggleButton:overAndSelected,
+ ButtonBar ToggleButton:downAndSelected,
+ ButtonBar ToggleButton:disabledAndSelected {
+ baseColor: #FFFFFF;
+ color: #323232;
+ }
+ ButtonBar {
+ baseColor: #000000;
+ color: #FFFFFF;
+ }
+ </fx:Style>
+
+ <fx:Script>
+ <![CDATA[
+ import spark.events.IndexChangeEvent;
+
+ /**
+ * Index change handler will be called each time a button is clicked
+ * and the event will provide information needed such as the previous
+ * index clicked.
+ **/
+ protected function indexChangeHandler(event:IndexChangeEvent):void
+ {
+ myTextArea.text = "Button Bar index clicked = " + event.newIndex
+ myTextArea.text = myTextArea.text + "\nButton Bar previous index = " + event.oldIndex;
+ myTextArea.text = myTextArea.text + "\nButton Bar label clicked = " + myButtonBar.selectedItem;
+ if (myButtonBar.selectedItem=="Red") {
+ txtColor.setStyle("color","red");
+ txtColor.text="Red selected!";
+ }
+ else if (myButtonBar.selectedItem=="Green") {
+ txtColor.setStyle("color","green");
+ txtColor.text="Green selected!";
+ }
+ else if (myButtonBar.selectedItem=="Blue") {
+ txtColor.setStyle("color","blue");
+ txtColor.text="Blue selected!";
+ }
+ else {
+ txtColor.setStyle("color","yellow");
+ txtColor.text="Yellow selected!";
+ }
+ }
+ protected function resetButtonBar(event:MouseEvent):void
+ {
+ myButtonBar.selectedIndex = -1;
+ myTextArea.text = "";
+ }
+ ]]>
+ </fx:Script>
+
+ <!-- Note: A custom panel skin is used for the Tour de Flex samples and is included in the
+ source tabs for each sample. -->
+ <s:Panel title="ButtonBar Sample"
+ width="100%" height="100%"
+ horizontalCenter="0"
+ skinClass="skins.TDFPanelSkin">
+
+ <s:HGroup left="5" top="5" width="100%" height="100%">
+ <s:Label width="50%" fontSize="13" color="0x323232" verticalAlign="justify"
+ text="The ButtonBar component behaves like a series of toggle buttons, where one button remains selected
+and only one button in the ButtonBar control can be in the selected state. That means when you select a button in a ButtonBar
+control, the button stays in the selected state until you select a different button."/>
+ <s:VGroup left="10" top="5" color="0x000000" horizontalAlign="center">
+ <s:ButtonBar id="myButtonBar" change="indexChangeHandler(event)">
+ <mx:ArrayCollection>
+ <fx:String>Red</fx:String>
+ <fx:String>Green</fx:String>
+ <fx:String>Blue</fx:String>
+ <fx:String>Yellow</fx:String>
+ </mx:ArrayCollection>
+ </s:ButtonBar>
+ <s:TextArea id="myTextArea" width="{myButtonBar.width}" height="150"/>
+ <s:Button id="myButton" label="Reset Selection" click="resetButtonBar(event)"/>
+ <s:Label id="txtColor" fontSize="16"/>
+ </s:VGroup>
+ </s:HGroup>
+ </s:Panel>
+</s:Application>
Propchange: flex/site/trunk/content/tourdeflex/spark/controls/ButtonBarExample.mxml
------------------------------------------------------------------------------
svn:eol-style = native
Added: flex/site/trunk/content/tourdeflex/spark/controls/ButtonBarExample.swf
URL: http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/controls/ButtonBarExample.swf?rev=1619987&view=auto
==============================================================================
Binary file - no diff available.
Propchange: flex/site/trunk/content/tourdeflex/spark/controls/ButtonBarExample.swf
------------------------------------------------------------------------------
svn:mime-type = application/octet-stream
Added: flex/site/trunk/content/tourdeflex/spark/controls/ButtonExample.mxml
URL: http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/controls/ButtonExample.mxml?rev=1619987&view=auto
==============================================================================
--- flex/site/trunk/content/tourdeflex/spark/controls/ButtonExample.mxml (added)
+++ flex/site/trunk/content/tourdeflex/spark/controls/ButtonExample.mxml Sat Aug 23 08:47:51 2014
@@ -0,0 +1,65 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+ Licensed to the Apache Software Foundation (ASF) under one or more
+ contributor license agreements. See the NOTICE file distributed with
+ this work for additional information regarding copyright ownership.
+ The ASF licenses this file to You under the Apache License, Version 2.0
+ (the "License"); you may not use this file except in compliance with
+ the License. You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+
+-->
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
+ xmlns:s="library://ns.adobe.com/flex/spark"
+ xmlns:mx="library://ns.adobe.com/flex/mx"
+ viewSourceURL="srcview/index.html">
+
+ <fx:Script>
+ <![CDATA[
+ import flash.events.Event;
+
+ protected function buttonClickHandler(event:Event):void
+ {
+ repeatText.text += event.target.label + " pressed!" + "\n";
+ }
+ ]]>
+ </fx:Script>
+
+ <!-- Note: A custom panel skin is used for the Tour de Flex samples and is included in the
+ source tabs for each sample. -->
+ <s:Panel width="100%" height="100%"
+ horizontalCenter="0"
+ title="Button Sample"
+ skinClass="skins.TDFPanelSkin">
+
+ <s:HGroup left="5" top="5" width="100%" height="100%">
+ <s:Label width="50%" fontSize="13" color="0x323232" verticalAlign="justify"
+ text="The Button component is a commonly used rectangular button. The Button
+component looks like it can be pressed. The default skin has a text label."/>
+
+ <s:VGroup right="10" bottom="5" color="0x000000" horizontalAlign="center">
+ <s:Label text="Output"/>
+ <s:TextArea id="repeatText" top="5" right="50" width="180" height="100"/>
+ <s:Button id="standardBtn" label="Standard Button"
+ click="buttonClickHandler(event)"
+ fontWeight="normal"/>
+ <s:Button id="disabledBtn" label="Disabled Button" enabled="false"/>
+ <s:Button id="repeatBtn" label="Repeat Button"
+ buttonDown="buttonClickHandler(event)"
+ autoRepeat="true"/>
+ <s:Label verticalAlign="justify"
+ text="Hold down on repeat button to see autoRepeat behavior."/>
+
+ </s:VGroup>
+ </s:HGroup>
+ </s:Panel>
+
+</s:Application>
Propchange: flex/site/trunk/content/tourdeflex/spark/controls/ButtonExample.mxml
------------------------------------------------------------------------------
svn:eol-style = native
Added: flex/site/trunk/content/tourdeflex/spark/controls/ButtonExample.swf
URL: http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/controls/ButtonExample.swf?rev=1619987&view=auto
==============================================================================
Binary file - no diff available.
Propchange: flex/site/trunk/content/tourdeflex/spark/controls/ButtonExample.swf
------------------------------------------------------------------------------
svn:mime-type = application/octet-stream
Added: flex/site/trunk/content/tourdeflex/spark/controls/CheckboxExample.mxml
URL: http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/controls/CheckboxExample.mxml?rev=1619987&view=auto
==============================================================================
--- flex/site/trunk/content/tourdeflex/spark/controls/CheckboxExample.mxml (added)
+++ flex/site/trunk/content/tourdeflex/spark/controls/CheckboxExample.mxml Sat Aug 23 08:47:51 2014
@@ -0,0 +1,78 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+
+ Licensed to the Apache Software Foundation (ASF) under one or more
+ contributor license agreements. See the NOTICE file distributed with
+ this work for additional information regarding copyright ownership.
+ The ASF licenses this file to You under the Apache License, Version 2.0
+ (the "License"); you may not use this file except in compliance with
+ the License. You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+
+-->
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
+ xmlns:s="library://ns.adobe.com/flex/spark"
+ xmlns:mx="library://ns.adobe.com/flex/mx"
+ viewSourceURL="srcview/index.html">
+
+ <fx:Script>
+ <![CDATA[
+ [Bindable]
+ public var totalCost:Number = 4.50;
+
+ // This event handler adds/removes the cost of condiments to/from the total cost.
+ private function modifyBurger(evt:MouseEvent):void {
+ // Add 0.25 to the total cost for every condiment. Delete 0.25 for
+ // every condiment removed.
+ if(CheckBox(evt.target).selected) {
+ totalCost += 0.25;
+ } else {
+ totalCost -= 0.25;
+ }
+ // Format the totalCost and then display it in a label.
+ totalString.text = usdFormatter.format(totalCost);
+ }
+ ]]>
+ </fx:Script>
+ <fx:Declarations>
+ <mx:CurrencyFormatter id="usdFormatter" precision="2" currencySymbol="$"
+ decimalSeparatorFrom="." decimalSeparatorTo="."
+ useNegativeSign="true"
+ useThousandsSeparator="true" alignSymbol="left"/>
+ </fx:Declarations>
+
+ <!-- Note: A custom panel skin is used for the Tour de Flex samples and is included in the
+ source tabs for each sample. -->
+ <s:Panel title="CheckBox Sample"
+ width="100%" height="100%"
+ skinClass="skins.TDFPanelSkin">
+ <s:VGroup left="10" right="10" top="10" bottom="10">
+ <s:Label text="Hamburger Base Price: $4.50" />
+ <s:Label text="Select condiments for your hamburger (0.25 each):" />
+
+ <s:CheckBox id="lettuceCB" label="Pickles" click="modifyBurger(event);"/>
+ <s:CheckBox id="tomatoCB" label="Tomato" click="modifyBurger(event);"/>
+ <s:CheckBox id="pickleCB" label="Lettuce" click="modifyBurger(event);"/>
+ <s:CheckBox id="mayoCB" label="Mayonnaise" click="modifyBurger(event);"/>
+
+ <mx:Spacer height="10" />
+ <s:HGroup>
+ <s:Label text="Total Price: " color="0x336699" fontWeight="bold"/>
+ <s:Label id="totalString" text="$4.50" color="0x336699" fontWeight="bold"/>
+ </s:HGroup>
+ </s:VGroup>
+ <s:Label top="10" right="10" width="250" verticalAlign="justify" color="#323232"
+ text="The CheckBox control is a commonly used graphical control that can
+contain a check mark or not. You can use CheckBox controls to gather a
+set of true or false values that arenât mutually exclusive."/>
+ </s:Panel>
+
+
+</s:Application>
Propchange: flex/site/trunk/content/tourdeflex/spark/controls/CheckboxExample.mxml
------------------------------------------------------------------------------
svn:eol-style = native
Added: flex/site/trunk/content/tourdeflex/spark/controls/CheckboxExample.swf
URL: http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/controls/CheckboxExample.swf?rev=1619987&view=auto
==============================================================================
Binary file - no diff available.
Propchange: flex/site/trunk/content/tourdeflex/spark/controls/CheckboxExample.swf
------------------------------------------------------------------------------
svn:mime-type = application/octet-stream
Added: flex/site/trunk/content/tourdeflex/spark/controls/ColorPickerExample.mxml
URL: http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/controls/ColorPickerExample.mxml?rev=1619987&view=auto
==============================================================================
--- flex/site/trunk/content/tourdeflex/spark/controls/ColorPickerExample.mxml (added)
+++ flex/site/trunk/content/tourdeflex/spark/controls/ColorPickerExample.mxml Sat Aug 23 08:47:51 2014
@@ -0,0 +1,49 @@
+<?xml version="1.0"?>
+<!--
+
+ Licensed to the Apache Software Foundation (ASF) under one or more
+ contributor license agreements. See the NOTICE file distributed with
+ this work for additional information regarding copyright ownership.
+ The ASF licenses this file to You under the Apache License, Version 2.0
+ (the "License"); you may not use this file except in compliance with
+ the License. You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+
+-->
+<!-- Simple example to demonstrate the ColorPicker control. -->
+<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
+ xmlns:s="library://ns.adobe.com/flex/spark"
+ xmlns:mx="library://ns.adobe.com/flex/mx"
+ skinClass="TDFGradientBackgroundSkin">
+
+ <s:layout>
+ <s:HorizontalLayout horizontalAlign="center" />
+ </s:layout>
+
+ <s:Panel title="ColorPicker Control Example"
+ width="600" height="100%"
+ color="0x000000"
+ borderAlpha="0.15">
+
+ <s:layout>
+ <s:VerticalLayout paddingLeft="10" paddingRight="10" paddingTop="10" paddingBottom="10"/>
+ </s:layout>
+
+ <s:Label width="100%" color="0x000000"
+ text="Select the background color of the Skinnable container."/>
+
+ <mx:ColorPicker id="cp" showTextField="true" selectedColor="0xFFFFFF"/>
+
+ <s:SkinnableContainer width="100%" height="100%" backgroundColor="{cp.selectedColor}" />
+
+ <s:Label color="0x000000" text="selectedColor: 0x{cp.selectedColor.toString(16)}"/>
+ </s:Panel>
+
+</s:Application>
Propchange: flex/site/trunk/content/tourdeflex/spark/controls/ColorPickerExample.mxml
------------------------------------------------------------------------------
svn:eol-style = native
Added: flex/site/trunk/content/tourdeflex/spark/controls/ColorPickerExample.swf
URL: http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/controls/ColorPickerExample.swf?rev=1619987&view=auto
==============================================================================
Binary file - no diff available.
Propchange: flex/site/trunk/content/tourdeflex/spark/controls/ColorPickerExample.swf
------------------------------------------------------------------------------
svn:mime-type = application/octet-stream
Added: flex/site/trunk/content/tourdeflex/spark/controls/ComboBoxExample.mxml
URL: http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/controls/ComboBoxExample.mxml?rev=1619987&view=auto
==============================================================================
--- flex/site/trunk/content/tourdeflex/spark/controls/ComboBoxExample.mxml (added)
+++ flex/site/trunk/content/tourdeflex/spark/controls/ComboBoxExample.mxml Sat Aug 23 08:47:51 2014
@@ -0,0 +1,66 @@
+<?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">
+
+ <fx:Script>
+ <![CDATA[
+ import mx.collections.ArrayCollection;
+
+ import skins.TDFPanelSkin;
+
+ [Bindable]
+ public var cards:ArrayCollection = new ArrayCollection(
+ [ {label:"Visa", data:1},
+ {label:"MasterCard", data:2},
+ {label:"American Express", data:3} ]);
+
+ private function changeHandler(event:Event):void {
+
+ myLabel.text = "You selected: " + ComboBox(event.target).selectedItem.label;
+ myData.text = "Data: " + ComboBox(event.target).selectedItem.data;
+ }
+ ]]>
+ </fx:Script>
+
+ <s:Panel title="ComboBox Sample" skinClass="skins.TDFPanelSkin"
+ height="100%" width="100%">
+
+ <s:HGroup top="20" horizontalCenter="0" >
+ <s:VGroup>
+ <s:Label width="200" color="0x336699" text="Select credit card type:"/>
+ <s:ComboBox dataProvider="{cards}" width="150" color="0x000000"
+ change="changeHandler(event);" selectedIndex="0"/>
+
+ </s:VGroup>
+ <mx:Spacer width="20"/>
+ <s:VGroup>
+ <s:Label id="myLabel" text="You selected:" fontWeight="bold"/>
+ <s:Label id="myData" text="Data:" fontWeight="bold"/>
+ </s:VGroup>
+
+ </s:HGroup>
+ <s:Label color="#323232" width="75%" bottom="20" horizontalCenter="0"
+ text="The ComboBox component is similar to a DropDownList but includes a TextInput instead of a Label. A user can type into the TextInput and the drop-down will scroll to and highlight the closest match.
+Users are allowed to type in an item not found in the dataProvider. With this behavior, a ComboBox acts as a list of suggested values, while a DropDownList acts as a list of possible values. "/>
+
+ </s:Panel>
+</s:Application>
Propchange: flex/site/trunk/content/tourdeflex/spark/controls/ComboBoxExample.mxml
------------------------------------------------------------------------------
svn:eol-style = native
Added: flex/site/trunk/content/tourdeflex/spark/controls/ComboBoxExample.swf
URL: http://svn.apache.org/viewvc/flex/site/trunk/content/tourdeflex/spark/controls/ComboBoxExample.swf?rev=1619987&view=auto
==============================================================================
Binary file - no diff available.
Propchange: flex/site/trunk/content/tourdeflex/spark/controls/ComboBoxExample.swf
------------------------------------------------------------------------------
svn:mime-type = application/octet-stream