http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/e1f9d1df/TourDeFlex/TourDeFlex3/src/mx/validators/SimpleValidatorExample.mxml ---------------------------------------------------------------------- diff --git a/TourDeFlex/TourDeFlex3/src/mx/validators/SimpleValidatorExample.mxml b/TourDeFlex/TourDeFlex3/src/mx/validators/SimpleValidatorExample.mxml new file mode 100755 index 0000000..120574e --- /dev/null +++ b/TourDeFlex/TourDeFlex3/src/mx/validators/SimpleValidatorExample.mxml @@ -0,0 +1,76 @@ +<?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 Validator class. --> +<mx:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:mx="library://ns.adobe.com/flex/mx"> + + <fx:Script> + <![CDATA[ + + // Import necessary classes. + import mx.controls.Alert; + import mx.events.ValidationResultEvent; + + // Event listener for the valid and invalid events. + private function handleValid(eventObj:ValidationResultEvent):void { + if(eventObj.type==ValidationResultEvent.VALID) + // Enable Submit button. + submitButton.enabled = true; + else + submitButton.enabled = false; + } + + // Submit form is everything is valid. + private function submitForm():void { + Alert.show("Form Submitted!"); + } + + ]]> + </fx:Script> + + <!-- The Validator class defines the required property and the validator events + used by all validator subclasses. --> + <fx:Declarations> + <mx:Validator id="reqValid" required="true" + source="{fname}" property="text" + valid="handleValid(event)" invalid="handleValid(event)"/> + </fx:Declarations> + + <mx:Panel title="Validator Example" width="100%" height="100%" + paddingTop="5" paddingLeft="5" paddingRight="5" paddingBottom="5"> + + <mx:Form> + <mx:Text width="100%" color="blue" + text="Enter a value in the Name field before you can submit. The E-mail field is optional."/> + + <mx:FormItem label="Name: " required="true"> + <mx:TextInput id="fname" width="100%"/> + </mx:FormItem> + + <mx:FormItem label="E-mail address: " required="false"> + <mx:TextInput id="email" width="100%"/> + </mx:FormItem> + + <mx:FormItem> + <mx:Button id="submitButton" enabled="false" + label="Submit" click="submitForm();"/> + </mx:FormItem> + </mx:Form> + + </mx:Panel> +</mx:Application> \ No newline at end of file
http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/e1f9d1df/TourDeFlex/TourDeFlex3/src/mx/validators/SocialSecurityValidatorExample.mxml ---------------------------------------------------------------------- diff --git a/TourDeFlex/TourDeFlex3/src/mx/validators/SocialSecurityValidatorExample.mxml b/TourDeFlex/TourDeFlex3/src/mx/validators/SocialSecurityValidatorExample.mxml new file mode 100755 index 0000000..92cd7cf --- /dev/null +++ b/TourDeFlex/TourDeFlex3/src/mx/validators/SocialSecurityValidatorExample.mxml @@ -0,0 +1,45 @@ +<?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. + --> + +<!-- Simple example to demonstrate SocialSecurityValidator. --> +<mx:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:mx="library://ns.adobe.com/flex/mx"> + + <fx:Script> + import mx.controls.Alert; + </fx:Script> + + <fx:Declarations> + <mx:SocialSecurityValidator source="{ssn}" property="text" + trigger="{myButton}" triggerEvent="click" + valid="Alert.show('Validation Succeeded!');"/> + </fx:Declarations> + + <mx:Panel title="Social Security Validator Panel" width="75%" height="75%" + paddingTop="10" paddingLeft="10" paddingRight="10" paddingBottom="10"> + + <mx:Form> + <mx:FormItem label="Enter Social Security number: "> + <mx:TextInput id="ssn" width="100%"/> + </mx:FormItem> + + <mx:FormItem > + <mx:Button id="myButton" label="Validate" /> + </mx:FormItem> + </mx:Form> + </mx:Panel> +</mx:Application> \ No newline at end of file http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/e1f9d1df/TourDeFlex/TourDeFlex3/src/mx/validators/StringValidatorExample.mxml ---------------------------------------------------------------------- diff --git a/TourDeFlex/TourDeFlex3/src/mx/validators/StringValidatorExample.mxml b/TourDeFlex/TourDeFlex3/src/mx/validators/StringValidatorExample.mxml new file mode 100755 index 0000000..6e0e655 --- /dev/null +++ b/TourDeFlex/TourDeFlex3/src/mx/validators/StringValidatorExample.mxml @@ -0,0 +1,48 @@ +<?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. + --> + +<!-- Simple example to demonstrate StringValidator. --> +<mx:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:mx="library://ns.adobe.com/flex/mx"> + + <fx:Script> + import mx.controls.Alert; + </fx:Script> + + <fx:Declarations> + <mx:StringValidator source="{fname}" property="text" + tooShortError="This string is shorter than the minimum allowed length of 4. " + tooLongError="This string is longer than the maximum allowed length of 20." + minLength="4" maxLength="20" + trigger="{myButton}" triggerEvent="click" + valid="Alert.show('Validation Succeeded!');"/> + </fx:Declarations> + + <mx:Panel title="StringValidator Example" width="75%" height="75%" + paddingTop="10" paddingLeft="10" paddingRight="10" paddingBottom="10"> + + <mx:Form> + <mx:FormItem label="Enter a name between 4 and 20 characters: "> + <mx:TextInput id="fname" width="100%"/> + </mx:FormItem> + + <mx:FormItem > + <mx:Button id="myButton" label="Validate" /> + </mx:FormItem> + </mx:Form> + </mx:Panel> +</mx:Application> \ No newline at end of file http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/e1f9d1df/TourDeFlex/TourDeFlex3/src/mx/validators/ZipCodeValidatorExample.mxml ---------------------------------------------------------------------- diff --git a/TourDeFlex/TourDeFlex3/src/mx/validators/ZipCodeValidatorExample.mxml b/TourDeFlex/TourDeFlex3/src/mx/validators/ZipCodeValidatorExample.mxml new file mode 100755 index 0000000..b5375ef --- /dev/null +++ b/TourDeFlex/TourDeFlex3/src/mx/validators/ZipCodeValidatorExample.mxml @@ -0,0 +1,45 @@ +<?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. + --> + +<!-- Simple example to demonstrate the ZipCodeValidator. --> +<mx:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:mx="library://ns.adobe.com/flex/mx"> + + <fx:Script> + import mx.controls.Alert; + </fx:Script> + + <fx:Declarations> + <mx:ZipCodeValidator source="{zip}" property="text" + trigger="{myButton}" triggerEvent="click" + valid="Alert.show('Validation Succeeded!');"/> + </fx:Declarations> + + <mx:Panel title="ZipcodeValidator Example" width="75%" height="75%" + paddingTop="10" paddingLeft="10" paddingRight="10" paddingBottom="10"> + + <mx:Form> + <mx:FormItem label="Enter a 5 or 9 digit U.S. Zip code: "> + <mx:TextInput id="zip" width="100%"/> + </mx:FormItem> + + <mx:FormItem > + <mx:Button id="myButton" label="Validate" /> + </mx:FormItem> + </mx:Form> + </mx:Panel> +</mx:Application> \ No newline at end of file http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/e1f9d1df/TourDeFlex/TourDeFlex3/src/spark/charts/AreaChartExample.mxml ---------------------------------------------------------------------- diff --git a/TourDeFlex/TourDeFlex3/src/spark/charts/AreaChartExample.mxml b/TourDeFlex/TourDeFlex3/src/spark/charts/AreaChartExample.mxml new file mode 100644 index 0000000..f504b6c --- /dev/null +++ b/TourDeFlex/TourDeFlex3/src/spark/charts/AreaChartExample.mxml @@ -0,0 +1,70 @@ +<?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 expensesAC:ArrayCollection = new ArrayCollection( [ + { Month: "Jan", Profit: 2000, Expenses: 1500, Amount: 450 }, + { Month: "Feb", Profit: 1000, Expenses: 200, Amount: 600 }, + { Month: "Mar", Profit: 1500, Expenses: 500, Amount: 300 }, + { Month: "Apr", Profit: 1800, Expenses: 1200, Amount: 900 }, + { Month: "May", Profit: 2400, Expenses: 575, Amount: 500 } ]); + ]]> + </fx:Script> + + <s:layout> + <s:HorizontalLayout verticalAlign="middle" horizontalAlign="center" /> + </s:layout> + + <s:Panel title="AreaChart Control" width="600" height="100%" + color="0x000000" + borderAlpha="0.15"> + + <s:layout> + <s:HorizontalLayout paddingLeft="10" paddingRight="10" paddingTop="10" paddingBottom="10"/> + </s:layout> + + <mx:AreaChart id="Areachart" color="0x323232" height="100%" + showDataTips="true" dataProvider="{expensesAC}"> + + <mx:horizontalAxis> + <mx:CategoryAxis categoryField="Month"/> + </mx:horizontalAxis> + + <mx:series> + <mx:AreaSeries yField="Profit" form="curve" displayName="Profit"/> + <mx:AreaSeries yField="Expenses" form="curve" displayName="Expenses"/> + <mx:AreaSeries yField="Amount" form="curve" displayName="Amount"/> + </mx:series> + </mx:AreaChart> + + <mx:Legend dataProvider="{Areachart}" color="0x323232"/> + + </s:Panel> + +</s:Application> http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/e1f9d1df/TourDeFlex/TourDeFlex3/src/spark/charts/BarChartExample.mxml ---------------------------------------------------------------------- diff --git a/TourDeFlex/TourDeFlex3/src/spark/charts/BarChartExample.mxml b/TourDeFlex/TourDeFlex3/src/spark/charts/BarChartExample.mxml new file mode 100644 index 0000000..554ce88 --- /dev/null +++ b/TourDeFlex/TourDeFlex3/src/spark/charts/BarChartExample.mxml @@ -0,0 +1,68 @@ +<?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 medalsAC:ArrayCollection = new ArrayCollection( [ + { Country: "USA", Gold: 35, Silver:39, Bronze: 29 }, + { Country: "China", Gold: 32, Silver:17, Bronze: 14 }, + { Country: "Russia", Gold: 27, Silver:27, Bronze: 38 } ]); + ]]> + </fx:Script> + + <s:layout> + <s:HorizontalLayout verticalAlign="middle" horizontalAlign="center" /> + </s:layout> + + <s:Panel title="BarChart Control" width="600" height="100%" + color="0x000000" + borderAlpha="0.15"> + + <s:layout> + <s:HorizontalLayout paddingLeft="10" paddingRight="10" paddingTop="10" paddingBottom="10"/> + </s:layout> + + <mx:BarChart id="bar" height="100%" color="0x323232" + showDataTips="true" dataProvider="{medalsAC}"> + + <mx:verticalAxis> + <mx:CategoryAxis categoryField="Country"/> + </mx:verticalAxis> + + <mx:series> + <mx:BarSeries yField="Country" xField="Gold" displayName="Gold"/> + <mx:BarSeries yField="Country" xField="Silver" displayName="Silver"/> + <mx:BarSeries yField="Country" xField="Bronze" displayName="Bronze"/> + </mx:series> + </mx:BarChart> + + <mx:Legend dataProvider="{bar}" color="0x323232"/> + + </s:Panel> + +</s:Application> http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/e1f9d1df/TourDeFlex/TourDeFlex3/src/spark/charts/BubbleChartExample.mxml ---------------------------------------------------------------------- diff --git a/TourDeFlex/TourDeFlex3/src/spark/charts/BubbleChartExample.mxml b/TourDeFlex/TourDeFlex3/src/spark/charts/BubbleChartExample.mxml new file mode 100644 index 0000000..365df88 --- /dev/null +++ b/TourDeFlex/TourDeFlex3/src/spark/charts/BubbleChartExample.mxml @@ -0,0 +1,73 @@ +<?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 expensesAC:ArrayCollection = new ArrayCollection( [ + { Month: "Jan", Profit: 2000, Expenses: 1500, Amount: 450 }, + { Month: "Feb", Profit: 1000, Expenses: 200, Amount: 600 }, + { Month: "Mar", Profit: 1500, Expenses: 500, Amount: 300 }, + { Month: "Apr", Profit: 1800, Expenses: 1200, Amount: 900 }, + { Month: "May", Profit: 2400, Expenses: 575, Amount: 500 } ]); + ]]> + </fx:Script> + + <fx:Style> + @namespace mx "library://ns.adobe.com/flex/mx"; + + mx|BubbleChart { color:#000099; } + </fx:Style> + + <s:layout> + <s:HorizontalLayout verticalAlign="middle" horizontalAlign="center" /> + </s:layout> + + <s:Panel title="BubbleChart Control" width="600" height="100%" + color="0x000000" + borderAlpha="0.15"> + + <s:layout> + <s:HorizontalLayout horizontalAlign="center" + paddingLeft="10" paddingRight="10" + paddingTop="10" paddingBottom="10"/> + </s:layout> + + <mx:BubbleChart id="bubblechart" height="100%" width="100%" paddingRight="5" paddingLeft="5" color="0x323232" + showDataTips="true" maxRadius="20" dataProvider="{expensesAC}"> + + <mx:series> + <mx:BubbleSeries displayName="Profit/Expenses/Amount" + xField="Profit" yField="Expenses" radiusField="Amount"/> + </mx:series> + </mx:BubbleChart> + + <mx:Legend dataProvider="{bubblechart}" color="0x323232"/> + + </s:Panel> + +</s:Application> http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/e1f9d1df/TourDeFlex/TourDeFlex3/src/spark/charts/CandleStickChartExample.mxml ---------------------------------------------------------------------- diff --git a/TourDeFlex/TourDeFlex3/src/spark/charts/CandleStickChartExample.mxml b/TourDeFlex/TourDeFlex3/src/spark/charts/CandleStickChartExample.mxml new file mode 100644 index 0000000..b39be2e --- /dev/null +++ b/TourDeFlex/TourDeFlex3/src/spark/charts/CandleStickChartExample.mxml @@ -0,0 +1,79 @@ +<?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 expensesAC:ArrayCollection = new ArrayCollection( [ + { Date: "25-Jul", Open: 40.75, High: 40.75, Low: 40.24, Close:40.31}, + { Date: "26-Jul", Open: 39.98, High: 40.78, Low: 39.97, Close:40.34}, + { Date: "27-Jul", Open: 40.38, High: 40.66, Low: 40, Close:40.63}, + { Date: "28-Jul", Open: 40.49, High: 40.99, Low: 40.3, Close:40.98}, + { Date: "29-Jul", Open: 40.13, High: 40.4, Low: 39.65, Close:39.95}, + { Date: "1-Aug", Open: 39.00, High: 39.50, Low: 38.7, Close:38.6}, + { Date: "2-Aug", Open: 38.68, High: 39.34, Low: 37.75, Close:38.84}, + { Date: "3-Aug", Open: 38.76, High: 38.76, Low: 38.03, Close:38.12}, + { Date: "4-Aug", Open: 37.98, High: 37.98, Low: 36.56, Close:36.69}, + { Date: "5-Aug", Open: 36.61, High: 37, Low: 36.48, Close:36.86} ]); + ]]> + </fx:Script> + + <s:layout> + <s:HorizontalLayout verticalAlign="middle" horizontalAlign="center" /> + </s:layout> + + <s:Panel title="CandlestickChart Control" width="600" height="100%" + color="0x000000" + borderAlpha="0.15"> + + <s:layout> + <s:HorizontalLayout horizontalAlign="center" + paddingLeft="10" paddingRight="10" + paddingTop="10" paddingBottom="10"/> + </s:layout> + + <mx:CandlestickChart id="candlestickchart" height="100%" width="100%" paddingRight="5" paddingLeft="5" + color="0x323232" showDataTips="true" dataProvider="{expensesAC}"> + + <mx:verticalAxis> + <mx:LinearAxis baseAtZero="false" /> + </mx:verticalAxis> + + <mx:horizontalAxis> + <mx:CategoryAxis categoryField="Date" title="Date"/> + </mx:horizontalAxis> + + <mx:series> + <mx:CandlestickSeries openField="Open" highField="High" + lowField="Low" closeField="Close"/> + </mx:series> + + </mx:CandlestickChart> + + </s:Panel> + +</s:Application> http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/e1f9d1df/TourDeFlex/TourDeFlex3/src/spark/charts/ColumnChartExample.mxml ---------------------------------------------------------------------- diff --git a/TourDeFlex/TourDeFlex3/src/spark/charts/ColumnChartExample.mxml b/TourDeFlex/TourDeFlex3/src/spark/charts/ColumnChartExample.mxml new file mode 100644 index 0000000..f3ba41d --- /dev/null +++ b/TourDeFlex/TourDeFlex3/src/spark/charts/ColumnChartExample.mxml @@ -0,0 +1,70 @@ +<?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 medalsAC:ArrayCollection = new ArrayCollection( [ + { Country: "USA", Gold: 35, Silver:39, Bronze: 29 }, + { Country: "China", Gold: 32, Silver:17, Bronze: 14 }, + { Country: "Russia", Gold: 27, Silver:27, Bronze: 38 } ]); + ]]> + </fx:Script> + + <s:layout> + <s:HorizontalLayout verticalAlign="middle" horizontalAlign="center" /> + </s:layout> + + <s:Panel title="ColumnChart Control" width="600" height="100%" + color="0x000000" + borderAlpha="0.15"> + + <s:layout> + <s:HorizontalLayout horizontalAlign="center" + paddingLeft="10" paddingRight="10" + paddingTop="10" paddingBottom="10"/> + </s:layout> + + <mx:ColumnChart id="column" height="100%" color="0x323232" + showDataTips="true" dataProvider="{medalsAC}"> + + <mx:horizontalAxis> + <mx:CategoryAxis categoryField="Country"/> + </mx:horizontalAxis> + + <mx:series> + <mx:ColumnSeries xField="Country" yField="Gold" displayName="Gold"/> + <mx:ColumnSeries xField="Country" yField="Silver" displayName="Silver"/> + <mx:ColumnSeries xField="Country" yField="Bronze" displayName="Bronze"/> + </mx:series> + </mx:ColumnChart> + + <mx:Legend dataProvider="{column}" color="0x323232"/> + + </s:Panel> + +</s:Application> http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/e1f9d1df/TourDeFlex/TourDeFlex3/src/spark/charts/HLOCChartExample.mxml ---------------------------------------------------------------------- diff --git a/TourDeFlex/TourDeFlex3/src/spark/charts/HLOCChartExample.mxml b/TourDeFlex/TourDeFlex3/src/spark/charts/HLOCChartExample.mxml new file mode 100644 index 0000000..73fe34d --- /dev/null +++ b/TourDeFlex/TourDeFlex3/src/spark/charts/HLOCChartExample.mxml @@ -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" + skinClass="TDFGradientBackgroundSkin"> + + <fx:Script> + <![CDATA[ + + import mx.collections.ArrayCollection; + + [Bindable] + private var stockDataAC:ArrayCollection = new ArrayCollection( [ + { Date: "25-Jul", Open: 40.55, High: 40.75, Low: 40.24, Close:40.31}, + { Date: "26-Jul", Open: 40.15, High: 40.78, Low: 39.97, Close:40.34}, + { Date: "27-Jul", Open: 40.38, High: 40.66, Low: 40, Close:40.63}, + { Date: "28-Jul", Open: 40.49, High: 40.99, Low: 40.3, Close:40.98}, + { Date: "29-Jul", Open: 40.13, High: 40.4, Low: 39.65, Close:39.95}, + { Date: "1-Aug", Open: 39.00, High: 39.50, Low: 38.7, Close:38.6}, + { Date: "2-Aug", Open: 38.68, High: 39.34, Low: 37.75, Close:38.84}, + { Date: "3-Aug", Open: 38.76, High: 38.76, Low: 38.03, Close:38.12}, + { Date: "4-Aug", Open: 37.98, High: 37.98, Low: 36.56, Close:36.69}, + { Date: "5-Aug", Open: 36.61, High: 37, Low: 36.48, Close:36.86} ]); + ]]> + </fx:Script> + + <s:layout> + <s:HorizontalLayout verticalAlign="middle" horizontalAlign="center" /> + </s:layout> + + <s:Panel title="HLOCChart Control" width="600" height="100%" + color="0x000000" + borderAlpha="0.15"> + + <s:layout> + <s:HorizontalLayout horizontalAlign="center" + paddingLeft="10" paddingRight="10" + paddingTop="10" paddingBottom="10"/> + </s:layout> + + <mx:HLOCChart id="hlocchart" height="100%" width="100%" paddingRight="5" paddingLeft="5" + color="0x323232" showDataTips="true" dataProvider="{stockDataAC}"> + + <mx:verticalAxis> + <mx:LinearAxis baseAtZero="false" /> + </mx:verticalAxis> + + <mx:horizontalAxis> + <mx:CategoryAxis categoryField="Date" title="Date" /> + </mx:horizontalAxis> + + <mx:series> + <mx:HLOCSeries openField="Open" highField="High" + lowField="Low" closeField="Close"/> + </mx:series> + </mx:HLOCChart> + + </s:Panel> + +</s:Application> http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/e1f9d1df/TourDeFlex/TourDeFlex3/src/spark/charts/LineChartExample.mxml ---------------------------------------------------------------------- diff --git a/TourDeFlex/TourDeFlex3/src/spark/charts/LineChartExample.mxml b/TourDeFlex/TourDeFlex3/src/spark/charts/LineChartExample.mxml new file mode 100644 index 0000000..5f61ee0 --- /dev/null +++ b/TourDeFlex/TourDeFlex3/src/spark/charts/LineChartExample.mxml @@ -0,0 +1,72 @@ +<?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 expensesAC:ArrayCollection = new ArrayCollection( [ + { Month: "Jan", Profit: 2000, Expenses: 1500, Amount: 450 }, + { Month: "Feb", Profit: 1000, Expenses: 200, Amount: 600 }, + { Month: "Mar", Profit: 1500, Expenses: 500, Amount: 300 }, + { Month: "Apr", Profit: 1800, Expenses: 1200, Amount: 900 }, + { Month: "May", Profit: 2400, Expenses: 575, Amount: 500 } ]); + ]]> + </fx:Script> + + <s:layout> + <s:HorizontalLayout verticalAlign="middle" horizontalAlign="center" /> + </s:layout> + + <s:Panel title="LineChart Control" width="600" height="100%" + color="0x000000" + borderAlpha="0.15"> + + <s:layout> + <s:HorizontalLayout horizontalAlign="center" + paddingLeft="10" paddingRight="10" + paddingTop="10" paddingBottom="10"/> + </s:layout> + + <mx:LineChart id="linechart" color="0x323232" height="100%" + showDataTips="true" dataProvider="{expensesAC}"> + + <mx:horizontalAxis> + <mx:CategoryAxis categoryField="Month"/> + </mx:horizontalAxis> + + <mx:series> + <mx:LineSeries yField="Profit" form="curve" displayName="Profit"/> + <mx:LineSeries yField="Expenses" form="curve" displayName="Expenses"/> + <mx:LineSeries yField="Amount" form="curve" displayName="Amount"/> + </mx:series> + </mx:LineChart> + + <mx:Legend dataProvider="{linechart}" color="0x323232"/> + + </s:Panel> + +</s:Application> http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/e1f9d1df/TourDeFlex/TourDeFlex3/src/spark/charts/PieChartExample.mxml ---------------------------------------------------------------------- diff --git a/TourDeFlex/TourDeFlex3/src/spark/charts/PieChartExample.mxml b/TourDeFlex/TourDeFlex3/src/spark/charts/PieChartExample.mxml new file mode 100644 index 0000000..f14e5c9 --- /dev/null +++ b/TourDeFlex/TourDeFlex3/src/spark/charts/PieChartExample.mxml @@ -0,0 +1,77 @@ +<?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 medalsAC:ArrayCollection = new ArrayCollection( [ + { Country: "USA", Gold: 35, Silver:39, Bronze: 29 }, + { Country: "China", Gold: 32, Silver:17, Bronze: 14 }, + { Country: "Russia", Gold: 27, Silver:27, Bronze: 38 } ]); + + private function displayGold(data:Object, field:String, index:Number, percentValue:Number):String { + var temp:String= (" " + percentValue).substr(0,6); + return data.Country + ": " + '\n' + "Total Gold: " + data.Gold + '\n' + temp + "%"; + } + ]]> + </fx:Script> + + <s:layout> + <s:HorizontalLayout verticalAlign="middle" horizontalAlign="center" /> + </s:layout> + + <s:Panel title="PieChart Control" width="600" height="100%" + color="0x000000" + borderAlpha="0.15"> + + <s:layout> + <s:HorizontalLayout horizontalAlign="center" + paddingLeft="10" paddingRight="10" + paddingTop="10" paddingBottom="10"/> + </s:layout> + + <mx:PieChart id="chart" height="100%" width="100%" paddingRight="5" paddingLeft="5" color="0x323232" + showDataTips="true" dataProvider="{medalsAC}" > + + <mx:series> + <mx:PieSeries labelPosition="callout" field="Gold" labelFunction="displayGold"> + <mx:calloutStroke> + <s:SolidColorStroke weight="0" color="0x888888" alpha="1.0"/> + </mx:calloutStroke> + <mx:radialStroke> + <s:SolidColorStroke weight="0" color="#FFFFFF" alpha="0.20"/> + </mx:radialStroke> + <mx:stroke> + <s:SolidColorStroke color="0" alpha="0.20" weight="2"/> + </mx:stroke> + </mx:PieSeries> + </mx:series> + </mx:PieChart> + + </s:Panel> + +</s:Application> http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/e1f9d1df/TourDeFlex/TourDeFlex3/src/spark/charts/PlotChartExample.mxml ---------------------------------------------------------------------- diff --git a/TourDeFlex/TourDeFlex3/src/spark/charts/PlotChartExample.mxml b/TourDeFlex/TourDeFlex3/src/spark/charts/PlotChartExample.mxml new file mode 100644 index 0000000..8b1b581 --- /dev/null +++ b/TourDeFlex/TourDeFlex3/src/spark/charts/PlotChartExample.mxml @@ -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"> + + <fx:Script> + <![CDATA[ + + import mx.collections.ArrayCollection; + + [Bindable] + private var expensesAC:ArrayCollection = new ArrayCollection( [ + { Month: "Jan", Profit: 2000, Expenses: 1500, Amount: 450 }, + { Month: "Feb", Profit: 1000, Expenses: 200, Amount: 600 }, + { Month: "Mar", Profit: 1500, Expenses: 500, Amount: 300 } ]); + ]]> + </fx:Script> + + <s:layout> + <s:HorizontalLayout verticalAlign="middle" horizontalAlign="center" /> + </s:layout> + + <s:Panel title="PlotChart Control" width="600" height="100%" + color="0x000000" + borderAlpha="0.15"> + + <s:layout> + <s:HorizontalLayout horizontalAlign="center" + paddingLeft="10" paddingRight="10" + paddingTop="10" paddingBottom="10"/> + </s:layout> + + <mx:PlotChart id="plot" height="100%" paddingLeft="5" paddingRight="5" color="0x323232" + showDataTips="true" dataProvider="{expensesAC}"> + + <mx:series> + <mx:PlotSeries xField="Expenses" yField="Profit" displayName="Expenses/Profit"/> + <mx:PlotSeries xField="Amount" yField="Expenses" displayName="Amount/Expenses"/> + <mx:PlotSeries xField="Profit" yField="Amount" displayName="Profit/Amount"/> + </mx:series> + </mx:PlotChart> + + <mx:Legend dataProvider="{plot}" color="0x323232"/> + + </s:Panel> + +</s:Application> http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/e1f9d1df/TourDeFlex/TourDeFlex3/src/spark/charts/SeriesInterpolateExample.mxml ---------------------------------------------------------------------- diff --git a/TourDeFlex/TourDeFlex3/src/spark/charts/SeriesInterpolateExample.mxml b/TourDeFlex/TourDeFlex3/src/spark/charts/SeriesInterpolateExample.mxml new file mode 100644 index 0000000..554f633 --- /dev/null +++ b/TourDeFlex/TourDeFlex3/src/spark/charts/SeriesInterpolateExample.mxml @@ -0,0 +1,114 @@ +<?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 companyAAC:ArrayCollection = new ArrayCollection( [ + { Date: "25-Jul", Open: 40.75, High: 40.75, Low: 40.24, Close:40.31}, + { Date: "26-Jul", Open: 39.98, High: 40.78, Low: 39.97, Close:40.34}, + { Date: "27-Jul", Open: 40.38, High: 40.66, Low: 40, Close:40.63}, + { Date: "28-Jul", Open: 40.49, High: 40.99, Low: 40.3, Close:40.98}, + { Date: "29-Jul", Open: 40.13, High: 40.4, Low: 39.65, Close:39.95}, + { Date: "1-Aug", Open: 39.00, High: 39.50, Low: 38.7, Close:38.6}, + { Date: "2-Aug", Open: 38.68, High: 39.34, Low: 37.75, Close:38.84}, + { Date: "3-Aug", Open: 38.76, High: 38.76, Low: 38.03, Close:38.12}, + { Date: "4-Aug", Open: 37.98, High: 37.98, Low: 36.56, Close:36.69}, + { Date: "5-Aug", Open: 36.61, High: 37, Low: 36.48, Close:36.86} ]); + + [Bindable] + private var companyBAC:ArrayCollection = new ArrayCollection( [ + { Date: "25-Jul", Open: 18.50, High: 19, Low: 18.48, Close:18.86}, + { Date: "26-Jul", Open: 19.56, High: 19.98, Low: 18.6, Close:18.69}, + { Date: "27-Jul", Open: 20.81, High: 20.99, Low: 20.03, Close:20.12}, + { Date: "28-Jul", Open: 20.70, High: 21.00, Low: 19.5, Close:20.84}, + { Date: "29-Jul", Open: 21.7, High: 21.79, Low: 20.45, Close:20.6}, + { Date: "1-Aug", Open: 22.45, High: 22.65, Low: 21.65, Close:21.95}, + { Date: "2-Aug", Open: 22.56, High: 22.6, Low: 22.05, Close:22.98}, + { Date: "3-Aug", Open: 22.42, High: 22.70, Low: 22.1, Close:22.63}, + { Date: "4-Aug", Open: 21.67, High: 22.82, Low: 21.67, Close:22.34}, + { Date: "5-Aug", Open: 22.44, High: 22.85, Low: 22.12, Close:22.31} ]); + + ]]> + </fx:Script> + + <s:layout> + <s:HorizontalLayout verticalAlign="middle" horizontalAlign="center" /> + </s:layout> + + <fx:Declarations> + <mx:SeriesInterpolate id="interpolateIn" duration="1000"/> + </fx:Declarations> + + <s:Panel title="Interpolate Effect" width="600" height="100%" + color="0x000000" + borderAlpha="0.15"> + + <s:layout> + <s:HorizontalLayout horizontalAlign="center" + paddingLeft="10" paddingRight="10" + paddingTop="10" paddingBottom="10"/> + </s:layout> + + <mx:CandlestickChart id="candlestickchart" height="100%" paddingRight="5" paddingLeft="5" color="0x323232" + showDataTips="true" dataProvider="{companyAAC}"> + + <mx:verticalAxis> + <mx:LinearAxis baseAtZero="false" /> + </mx:verticalAxis> + + <mx:horizontalAxis> + <mx:CategoryAxis categoryField="Date" title="Date"/> + </mx:horizontalAxis> + + <mx:series> + <mx:CandlestickSeries + openField="Open" highField="High" + lowField="Low" closeField="Close" + showDataEffect="{interpolateIn}"/> + </mx:series> + </mx:CandlestickChart> + + + <s:BorderContainer color="0x323232" width="30%" borderColor="0xDCDCDC" borderStyle="solid" height="100%"> + + <s:layout> + <s:VerticalLayout paddingLeft="5" paddingRight="0" paddingTop="5" /> + </s:layout> + + <s:Label color="0x0050AA" width="100%" + text="Choose a company to view recent stock data."/> + + <s:RadioButton groupName="stocks" label="View Company A" + selected="true" click="candlestickchart.dataProvider=companyAAC;"/> + <s:RadioButton groupName="stocks" label="View Company B" + click="candlestickchart.dataProvider=companyBAC;"/> + </s:BorderContainer> + + </s:Panel> + +</s:Application> http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/e1f9d1df/TourDeFlex/TourDeFlex3/src/spark/charts/SeriesSlideExample.mxml ---------------------------------------------------------------------- diff --git a/TourDeFlex/TourDeFlex3/src/spark/charts/SeriesSlideExample.mxml b/TourDeFlex/TourDeFlex3/src/spark/charts/SeriesSlideExample.mxml new file mode 100644 index 0000000..4d24782 --- /dev/null +++ b/TourDeFlex/TourDeFlex3/src/spark/charts/SeriesSlideExample.mxml @@ -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" + skinClass="TDFGradientBackgroundSkin"> + + <fx:Script> + <![CDATA[ + + import mx.collections.ArrayCollection; + + [Bindable] + private var companyAAC:ArrayCollection = new ArrayCollection( [ + { Date: "25-Jul", Open: 40.75, High: 40.75, Low: 40.24, Close:40.31}, + { Date: "26-Jul", Open: 39.98, High: 40.78, Low: 39.97, Close:40.34}, + { Date: "27-Jul", Open: 40.38, High: 40.66, Low: 40, Close:40.63}, + { Date: "28-Jul", Open: 40.49, High: 40.99, Low: 40.3, Close:40.98}, + { Date: "29-Jul", Open: 40.13, High: 40.4, Low: 39.65, Close:39.95}, + { Date: "1-Aug", Open: 39.00, High: 39.50, Low: 38.7, Close:38.6}, + { Date: "2-Aug", Open: 38.68, High: 39.34, Low: 37.75, Close:38.84}, + { Date: "3-Aug", Open: 38.76, High: 38.76, Low: 38.03, Close:38.12}, + { Date: "4-Aug", Open: 37.98, High: 37.98, Low: 36.56, Close:36.69}, + { Date: "5-Aug", Open: 36.61, High: 37, Low: 36.48, Close:36.86} ]); + + [Bindable] + private var companyBAC:ArrayCollection = new ArrayCollection( [ + { Date: "25-Jul", Open: 18.50, High: 19, Low: 18.48, Close:18.86}, + { Date: "26-Jul", Open: 19.56, High: 19.98, Low: 18.6, Close:18.69}, + { Date: "27-Jul", Open: 20.81, High: 20.99, Low: 20.03, Close:20.12}, + { Date: "28-Jul", Open: 20.70, High: 21.00, Low: 19.5, Close:20.84}, + { Date: "29-Jul", Open: 21.7, High: 21.79, Low: 20.45, Close:20.6}, + { Date: "1-Aug", Open: 22.45, High: 22.65, Low: 21.65, Close:21.95}, + { Date: "2-Aug", Open: 22.56, High: 22.6, Low: 22.05, Close:22.98}, + { Date: "3-Aug", Open: 22.42, High: 22.70, Low: 22.1, Close:22.63}, + { Date: "4-Aug", Open: 21.67, High: 22.82, Low: 21.67, Close:22.34}, + { Date: "5-Aug", Open: 22.44, High: 22.85, Low: 22.12, Close:22.31} ]); + + ]]> + </fx:Script> + + <s:layout> + <s:HorizontalLayout verticalAlign="middle" horizontalAlign="center" /> + </s:layout> + + <fx:Declarations> + <mx:SeriesSlide id="slideIn" duration="1000" direction="up"/> + <mx:SeriesSlide id="slideOut" duration="1000" direction="down"/> + </fx:Declarations> + + + <s:Panel title="Slide Effect" width="600" height="100%" + color="0x000000" + borderAlpha="0.15"> + + <s:layout> + <s:HorizontalLayout horizontalAlign="center" + paddingLeft="10" paddingRight="10" + paddingTop="10" paddingBottom="10"/> + </s:layout> + + <mx:CandlestickChart id="candlestickchart" height="100%" paddingRight="5" paddingLeft="5" color="0x323232" + showDataTips="true" dataProvider="{companyAAC}"> + + <mx:verticalAxis> + <mx:LinearAxis baseAtZero="false" /> + </mx:verticalAxis> + + <mx:horizontalAxis> + <mx:CategoryAxis categoryField="Date" title="Date"/> + </mx:horizontalAxis> + + <mx:series> + <mx:CandlestickSeries + openField="Open" highField="High" + lowField="Low" closeField="Close" + showDataEffect="{slideIn}" + hideDataEffect="{slideOut}"/> + </mx:series> + </mx:CandlestickChart> + + <s:BorderContainer color="0x323232" width="30%" borderColor="0xDCDCDC" borderStyle="solid" height="100%"> + + <s:layout> + <s:VerticalLayout paddingLeft="5" paddingRight="0" paddingTop="5" /> + </s:layout> + + <s:Label color="0x0050AA" width="100%" + text="Choose a company to view recent stock data."/> + + <s:RadioButton groupName="stocks" label="View Company A" + selected="true" click="candlestickchart.dataProvider=companyAAC;"/> + <s:RadioButton groupName="stocks" label="View Company B" + click="candlestickchart.dataProvider=companyBAC;"/> + </s:BorderContainer> + + </s:Panel> + +</s:Application> http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/e1f9d1df/TourDeFlex/TourDeFlex3/src/spark/charts/SeriesZoomExample.mxml ---------------------------------------------------------------------- diff --git a/TourDeFlex/TourDeFlex3/src/spark/charts/SeriesZoomExample.mxml b/TourDeFlex/TourDeFlex3/src/spark/charts/SeriesZoomExample.mxml new file mode 100644 index 0000000..d94c176 --- /dev/null +++ b/TourDeFlex/TourDeFlex3/src/spark/charts/SeriesZoomExample.mxml @@ -0,0 +1,115 @@ +<?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 companyAAC:ArrayCollection = new ArrayCollection( [ + { Date: "25-Jul", Open: 40.75, High: 40.75, Low: 40.24, Close:40.31}, + { Date: "26-Jul", Open: 39.98, High: 40.78, Low: 39.97, Close:40.34}, + { Date: "27-Jul", Open: 40.38, High: 40.66, Low: 40, Close:40.63}, + { Date: "28-Jul", Open: 40.49, High: 40.99, Low: 40.3, Close:40.98}, + { Date: "29-Jul", Open: 40.13, High: 40.4, Low: 39.65, Close:39.95}, + { Date: "1-Aug", Open: 39.00, High: 39.50, Low: 38.7, Close:38.6}, + { Date: "2-Aug", Open: 38.68, High: 39.34, Low: 37.75, Close:38.84}, + { Date: "3-Aug", Open: 38.76, High: 38.76, Low: 38.03, Close:38.12}, + { Date: "4-Aug", Open: 37.98, High: 37.98, Low: 36.56, Close:36.69}, + { Date: "5-Aug", Open: 36.61, High: 37, Low: 36.48, Close:36.86} ]); + + [Bindable] + private var companyBAC:ArrayCollection = new ArrayCollection( [ + { Date: "25-Jul", Open: 18.50, High: 19, Low: 18.48, Close:18.86}, + { Date: "26-Jul", Open: 19.56, High: 19.98, Low: 18.6, Close:18.69}, + { Date: "27-Jul", Open: 20.81, High: 20.99, Low: 20.03, Close:20.12}, + { Date: "28-Jul", Open: 20.70, High: 21.00, Low: 19.5, Close:20.84}, + { Date: "29-Jul", Open: 21.7, High: 21.79, Low: 20.45, Close:20.6}, + { Date: "1-Aug", Open: 22.45, High: 22.65, Low: 21.65, Close:21.95}, + { Date: "2-Aug", Open: 22.56, High: 22.6, Low: 22.05, Close:22.98}, + { Date: "3-Aug", Open: 22.42, High: 22.70, Low: 22.1, Close:22.63}, + { Date: "4-Aug", Open: 21.67, High: 22.82, Low: 21.67, Close:22.34}, + { Date: "5-Aug", Open: 22.44, High: 22.85, Low: 22.12, Close:22.31} ]); + + ]]> + </fx:Script> + + <s:layout> + <s:HorizontalLayout verticalAlign="middle" horizontalAlign="center" /> + </s:layout> + + <fx:Declarations> + <mx:SeriesZoom id="zoomIn" duration="1000"/> + <mx:SeriesZoom id="zoomOut" duration="1000"/> + </fx:Declarations> + + + <s:Panel title="Zoom Effect" width="600" height="100%" + color="0x000000" + borderAlpha="0.15"> + + <s:layout> + <s:HorizontalLayout horizontalAlign="center" + paddingLeft="10" paddingRight="10" + paddingTop="10" paddingBottom="10"/> + </s:layout> + + <mx:CandlestickChart id="candlestickchart" height="100%" paddingRight="5" paddingLeft="5" color="0x323232" + showDataTips="true" dataProvider="{companyAAC}"> + + <mx:verticalAxis> + <mx:LinearAxis baseAtZero="false" /> + </mx:verticalAxis> + + <mx:horizontalAxis> + <mx:CategoryAxis categoryField="Date" title="Date"/> + </mx:horizontalAxis> + + <mx:series> + <mx:CandlestickSeries + openField="Open" highField="High" + lowField="Low" closeField="Close" + showDataEffect="{zoomIn}" + hideDataEffect="{zoomOut}"/> + </mx:series> + </mx:CandlestickChart> + + <s:BorderContainer color="0x323232" width="30%" borderColor="0xDCDCDC" borderStyle="solid" height="100%"> + <s:layout> + <s:VerticalLayout paddingLeft="5" paddingRight="0" paddingTop="5" /> + </s:layout> + + <s:Label color="0x0050AA" width="100%" + text="Choose a company to view recent stock data."/> + + <s:RadioButton groupName="stocks" label="View Company A" + selected="true" click="candlestickchart.dataProvider=companyAAC;"/> + <s:RadioButton groupName="stocks" label="View Company B" + click="candlestickchart.dataProvider=companyBAC;"/> + </s:BorderContainer> + + </s:Panel> +</s:Application> + http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/e1f9d1df/TourDeFlex/TourDeFlex3/src/spark/charts/TDFGradientBackgroundSkin.mxml ---------------------------------------------------------------------- diff --git a/TourDeFlex/TourDeFlex3/src/spark/charts/TDFGradientBackgroundSkin.mxml b/TourDeFlex/TourDeFlex3/src/spark/charts/TDFGradientBackgroundSkin.mxml new file mode 100644 index 0000000..553aee3 --- /dev/null +++ b/TourDeFlex/TourDeFlex3/src/spark/charts/TDFGradientBackgroundSkin.mxml @@ -0,0 +1,49 @@ +<?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:SparkSkin xmlns:fx="http://ns.adobe.com/mxml/2009" + xmlns:mx="library://ns.adobe.com/flex/mx" + xmlns:s="library://ns.adobe.com/flex/spark"> + + <fx:Metadata> + [HostComponent("spark.components.Application")] + </fx:Metadata> + + <s:states> + <s:State name="normal" /> + <s:State name="disabled" /> + </s:states> + + <s:layout> + <s:BasicLayout /> + </s:layout> + + <s:Rect id="bg" width="100%" height="100%"> + <s:fill> + <s:LinearGradient rotation="90"> + <s:entries> + <s:GradientEntry color="0x000000" ratio="0.00" /> + <s:GradientEntry color="0x323232" ratio="1.0" /> + </s:entries> + </s:LinearGradient> + </s:fill> + </s:Rect> + + <s:Group id="contentGroup" left="0" right="0" top="0" bottom="0" /> +</s:SparkSkin> \ No newline at end of file http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/e1f9d1df/TourDeFlex/TourDeFlex3/src/spark/components/SearchBox.as ---------------------------------------------------------------------- diff --git a/TourDeFlex/TourDeFlex3/src/spark/components/SearchBox.as b/TourDeFlex/TourDeFlex3/src/spark/components/SearchBox.as new file mode 100644 index 0000000..e263c2c --- /dev/null +++ b/TourDeFlex/TourDeFlex3/src/spark/components/SearchBox.as @@ -0,0 +1,176 @@ +//////////////////////////////////////////////////////////////////////////////// +// +// 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 flash.events.Event; + import flash.events.KeyboardEvent; + import flash.events.MouseEvent; + import flash.geom.Point; + import flash.ui.Keyboard; + + import mx.collections.ArrayCollection; + import mx.controls.Button; + import mx.controls.List; + import mx.controls.TextInput; + import mx.core.UIComponent; + import mx.events.FlexEvent; + import mx.events.FlexMouseEvent; + import mx.events.ListEvent; + import mx.managers.PopUpManager; + + [Event(name="textChange", type="flash.events.Event")] + [Event(name="itemSelected", type="SearchBoxEvent")] + + public class SearchBox extends UIComponent + { + [Embed("assets/icon_close.png")] + private var closeIcon:Class; + + private var textInput:TextInput; + private var closeButton:Button; + private var list:List; + + private var isListVisible:Boolean = false; + + public var text:String; + + public function set dataProvider(dp:ArrayCollection):void + { + list.dataProvider = dp; + if (dp != null && dp.length > 0) + { + if (!isListVisible) popup(); + list.selectedIndex = 0; + } + else + { + if (isListVisible) removePopup(); + } + } + + override protected function createChildren():void + { + super.createChildren(); + + textInput = new TextInput(); + textInput.addEventListener(Event.CHANGE, textInput_changeHandler); + textInput.addEventListener(KeyboardEvent.KEY_DOWN, textInput_keyDownHandler); + addChild(textInput); + + closeButton = new Button(); + closeButton.setStyle("icon", closeIcon) + closeButton.setStyle("skin", null) + closeButton.addEventListener(MouseEvent.CLICK, closeHandler); + closeButton.width = 20; + addChild(closeButton); + + list = new List(); + list.setStyle("dropShadowEnabled", true); + list.addEventListener(ListEvent.ITEM_CLICK, selectItem); + systemManager.addEventListener(Event.RESIZE, removePopup, false, 0, true); + } + + override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void + { + super.updateDisplayList(unscaledWidth, unscaledHeight); + + textInput.width = unscaledWidth - closeButton.width; + textInput.height = unscaledHeight; + + closeButton.height = unscaledHeight; + closeButton.move(unscaledWidth - closeButton.width, 0); + } + + override protected function measure():void + { + super.measure(); + this.measuredWidth = 160; + this.measuredHeight = textInput.measuredHeight; + } + + private function textInput_keyDownHandler(event:KeyboardEvent):void + { + switch (event.keyCode) + { + case Keyboard.DOWN: + if (isListVisible) + list.selectedIndex++; + else + popup(); + break; + case Keyboard.UP: + if (isListVisible && list.selectedIndex > 0) + { + list.selectedIndex--; + } + textInput.setSelection(textInput.text.length, textInput.text.length); + break; + case Keyboard.ENTER: + if (isListVisible) selectItem(); + break; + case Keyboard.ESCAPE: + if (isListVisible) removePopup(); + break; + } + } + + private function textInput_changeHandler(event:Event):void + { + text = textInput.text; + dispatchEvent(new Event("textChange")); + } + + private function list_mouseDownOutsideHandler(event:MouseEvent):void + { + removePopup(); + } + + private function selectItem(event:ListEvent = null):void + { + dispatchEvent(new SearchBoxEvent(SearchBoxEvent.ITEM_SELECTED, list.selectedItem)); + removePopup(); + } + + private function popup():void + { + PopUpManager.addPopUp(list, this); + isListVisible = true; + list.width = textInput.width; + var point:Point = new Point(0, unscaledHeight); + point = localToGlobal(point); + point = list.parent.globalToLocal(point); + list.move(point.x, point.y); + list.addEventListener(FlexMouseEvent.MOUSE_DOWN_OUTSIDE, list_mouseDownOutsideHandler); + } + + private function removePopup(event:Event=null):void + { + PopUpManager.removePopUp(list); + list.removeEventListener(FlexMouseEvent.MOUSE_DOWN_OUTSIDE, list_mouseDownOutsideHandler); + isListVisible = false; + } + + private function closeHandler(event:MouseEvent):void + { + textInput.text = ""; + textInput.setFocus(); + } + + } +} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/e1f9d1df/TourDeFlex/TourDeFlex3/src/spark/components/SearchBoxEvent.as ---------------------------------------------------------------------- diff --git a/TourDeFlex/TourDeFlex3/src/spark/components/SearchBoxEvent.as b/TourDeFlex/TourDeFlex3/src/spark/components/SearchBoxEvent.as new file mode 100644 index 0000000..28e744f --- /dev/null +++ b/TourDeFlex/TourDeFlex3/src/spark/components/SearchBoxEvent.as @@ -0,0 +1,35 @@ +//////////////////////////////////////////////////////////////////////////////// +// +// 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 flash.events.Event; + + public class SearchBoxEvent extends Event + { + public static const ITEM_SELECTED:String = "itemSelected"; + + public var item:Object; + + public function SearchBoxEvent(type:String, item:Object, bubbles:Boolean = true, cancelable:Boolean = false) + { + this.item = item; + super(type, bubbles, cancelable); + } + } +} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/e1f9d1df/TourDeFlex/TourDeFlex3/src/spark/components/SearchExample.mxml ---------------------------------------------------------------------- diff --git a/TourDeFlex/TourDeFlex3/src/spark/components/SearchExample.mxml b/TourDeFlex/TourDeFlex3/src/spark/components/SearchExample.mxml new file mode 100644 index 0000000..6843f52 --- /dev/null +++ b/TourDeFlex/TourDeFlex3/src/spark/components/SearchExample.mxml @@ -0,0 +1,91 @@ +<?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="*" + skinClass="TDFGradientBackgroundSkin"> + + <fx:Style> + @namespace s "library://ns.adobe.com/flex/spark"; + @namespace mx "library://ns.adobe.com/flex/mx"; + @namespace local "*"; + + s|Label { + color: #000000; + } + + </fx:Style> + + <fx:Script> + <![CDATA[ + + import mx.collections.ArrayCollection; + + private var names:ArrayCollection = new ArrayCollection( + ["John Smith", "Jane Doe", "Paul Dupont", "Liz Jones", "Marie Taylor"]); + + private function searchName(item:Object):Boolean + { + return item.toLowerCase().search(searchBox.text) != -1; + } + + private function textChangeHandler():void + { + names.filterFunction = searchName; + names.refresh(); + searchBox.dataProvider = names; + } + + private function itemSelectedHandler(event:SearchBoxEvent):void + { + fullName.text = event.item as String; + } + + ]]> + </fx:Script> + + <s:layout> + <s:HorizontalLayout verticalAlign="middle" horizontalAlign="center" /> + </s:layout> + + <s:Panel title="Components Samples" + width="600" height="100%" + color="0x000000" + borderAlpha="0.15"> + + <s:layout> + <s:HorizontalLayout horizontalAlign="center" + paddingLeft="10" paddingRight="10" + paddingTop="10" paddingBottom="10"/> + </s:layout> + + <s:HGroup > + <s:Label text="Type a few characters to search:" /> + <local:SearchBox id="searchBox" textChange="textChangeHandler()" itemSelected="itemSelectedHandler(event)"/> + </s:HGroup> + + <mx:FormItem label="You selected:" > + <s:TextInput id="fullName"/> + </mx:FormItem> + + </s:Panel> + +</s:Application> http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/e1f9d1df/TourDeFlex/TourDeFlex3/src/spark/components/TDFGradientBackgroundSkin.mxml ---------------------------------------------------------------------- diff --git a/TourDeFlex/TourDeFlex3/src/spark/components/TDFGradientBackgroundSkin.mxml b/TourDeFlex/TourDeFlex3/src/spark/components/TDFGradientBackgroundSkin.mxml new file mode 100644 index 0000000..553aee3 --- /dev/null +++ b/TourDeFlex/TourDeFlex3/src/spark/components/TDFGradientBackgroundSkin.mxml @@ -0,0 +1,49 @@ +<?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:SparkSkin xmlns:fx="http://ns.adobe.com/mxml/2009" + xmlns:mx="library://ns.adobe.com/flex/mx" + xmlns:s="library://ns.adobe.com/flex/spark"> + + <fx:Metadata> + [HostComponent("spark.components.Application")] + </fx:Metadata> + + <s:states> + <s:State name="normal" /> + <s:State name="disabled" /> + </s:states> + + <s:layout> + <s:BasicLayout /> + </s:layout> + + <s:Rect id="bg" width="100%" height="100%"> + <s:fill> + <s:LinearGradient rotation="90"> + <s:entries> + <s:GradientEntry color="0x000000" ratio="0.00" /> + <s:GradientEntry color="0x323232" ratio="1.0" /> + </s:entries> + </s:LinearGradient> + </s:fill> + </s:Rect> + + <s:Group id="contentGroup" left="0" right="0" top="0" bottom="0" /> +</s:SparkSkin> \ No newline at end of file http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/e1f9d1df/TourDeFlex/TourDeFlex3/src/spark/components/VideoPlayer.mxml ---------------------------------------------------------------------- diff --git a/TourDeFlex/TourDeFlex3/src/spark/components/VideoPlayer.mxml b/TourDeFlex/TourDeFlex3/src/spark/components/VideoPlayer.mxml new file mode 100644 index 0000000..b4797ff --- /dev/null +++ b/TourDeFlex/TourDeFlex3/src/spark/components/VideoPlayer.mxml @@ -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. + +--> +<s:BorderContainer xmlns:fx="http://ns.adobe.com/mxml/2009" + xmlns:s="library://ns.adobe.com/flex/spark" + xmlns:mx="library://ns.adobe.com/flex/mx" + borderStyle="solid" + backgroundColor="#333333" + initialize="init(event)"> + + <fx:Metadata> + [Event(name="complete", type="mx.events.VideoEvent")] + [Event(name="mediaPlayerStateChange", type="org.osmf.events.MediaPlayerStateChangeEvent")] + </fx:Metadata> + + <fx:Script> + <![CDATA[ + import mx.events.ItemClickEvent; + import mx.events.FlexEvent; + import mx.events.VideoEvent; + + import org.osmf.events.MediaPlayerStateChangeEvent; + import org.osmf.events.TimeEvent; + import org.osmf.utils.OSMFSettings; + + [Bindable] public var videoWidth:int = 240; + [Bindable] public var videoHeight:int = 180; + [Bindable] public var source:String; + + protected function init(event:FlexEvent):void { + OSMFSettings.enableStageVideo = false; + } + + private function buttonBarClick(event:ItemClickEvent):void + { + switch (event.index) + { + case 0: + videoDisplay.play(); + break; + case 1: + videoDisplay.pause(); + break; + case 2: + videoDisplay.stop(); + break; + } + } + + private function playHeadUpdateHandler(event:TimeEvent):void + { + progressBar.setProgress(event.time, videoDisplay.duration); + } + + ]]> + </fx:Script> + + <s:layout> + <s:VerticalLayout verticalAlign="middle" horizontalAlign="center" /> + </s:layout> + + <s:VideoDisplay id="videoDisplay" width="{videoWidth}" height="{videoHeight}" autoPlay="false" + currentTimeChange="playHeadUpdateHandler(event)" + source="{source}" + complete="dispatchEvent(event)" + mediaPlayerStateChange="dispatchEvent(event)"/> + + <mx:ProgressBar id="progressBar" mode="manual" minimum="0" maximum="{videoDisplay.duration}" + label="" top="{videoHeight + 8}" left="4" right="4"/> + + <mx:ButtonBar id="bb" itemClick="buttonBarClick(event)" top="{videoHeight + 20}" bottom="4" + horizontalCenter="0" toolTipField="toolTip"> + <mx:dataProvider> + <fx:Object icon="@Embed('assets/control_play_blue.png')" toolTip="Play"/> + <fx:Object icon="@Embed('assets/control_pause_blue.png')" toolTip="Pause"/> + <fx:Object icon="@Embed('assets/control_stop_blue.png')" toolTip="Stop"/> + </mx:dataProvider> + </mx:ButtonBar> + +</s:BorderContainer> http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/e1f9d1df/TourDeFlex/TourDeFlex3/src/spark/components/VideoPlayerExample.mxml ---------------------------------------------------------------------- diff --git a/TourDeFlex/TourDeFlex3/src/spark/components/VideoPlayerExample.mxml b/TourDeFlex/TourDeFlex3/src/spark/components/VideoPlayerExample.mxml new file mode 100644 index 0000000..17b7efb --- /dev/null +++ b/TourDeFlex/TourDeFlex3/src/spark/components/VideoPlayerExample.mxml @@ -0,0 +1,49 @@ +<?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="*" + skinClass="TDFGradientBackgroundSkin"> + + <s:layout> + <s:HorizontalLayout verticalAlign="middle" horizontalAlign="center" /> + </s:layout> + + <s:Panel title="Components Samples" + width="600" height="100%" + color="0x000000" + borderAlpha="0.15"> + + <s:layout> + <s:HorizontalLayout horizontalAlign="center" + paddingLeft="10" paddingRight="10" + paddingTop="10" paddingBottom="10"/> + </s:layout> + + <local:VideoPlayer source="assets/FlexInstaller.mp4" + complete="log.text += 'complete\n'" + mediaPlayerStateChange="log.text += event.state.toString() + '\n'"/> + + <s:TextArea id="log" height="220"/> + + </s:Panel> + +</s:Application> http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/e1f9d1df/TourDeFlex/TourDeFlex3/src/spark/components/VideoPlayerModule.mxml ---------------------------------------------------------------------- diff --git a/TourDeFlex/TourDeFlex3/src/spark/components/VideoPlayerModule.mxml b/TourDeFlex/TourDeFlex3/src/spark/components/VideoPlayerModule.mxml new file mode 100644 index 0000000..6ec18a7 --- /dev/null +++ b/TourDeFlex/TourDeFlex3/src/spark/components/VideoPlayerModule.mxml @@ -0,0 +1,46 @@ +<?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. + +--> +<mx:Module 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="*" + layout="horizontal" + paddingTop="8" + initialize="init(event)"> + + <fx:Script> + <![CDATA[ + import mx.events.FlexEvent; + + import org.osmf.utils.OSMFSettings; + + protected function init(event:FlexEvent):void { + OSMFSettings.enableStageVideo = false; + } + ]]> + </fx:Script> + + <VideoPlayer source="assets/FlexInstaller.mp4" + complete="log.text += 'complete\n'" + mediaPlayerStateChange="log.text += event.state + '\n'"/> + + <s:TextArea id="log" height="220"/> + +</mx:Module> http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/e1f9d1df/TourDeFlex/TourDeFlex3/src/spark/components/VideoPlayerModuleLoader.mxml ---------------------------------------------------------------------- diff --git a/TourDeFlex/TourDeFlex3/src/spark/components/VideoPlayerModuleLoader.mxml b/TourDeFlex/TourDeFlex3/src/spark/components/VideoPlayerModuleLoader.mxml new file mode 100644 index 0000000..f11dac8 --- /dev/null +++ b/TourDeFlex/TourDeFlex3/src/spark/components/VideoPlayerModuleLoader.mxml @@ -0,0 +1,34 @@ +<?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:Script> + <![CDATA[ + import mx.controls.Alert; + ]]> + </fx:Script> + + <mx:ModuleLoader url="VideoPlayerModule.swf" width="100%" height="100%" error="Alert.show(event.errorText)"/> + + <s:VideoDisplay/> + +</s:Application> http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/e1f9d1df/TourDeFlex/TourDeFlex3/src/spark/components/assets/FlexInstaller.mp4 ---------------------------------------------------------------------- diff --git a/TourDeFlex/TourDeFlex3/src/spark/components/assets/FlexInstaller.mp4 b/TourDeFlex/TourDeFlex3/src/spark/components/assets/FlexInstaller.mp4 new file mode 100644 index 0000000..8c877c4 Binary files /dev/null and b/TourDeFlex/TourDeFlex3/src/spark/components/assets/FlexInstaller.mp4 differ http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/e1f9d1df/TourDeFlex/TourDeFlex3/src/spark/components/assets/control_pause_blue.png ---------------------------------------------------------------------- diff --git a/TourDeFlex/TourDeFlex3/src/spark/components/assets/control_pause_blue.png b/TourDeFlex/TourDeFlex3/src/spark/components/assets/control_pause_blue.png new file mode 100644 index 0000000..ec61099 Binary files /dev/null and b/TourDeFlex/TourDeFlex3/src/spark/components/assets/control_pause_blue.png differ http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/e1f9d1df/TourDeFlex/TourDeFlex3/src/spark/components/assets/control_play_blue.png ---------------------------------------------------------------------- diff --git a/TourDeFlex/TourDeFlex3/src/spark/components/assets/control_play_blue.png b/TourDeFlex/TourDeFlex3/src/spark/components/assets/control_play_blue.png new file mode 100644 index 0000000..f8c8ec6 Binary files /dev/null and b/TourDeFlex/TourDeFlex3/src/spark/components/assets/control_play_blue.png differ http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/e1f9d1df/TourDeFlex/TourDeFlex3/src/spark/components/assets/control_stop_blue.png ---------------------------------------------------------------------- diff --git a/TourDeFlex/TourDeFlex3/src/spark/components/assets/control_stop_blue.png b/TourDeFlex/TourDeFlex3/src/spark/components/assets/control_stop_blue.png new file mode 100644 index 0000000..e6f75d2 Binary files /dev/null and b/TourDeFlex/TourDeFlex3/src/spark/components/assets/control_stop_blue.png differ http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/e1f9d1df/TourDeFlex/TourDeFlex3/src/spark/components/assets/icon_close.png ---------------------------------------------------------------------- diff --git a/TourDeFlex/TourDeFlex3/src/spark/components/assets/icon_close.png b/TourDeFlex/TourDeFlex3/src/spark/components/assets/icon_close.png new file mode 100644 index 0000000..bf9be79 Binary files /dev/null and b/TourDeFlex/TourDeFlex3/src/spark/components/assets/icon_close.png differ http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/e1f9d1df/TourDeFlex/TourDeFlex3/src/spark/containers/BorderExample.mxml ---------------------------------------------------------------------- diff --git a/TourDeFlex/TourDeFlex3/src/spark/containers/BorderExample.mxml b/TourDeFlex/TourDeFlex3/src/spark/containers/BorderExample.mxml new file mode 100644 index 0000000..c64b094 --- /dev/null +++ b/TourDeFlex/TourDeFlex3/src/spark/containers/BorderExample.mxml @@ -0,0 +1,71 @@ +<?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://blog.flexexamples.com/2009/09/04/setting-the-corner-radius-on-a-spark-border-container-in-flex-4/ --> +<s:Application name="Spark_Border_cornerRadius_test" + xmlns:fx="http://ns.adobe.com/mxml/2009" + xmlns:mx="library://ns.adobe.com/flex/mx" + xmlns:s="library://ns.adobe.com/flex/spark" viewSourceURL="srcview/index.html"> + + <s:Panel width="100%" height="100%" title="BorderContainer Sample" + skinClass="skins.TDFPanelSkin"> + + <s:VGroup id="mainGroup" width="100%" + horizontalCenter="50" top="10"> + <s:HGroup gap="50" paddingBottom="15"> + <s:VGroup> + <s:HGroup verticalAlign="middle"> + <s:Label text="Corner Radius:"/> + <s:HSlider id="slider" + minimum="0" + maximum="100" + value="2" /> + </s:HGroup> + <s:HGroup verticalAlign="middle"> + <s:Label text="Border Weight:"/> + <s:NumericStepper id="weight" value="3"/> + </s:HGroup> + <s:HGroup verticalAlign="middle"> + <s:Label text="Border Color:"/> + <mx:ColorPicker id="color" color="0x000000"/> + </s:HGroup> + <s:HGroup verticalAlign="middle"> + <s:Label text="Drop Shadow:"/> + <s:CheckBox id="chkShadow" selected="true"/> + </s:HGroup> + </s:VGroup> + + <s:BorderContainer id="brdr" width="200" + cornerRadius="{slider.value}" borderWeight="{weight.value}" + borderColor="{color.selectedColor}" dropShadowVisible="{chkShadow.selected}" + backgroundColor="0x3399ff"> + </s:BorderContainer> + </s:HGroup> + + <s:Label bottom="10" horizontalCenter="0" width="95%" verticalAlign="justify" color="#323232" + text="The Border class provides a container class that can be styled with a border and +a background fill or image. It has many of the same styles as HaloBorder and is used in a similar way to the +Halo container classes such as Box and Canvas. Examples of styles that are supported are borderWeight, borderColor, +backgroundColor, backgroundImage, cornerRadius and dropShadowVisible."/> + </s:VGroup> + + </s:Panel> + + +</s:Application> \ No newline at end of file http://git-wip-us.apache.org/repos/asf/flex-utilities/blob/e1f9d1df/TourDeFlex/TourDeFlex3/src/spark/containers/Contact.as ---------------------------------------------------------------------- diff --git a/TourDeFlex/TourDeFlex3/src/spark/containers/Contact.as b/TourDeFlex/TourDeFlex3/src/spark/containers/Contact.as new file mode 100644 index 0000000..838a300 --- /dev/null +++ b/TourDeFlex/TourDeFlex3/src/spark/containers/Contact.as @@ -0,0 +1,34 @@ +//////////////////////////////////////////////////////////////////////////////// +// +// 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 Contact + { + public var name:String; + public var address:String; + public var city:String; + public var state:String; + public var zip:String; + + public function Contact() + { + } + } +} \ No newline at end of file