http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/mx/charts/GridLinesExample.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/mx/charts/GridLinesExample.mxml b/tourdeflexmodules/src/mx/charts/GridLinesExample.mxml new file mode 100755 index 0000000..95b15ca --- /dev/null +++ b/tourdeflexmodules/src/mx/charts/GridLinesExample.mxml @@ -0,0 +1,71 @@ +<?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 GridLines class. --> +<mx:Module xmlns:fx="http://ns.adobe.com/mxml/2009"; xmlns:mx="library://ns.adobe.com/flex/mx" + paddingBottom="0" paddingTop="0" paddingLeft="0" paddingRight="0" + height="100%" width="100%"> + + <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> + + <mx:Panel title="GridLines Example" + paddingBottom="10" paddingTop="10" paddingLeft="10" paddingRight="10" + height="100%" width="100%"> + <mx:LineChart id="linechart" height="100%" width="100%" + paddingLeft="5" paddingRight="5" + showDataTips="true" dataProvider="{expensesAC}"> + + <mx:horizontalAxis> + <mx:CategoryAxis categoryField="Month"/> + </mx:horizontalAxis> + + <mx:backgroundElements> + <mx:GridLines gridDirection="horizontal"> + <mx:horizontalStroke> + <mx:SolidColorStroke weight="1"/> + </mx:horizontalStroke> + <mx:horizontalFill> + <mx:SolidColor color="0xCCCCCC" alpha=".66"/> + </mx:horizontalFill> + </mx:GridLines> + </mx:backgroundElements> + + <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}"/> + + </mx:Panel> +</mx:Module>
http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/mx/charts/HLOCChartExample.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/mx/charts/HLOCChartExample.mxml b/tourdeflexmodules/src/mx/charts/HLOCChartExample.mxml new file mode 100755 index 0000000..8580b3c --- /dev/null +++ b/tourdeflexmodules/src/mx/charts/HLOCChartExample.mxml @@ -0,0 +1,81 @@ +<?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 HLOCChart control. --> +<mx:Module xmlns:fx="http://ns.adobe.com/mxml/2009"; xmlns:mx="library://ns.adobe.com/flex/mx" + paddingBottom="0" paddingTop="0" paddingLeft="0" paddingRight="0" + height="100%" width="100%"> + + <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> + + <fx:Declarations> + <!-- Define custom Stroke for the wick and ticks. --> + <mx:SolidColorStroke id="s1" color="0x000000" weight="5" joints="bevel" caps="square"/> + </fx:Declarations> + + <mx:Panel title="HLOCChart Control Example" + paddingBottom="10" paddingTop="10" paddingLeft="10" paddingRight="10" + height="100%" width="100%"> + <mx:HLOCChart id="hlocchart" height="100%" width="100%" + paddingRight="5" paddingLeft="5" + showDataTips="true" dataProvider="{stockDataAC}"> + + <mx:verticalAxis> + <mx:LinearAxis id="vaxis" baseAtZero="false" title="Price"/> + </mx:verticalAxis> + + <mx:horizontalAxis> + <mx:CategoryAxis id="haxis" categoryField="Date" title="Date"/> + </mx:horizontalAxis> + + <mx:horizontalAxisRenderers> + <mx:AxisRenderer axis="{haxis}" canDropLabels="true"/> + </mx:horizontalAxisRenderers> + + <mx:series> + <mx:HLOCSeries + openField="Open" + highField="High" + lowField="Low" + closeField="Close" + stroke="{s1}" + openTickStroke="{s1}" + closeTickStroke="{s1}" + openTickLength="7" + closeTickLength="7" /> + </mx:series> + </mx:HLOCChart> + </mx:Panel> +</mx:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/mx/charts/Line_AreaChartExample.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/mx/charts/Line_AreaChartExample.mxml b/tourdeflexmodules/src/mx/charts/Line_AreaChartExample.mxml new file mode 100755 index 0000000..4327376 --- /dev/null +++ b/tourdeflexmodules/src/mx/charts/Line_AreaChartExample.mxml @@ -0,0 +1,91 @@ +<?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 LineChart and AreaChart controls. --> +<mx:Module xmlns:fx="http://ns.adobe.com/mxml/2009"; xmlns:mx="library://ns.adobe.com/flex/mx" + paddingBottom="0" paddingTop="0" paddingLeft="0" paddingRight="0" + height="100%" width="100%"> + + <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:Declarations> + <!-- Define custom colors for use as fills in the AreaChart control. --> + <mx:SolidColor id="sc1" alpha=".3"/> + <mx:SolidColor id="sc2" color="red" alpha=".3"/> + <mx:SolidColor id="sc3" color="green" alpha=".3"/> + + <!-- Define custom Strokes. --> + <mx:SolidColorStroke id = "s1" weight="2"/> + <mx:SolidColorStroke id = "s2" color="red" weight="2"/> + <mx:SolidColorStroke id = "s3" color="green" weight="2"/> + </fx:Declarations> + + <mx:Panel title="LineChart and AreaChart Controls Example" + paddingBottom="10" paddingTop="10" paddingLeft="10" paddingRight="10" + layout="horizontal" height="100%" width="100%"> + + + <mx:LineChart id="linechart" height="100%" width="45%" + paddingLeft="5" paddingRight="5" + showDataTips="true" dataProvider="{expensesAC}"> + + <mx:horizontalAxis> + <mx:CategoryAxis categoryField="Month"/> + </mx:horizontalAxis> + + <mx:series> + <mx:LineSeries yField="Profit" form="curve" displayName="Profit" lineStroke="{s1}"/> + <mx:LineSeries yField="Expenses" form="curve" displayName="Expenses" lineStroke="{s2}"/> + <mx:LineSeries yField="Amount" form="curve" displayName="Amount" lineStroke="{s3}"/> + </mx:series> + </mx:LineChart> + + <mx:Legend dataProvider="{linechart}"/> + + <mx:AreaChart id="Areachart" height="100%" width="45%" + paddingLeft="5" paddingRight="5" + showDataTips="true" dataProvider="{expensesAC}"> + + <mx:horizontalAxis> + <mx:CategoryAxis categoryField="Month"/> + </mx:horizontalAxis> + + <mx:series> + <mx:AreaSeries yField="Profit" form="curve" displayName="Profit" areaStroke="{s1}" areaFill="{sc1}"/> + <mx:AreaSeries yField="Expenses" form="curve" displayName="Expenses" areaStroke="{s2}" areaFill="{sc2}"/> + <mx:AreaSeries yField="Amount" form="curve" displayName="Amount" areaStroke="{s3}" areaFill="{sc3}"/> + </mx:series> + </mx:AreaChart> + + <mx:Legend dataProvider="{Areachart}"/> + + </mx:Panel> +</mx:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/mx/charts/LogAxisExample.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/mx/charts/LogAxisExample.mxml b/tourdeflexmodules/src/mx/charts/LogAxisExample.mxml new file mode 100755 index 0000000..f52d06b --- /dev/null +++ b/tourdeflexmodules/src/mx/charts/LogAxisExample.mxml @@ -0,0 +1,65 @@ +<?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 LogAxis class. --> +<mx:Module xmlns:fx="http://ns.adobe.com/mxml/2009"; xmlns:mx="library://ns.adobe.com/flex/mx" + paddingBottom="0" paddingTop="0" paddingLeft="0" paddingRight="0" + height="100%" width="100%"> + + <fx:Script> + <![CDATA[ + + import mx.collections.ArrayCollection; + + [Bindable] + private var expensesAC:ArrayCollection = new ArrayCollection( [ + { Month: "Jan", Profit: 20000, Expenses: 1500, Amount: 450 }, + { Month: "Feb", Profit: 1000, Expenses: 15000, Amount: 600 }, + { Month: "Mar", Profit: 15000, Expenses: 5000, Amount: 300 }, + { Month: "Apr", Profit: 1800, Expenses: 1200, Amount: 900 }, + { Month: "May", Profit: 2400, Expenses: 575, Amount: 500 } ]); + ]]> + </fx:Script> + + <mx:Panel title="LogAxis Example" + paddingBottom="10" paddingTop="10" paddingLeft="10" paddingRight="10" + height="100%" width="100%"> + + <mx:LineChart id="linechart" height="100%" width="100%" + paddingLeft="5" paddingRight="5" + showDataTips="true" dataProvider="{expensesAC}"> + + <mx:horizontalAxis> + <mx:CategoryAxis categoryField="Month"/> + </mx:horizontalAxis> + + <mx:verticalAxis> + <mx:LogAxis interval="10"/> + </mx:verticalAxis> + + <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}"/> + + </mx:Panel> +</mx:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/mx/charts/PieChartExample.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/mx/charts/PieChartExample.mxml b/tourdeflexmodules/src/mx/charts/PieChartExample.mxml new file mode 100755 index 0000000..54a8f04 --- /dev/null +++ b/tourdeflexmodules/src/mx/charts/PieChartExample.mxml @@ -0,0 +1,86 @@ +<?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 PieChart control. --> +<mx:Module xmlns:fx="http://ns.adobe.com/mxml/2009"; xmlns:mx="library://ns.adobe.com/flex/mx" + paddingBottom="0" paddingTop="0" paddingLeft="0" paddingRight="0" + height="100%" width="100%"> + + <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> + + <fx:Declarations> + <!-- Define custom colors for use as pie wedge fills. --> + <mx:SolidColor id="sc1" alpha=".6"/> + <mx:SolidColor id="sc2" color="red" alpha=".6"/> + <mx:SolidColor id="sc3" color="0x663300" alpha=".6"/> + + <!-- This Stroke is used for the callout lines. --> + <mx:SolidColorStroke id="callouts" weight="2" color="0x999999" alpha=".8" caps="square"/> + + <!-- This Stroke is used to separate the wedges in the pie. --> + <mx:SolidColorStroke id="radial" weight="1" color="0xFFFFCC" alpha=".3"/> + + <!-- This Stroke is used for the outer border of the pie. --> + <mx:SolidColorStroke id="pieborder" color="0x000000" weight="2" alpha=".5"/> + </fx:Declarations> + + <mx:Panel title="Olympics 2004 Medals Tally Panel" + paddingBottom="10" paddingTop="10" paddingLeft="10" paddingRight="10" + height="100%" width="100%"> + <mx:PieChart id="chart" + height="100%" + width="100%" + paddingRight="5" + paddingLeft="5" + showDataTips="true" + dataProvider="{medalsAC}"> + <mx:series> + <mx:PieSeries + nameField="Country" + labelPosition="callout" + field="Gold" + labelFunction="displayGold" + calloutStroke="{callouts}" + radialStroke="{radial}" + stroke="{pieborder}" + fills="{[sc1, sc2, sc3]}"> + <!-- Clear the drop shadow filters from the chart. --> + <mx:filters> + <fx:Array/> + </mx:filters> + </mx:PieSeries> + </mx:series> + </mx:PieChart> + <mx:Legend dataProvider="{chart}"/> + </mx:Panel> +</mx:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/mx/charts/PlotChartExample.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/mx/charts/PlotChartExample.mxml b/tourdeflexmodules/src/mx/charts/PlotChartExample.mxml new file mode 100755 index 0000000..e08ead0 --- /dev/null +++ b/tourdeflexmodules/src/mx/charts/PlotChartExample.mxml @@ -0,0 +1,81 @@ +<?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 PlotChart control. --> +<mx:Module xmlns:fx="http://ns.adobe.com/mxml/2009"; xmlns:mx="library://ns.adobe.com/flex/mx" + paddingBottom="0" paddingTop="0" paddingLeft="0" paddingRight="0" + height="100%" width="100%"> + + <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> + + <fx:Declarations> + <!-- Define custom colors for use as plot point fills. --> + <mx:SolidColor id="sc1" alpha=".3"/> + <mx:SolidColor id="sc2" color="red" alpha=".3"/> + <mx:SolidColor id="sc3" color="green" alpha=".3"/> + + <!-- Define custom Strokes. --> + <mx:SolidColorStroke id="s1" weight="1"/> + <mx:SolidColorStroke id="s2" color="red" weight="1"/> + <mx:SolidColorStroke id="s3" color="green" weight="1"/> + </fx:Declarations> + + <mx:Panel title="PlotChart Control Example" + paddingBottom="10" paddingTop="10" paddingLeft="10" paddingRight="10" + height="100%" width="100%"> + <mx:PlotChart id="plot" + height="100%" + width="100%" + paddingLeft="5" + paddingRight="5" + showDataTips="true" + dataProvider="{expensesAC}"> + <mx:series> + <mx:PlotSeries + xField="Expenses" + yField="Profit" + displayName="Plot 1" + fill="{sc1}" + stroke="{s1}" /> + <mx:PlotSeries + xField="Amount" + yField="Expenses" + displayName="Plot 2" + fill="{sc2}" + stroke="{s2}" /> + <mx:PlotSeries + xField="Profit" + yField="Amount" + displayName="Plot 3" + fill="{sc3}" + stroke="{s3}" /> + </mx:series> + </mx:PlotChart> + <mx:Legend dataProvider="{plot}"/> + </mx:Panel> +</mx:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/mx/charts/SeriesInterpolateExample.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/mx/charts/SeriesInterpolateExample.mxml b/tourdeflexmodules/src/mx/charts/SeriesInterpolateExample.mxml new file mode 100755 index 0000000..152c2c6 --- /dev/null +++ b/tourdeflexmodules/src/mx/charts/SeriesInterpolateExample.mxml @@ -0,0 +1,99 @@ +<?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 CandlestickChart control. --> +<mx:Module xmlns:fx="http://ns.adobe.com/mxml/2009"; xmlns:mx="library://ns.adobe.com/flex/mx" + paddingBottom="0" paddingTop="0" paddingLeft="0" paddingRight="0" + height="100%" width="100%"> + + <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> + + <fx:Declarations> + <mx:SeriesInterpolate id="interpolateIn" duration="1000"/> + </fx:Declarations> + + <mx:Panel title="CandlestickChart Control Example" + paddingBottom="10" paddingTop="10" paddingLeft="10" paddingRight="10" + height="100%" width="100%"> + + <mx:CandlestickChart id="candlestickchart" height="100%" width="100%" + paddingRight="5" paddingLeft="5" + showDataTips="true" dataProvider="{companyAAC}"> + + <mx:verticalAxis> + <mx:LinearAxis id="vaxis" baseAtZero="false" title="Price"/> + </mx:verticalAxis> + + <mx:horizontalAxis> + <mx:CategoryAxis id="haxis" categoryField="Date" title="Date"/> + </mx:horizontalAxis> + + <mx:horizontalAxisRenderers> + <mx:AxisRenderer axis="{haxis}" canDropLabels="true"/> + </mx:horizontalAxisRenderers> + + <mx:series> + <mx:CandlestickSeries + openField="Open" highField="High" + lowField="Low" closeField="Close" + showDataEffect="{interpolateIn}"/> + </mx:series> + </mx:CandlestickChart> + + <mx:Label width="100%" + text="Choose a company to view recent stock data."/> + + <mx:HBox> + <mx:RadioButton groupName="stocks" label="View Company A" + selected="true" click="candlestickchart.dataProvider=companyAAC"/> + <mx:RadioButton groupName="stocks" label="View Company B" + click="candlestickchart.dataProvider=companyBAC"/> + </mx:HBox> + </mx:Panel> +</mx:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/mx/charts/SeriesSlideExample.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/mx/charts/SeriesSlideExample.mxml b/tourdeflexmodules/src/mx/charts/SeriesSlideExample.mxml new file mode 100755 index 0000000..b94872c --- /dev/null +++ b/tourdeflexmodules/src/mx/charts/SeriesSlideExample.mxml @@ -0,0 +1,101 @@ +<?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 CandlestickChart control. --> +<mx:Module xmlns:fx="http://ns.adobe.com/mxml/2009"; xmlns:mx="library://ns.adobe.com/flex/mx" + paddingBottom="0" paddingTop="0" paddingLeft="0" paddingRight="0" + height="100%" width="100%"> + + <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> + + <fx:Declarations> + <mx:SeriesSlide id="slideIn" duration="1000" direction="up"/> + <mx:SeriesSlide id="slideOut" duration="1000" direction="down"/> + </fx:Declarations> + + <mx:Panel title="CandlestickChart Control Example" + paddingBottom="10" paddingTop="10" paddingLeft="10" paddingRight="10" + height="100%" width="100%"> + + <mx:CandlestickChart id="candlestickchart" height="100%" width="100%" + paddingRight="5" paddingLeft="5" + showDataTips="true" dataProvider="{companyAAC}"> + + <mx:verticalAxis> + <mx:LinearAxis id="vaxis" baseAtZero="false" title="Price"/> + </mx:verticalAxis> + + <mx:horizontalAxis> + <mx:CategoryAxis id="haxis" categoryField="Date" title="Date"/> + </mx:horizontalAxis> + + <mx:horizontalAxisRenderers> + <mx:AxisRenderer axis="{haxis}" canDropLabels="true"/> + </mx:horizontalAxisRenderers> + + <mx:series> + <mx:CandlestickSeries + openField="Open" highField="High" + lowField="Low" closeField="Close" + showDataEffect="{slideIn}" + hideDataEffect="{slideOut}"/> + </mx:series> + </mx:CandlestickChart> + + <mx:Label width="100%" + text="Choose a company to view recent stock data."/> + + <mx:HBox> + <mx:RadioButton groupName="stocks" label="View Company A" + selected="true" click="candlestickchart.dataProvider=companyAAC"/> + <mx:RadioButton groupName="stocks" label="View Company B" + click="candlestickchart.dataProvider=companyBAC"/> + </mx:HBox> + </mx:Panel> +</mx:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/mx/charts/SeriesZoomExample.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/mx/charts/SeriesZoomExample.mxml b/tourdeflexmodules/src/mx/charts/SeriesZoomExample.mxml new file mode 100755 index 0000000..c993970 --- /dev/null +++ b/tourdeflexmodules/src/mx/charts/SeriesZoomExample.mxml @@ -0,0 +1,101 @@ +<?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 CandlestickChart control. --> +<mx:Module xmlns:fx="http://ns.adobe.com/mxml/2009"; xmlns:mx="library://ns.adobe.com/flex/mx" + paddingBottom="0" paddingTop="0" paddingLeft="0" paddingRight="0" + height="100%" width="100%"> + + <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> + + <fx:Declarations> + <mx:SeriesZoom id="zoomIn" duration="1000"/> + <mx:SeriesZoom id="zoomOut" duration="1000"/> + </fx:Declarations> + + <mx:Panel title="CandlestickChart Control Example" + paddingBottom="10" paddingTop="10" paddingLeft="10" paddingRight="10" + height="100%" width="100%"> + + <mx:CandlestickChart id="candlestickchart" height="100%" width="100%" + paddingRight="5" paddingLeft="5" + showDataTips="true" dataProvider="{companyAAC}"> + + <mx:verticalAxis> + <mx:LinearAxis id="vaxis" baseAtZero="false" title="Price"/> + </mx:verticalAxis> + + <mx:horizontalAxis> + <mx:CategoryAxis id="haxis" categoryField="Date" title="Date"/> + </mx:horizontalAxis> + + <mx:horizontalAxisRenderers> + <mx:AxisRenderer axis="{haxis}" canDropLabels="true"/> + </mx:horizontalAxisRenderers> + + <mx:series> + <mx:CandlestickSeries + openField="Open" highField="High" + lowField="Low" closeField="Close" + showDataEffect="{zoomIn}" + hideDataEffect="{zoomOut}"/> + </mx:series> + </mx:CandlestickChart> + + <mx:Label width="100%" + text="Choose a company to view recent stock data."/> + + <mx:HBox> + <mx:RadioButton groupName="stocks" label="View Company A" + selected="true" click="candlestickchart.dataProvider=companyAAC"/> + <mx:RadioButton groupName="stocks" label="View Company B" + click="candlestickchart.dataProvider=companyBAC"/> + </mx:HBox> + </mx:Panel> +</mx:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/mx/containers/AccordionExample.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/mx/containers/AccordionExample.mxml b/tourdeflexmodules/src/mx/containers/AccordionExample.mxml new file mode 100755 index 0000000..edf480d --- /dev/null +++ b/tourdeflexmodules/src/mx/containers/AccordionExample.mxml @@ -0,0 +1,56 @@ +<?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 Accordion layout container. --> +<mx:Module xmlns:fx="http://ns.adobe.com/mxml/2009"; xmlns:mx="library://ns.adobe.com/flex/mx" + paddingBottom="0" paddingTop="0" paddingLeft="0" paddingRight="0" + height="100%" width="100%"> + + <mx:Panel title="Accordion Container Example" + paddingBottom="10" paddingTop="10" paddingLeft="10" paddingRight="10" + height="100%" width="100%"> + + <mx:Label width="100%" + text="Select an Accordion navigator button to change the panel."/> + + <mx:Accordion id="accordion" width="100%" height="100%"> + <!-- Define each panel using a VBox container. --> + <mx:VBox label="Accordion Button for Panel 1"> + <mx:Label text="Accordion container panel 1"/> + </mx:VBox> + + <mx:VBox label="Accordion Button for Panel 2"> + <mx:Label text="Accordion container panel 2"/> + </mx:VBox> + + <mx:VBox label="Accordion Button for Panel 3"> + <mx:Label text="Accordion container panel 3"/> + </mx:VBox> + </mx:Accordion> + + <mx:Label width="100%" + text="Programmatically select the panel using a Button control."/> + + <mx:HBox> + <mx:Button label="Select Panel 1" click="accordion.selectedIndex=0"/> + <mx:Button label="Select Panel 2" click="accordion.selectedIndex=1"/> + <mx:Button label="Select Panel 3" click="accordion.selectedIndex=2"/> + </mx:HBox> + + </mx:Panel> +</mx:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/mx/containers/DividedBoxExample.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/mx/containers/DividedBoxExample.mxml b/tourdeflexmodules/src/mx/containers/DividedBoxExample.mxml new file mode 100755 index 0000000..836c6f3 --- /dev/null +++ b/tourdeflexmodules/src/mx/containers/DividedBoxExample.mxml @@ -0,0 +1,42 @@ +<?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 DividedBox layout container. --> +<mx:Module xmlns:fx="http://ns.adobe.com/mxml/2009"; xmlns:mx="library://ns.adobe.com/flex/mx" + paddingBottom="0" paddingTop="0" paddingLeft="0" paddingRight="0" + height="100%" width="100%"> + + <mx:Panel title="DividedBox Container Example" + paddingBottom="10" paddingTop="10" paddingLeft="10" paddingRight="10" + height="100%" width="100%"> + + <mx:Text width="100%" + text="A horizontal DividedBox container. Drag the divider side to side to resize the children."/> + + <mx:DividedBox direction="horizontal" width="100%" height="100%"> + + <mx:Panel title="Panel 1" width="25%" height="100%" backgroundColor="0xCCCCCC"> + </mx:Panel> + + <mx:Panel title="Panel 2" width="25%" height="100%" backgroundColor="0xCCCCCC"> + </mx:Panel> + + </mx:DividedBox> + + </mx:Panel> +</mx:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/mx/containers/FormExample.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/mx/containers/FormExample.mxml b/tourdeflexmodules/src/mx/containers/FormExample.mxml new file mode 100755 index 0000000..471e7dc --- /dev/null +++ b/tourdeflexmodules/src/mx/containers/FormExample.mxml @@ -0,0 +1,88 @@ +<?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 Form layout container. --> +<mx:Module xmlns:fx="http://ns.adobe.com/mxml/2009"; xmlns:mx="library://ns.adobe.com/flex/mx" + paddingBottom="0" paddingTop="0" paddingLeft="0" paddingRight="0" + height="100%" width="100%"> + + <fx:Declarations> + <fx:Model id="checkModel"> + <User> + <FirstName>{fname.text}</FirstName> + <DOB>{dob.text}</DOB> + <Email>{email.text}</Email> + <Age>{age.text}</Age> + <SSN>{ssn.text}</SSN> + <Zip>{zip.text}</Zip> + <Phone>{phone.text}</Phone> + </User> + </fx:Model> + + <mx:StringValidator source="{fname}" property="text" minLength="4" maxLength="12"/> + <mx:PhoneNumberValidator source="{phone}" property="text"/> + <mx:DateValidator source="{dob}" property="text"/> + <mx:EmailValidator source="{email}" property="text"/> + <mx:NumberValidator source="{age}" property="text" integerError="Enter Integer value" + minValue="18" maxValue="100" domain="int"/> + <mx:SocialSecurityValidator source="{ssn}" property="text"/> + <mx:ZipCodeValidator source="{zip}" property="text"/> + </fx:Declarations> + + <mx:Panel title="Form Container Example" + paddingBottom="10" paddingTop="10" paddingLeft="10" paddingRight="10" + height="100%" width="100%"> + + <mx:Text width="100%" + text="Moving from one form field to another triggers the validator."/> + + <mx:Form width="100%" height="100%"> + <mx:FormHeading label="Enter values into the form."/> + + <mx:FormItem label="First name"> + <mx:TextInput id="fname" width="200"/> + </mx:FormItem> + + <mx:FormItem label="Date of birth (mm/dd/yyyy)"> + <mx:TextInput id="dob" width="200"/> + </mx:FormItem> + + <mx:FormItem label="E-mail address"> + <mx:TextInput id="email" width="200"/> + </mx:FormItem> + + <mx:FormItem label="Age"> + <mx:TextInput id="age" width="200"/> + </mx:FormItem> + + <mx:FormItem label="SSN"> + <mx:TextInput id="ssn" width="200"/> + </mx:FormItem> + + <mx:FormItem label="Zip"> + <mx:TextInput id="zip" width="200"/> + </mx:FormItem> + + <mx:FormItem label="Phone"> + <mx:TextInput id="phone" width="200"/> + </mx:FormItem> + </mx:Form> + + </mx:Panel> + +</mx:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/mx/containers/GridLayoutExample.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/mx/containers/GridLayoutExample.mxml b/tourdeflexmodules/src/mx/containers/GridLayoutExample.mxml new file mode 100755 index 0000000..2b293eb --- /dev/null +++ b/tourdeflexmodules/src/mx/containers/GridLayoutExample.mxml @@ -0,0 +1,70 @@ +<?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 Grid layout container.--> +<mx:Module xmlns:fx="http://ns.adobe.com/mxml/2009"; xmlns:mx="library://ns.adobe.com/flex/mx" + paddingBottom="0" paddingTop="0" paddingLeft="0" paddingRight="0" + height="100%" width="100%"> + + <mx:Panel title="Grid Container Example" + paddingBottom="10" paddingTop="10" paddingLeft="10" paddingRight="10" + height="100%" width="100%"> + + <mx:Label width="100%" + text="A 3 by 3 Grid container of Button controls."/> + + <mx:Grid> + <mx:GridRow> + <mx:GridItem> + <mx:Button label="Row 1 Col 1" width="100"/> + </mx:GridItem> + <mx:GridItem> + <mx:Button label="Row 1 Col 2" width="100"/> + </mx:GridItem> + <mx:GridItem> + <mx:Button label="Row 1 Col 3" width="100"/> + </mx:GridItem> + </mx:GridRow> + + <mx:GridRow> + <mx:GridItem> + <mx:Button label="Row 2 Col 1" width="100"/> + </mx:GridItem> + <mx:GridItem> + <mx:Button label="Row 2 Col 2" width="100"/> + </mx:GridItem> + <mx:GridItem> + <mx:Button label="Row 2 Col 3" width="100"/> + </mx:GridItem> + </mx:GridRow> + + <mx:GridRow> + <mx:GridItem> + <mx:Button label="Row 3 Col 1" width="100"/> + </mx:GridItem> + <mx:GridItem> + <mx:Button label="Row 3 Col 2" width="100"/> + </mx:GridItem> + <mx:GridItem> + <mx:Button label="Row 3 Col 3" width="100"/> + </mx:GridItem> + </mx:GridRow> + </mx:Grid> + + </mx:Panel> +</mx:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/mx/containers/HBoxExample.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/mx/containers/HBoxExample.mxml b/tourdeflexmodules/src/mx/containers/HBoxExample.mxml new file mode 100755 index 0000000..44db7cc --- /dev/null +++ b/tourdeflexmodules/src/mx/containers/HBoxExample.mxml @@ -0,0 +1,42 @@ +<?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 HBox layout container. --> +<mx:Module xmlns:fx="http://ns.adobe.com/mxml/2009"; xmlns:mx="library://ns.adobe.com/flex/mx" + paddingBottom="0" paddingTop="0" paddingLeft="0" paddingRight="0" + height="100%" width="100%"> + + <mx:Panel title="HBox Container Example" + paddingBottom="10" paddingTop="10" paddingLeft="10" paddingRight="10" + height="100%" width="100%"> + + <mx:Label width="100%" + text="An HBox container with horizontally aligned children."/> + + <mx:HBox borderStyle="solid" paddingTop="10" paddingBottom="10" + paddingLeft="10" paddingRight="10"> + + <mx:Button label="Button 1"/> + <mx:Button label="Button 2"/> + <mx:Button label="Button 3"/> + <mx:ComboBox/> + + </mx:HBox> + + </mx:Panel> +</mx:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/mx/containers/HDividedBoxExample.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/mx/containers/HDividedBoxExample.mxml b/tourdeflexmodules/src/mx/containers/HDividedBoxExample.mxml new file mode 100755 index 0000000..d5a2e75 --- /dev/null +++ b/tourdeflexmodules/src/mx/containers/HDividedBoxExample.mxml @@ -0,0 +1,44 @@ +<?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 HDividedBox layout --> +<mx:Module xmlns:fx="http://ns.adobe.com/mxml/2009"; xmlns:mx="library://ns.adobe.com/flex/mx" + paddingBottom="0" paddingTop="0" paddingLeft="0" paddingRight="0" + height="100%" width="100%"> + + <mx:Panel title="HDividedBox Container Example" + paddingBottom="10" paddingTop="10" paddingLeft="10" paddingRight="10" + height="100%" width="100%"> + + <mx:Text width="100%" + text="Drag the divider side to side to resize the children."/> + + <mx:HDividedBox width="100%" height="100%"> + + <mx:Canvas label="Canvas 1" width="100%" height="100%" backgroundColor="#FFFFCC"> + <mx:Label text="Add components here" fontWeight="bold"/> + </mx:Canvas> + + <mx:Canvas label="Canvas 2" width="100%" height="100%" backgroundColor="#99CCFF"> + <mx:Label text="Add components here" fontWeight="bold"/> + </mx:Canvas> + + </mx:HDividedBox> + + </mx:Panel> +</mx:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/mx/containers/SimpleApplicationControlBarExample.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/mx/containers/SimpleApplicationControlBarExample.mxml b/tourdeflexmodules/src/mx/containers/SimpleApplicationControlBarExample.mxml new file mode 100755 index 0000000..b04e80a --- /dev/null +++ b/tourdeflexmodules/src/mx/containers/SimpleApplicationControlBarExample.mxml @@ -0,0 +1,58 @@ +<?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 ApplicationControlBar container. --> +<mx:Application xmlns:fx="http://ns.adobe.com/mxml/2009"; xmlns:mx="library://ns.adobe.com/flex/mx" + borderStyle="solid" + paddingBottom="0" paddingTop="0" paddingLeft="0" paddingRight="0" + height="100%" width="100%"> + + <mx:ApplicationControlBar dock="true" paddingTop="0" paddingBottom="0"> + <mx:Label text="Docked"/> + + <mx:MenuBar id="myMenuBar" labelField="@label"> + <fx:XMLList> + <menuitem label="MenuItem A" > + <menuitem label="SubMenuItem A-1" type="check"/> + <menuitem label="SubMenuItem A-2" type="check"/> + </menuitem> + <menuitem label="MenuItem B"/> + <menuitem label="MenuItem C"/> + <menuitem label="MenuItem D" > + <menuitem label="SubMenuItem D-1" type="radio" groupName="one"/> + <menuitem label="SubMenuItem D-2" type="radio" groupName="one"/> + <menuitem label="SubMenuItem D-3" type="radio" groupName="one"/> + </menuitem> + </fx:XMLList> + </mx:MenuBar> + </mx:ApplicationControlBar> + + <mx:Label text="A docked ApplicationControlBar appears at the top of the application window."/> + <mx:Spacer height="100%" /> + + <mx:ApplicationControlBar width="80%"> + <mx:Label text="Normal"/> + <mx:Label text="Search:" /> + <mx:TextInput width="100%" maxWidth="200" /> + <mx:Spacer width="100%" /> + <mx:Button label="Go flex.apache.org" /> + </mx:ApplicationControlBar> + + <mx:Label text="A normal ApplicationControlBar can appear anywhere in the application."/> + +</mx:Application> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/mx/containers/SimpleBoxExample.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/mx/containers/SimpleBoxExample.mxml b/tourdeflexmodules/src/mx/containers/SimpleBoxExample.mxml new file mode 100755 index 0000000..b45c8b4 --- /dev/null +++ b/tourdeflexmodules/src/mx/containers/SimpleBoxExample.mxml @@ -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 Box layout container. --> +<mx:Module xmlns:fx="http://ns.adobe.com/mxml/2009"; xmlns:mx="library://ns.adobe.com/flex/mx" + paddingBottom="0" paddingTop="0" paddingLeft="0" paddingRight="0" + height="100%" width="100%"> + + <mx:Panel title="Box Container Example" + paddingBottom="10" paddingTop="10" paddingLeft="10" paddingRight="10" + height="100%" width="100%"> + + <mx:Label width="100%" + text="A Box container with vertically aligned children."/> + <mx:Box direction="vertical" borderStyle="solid" + paddingTop="10" paddingBottom="10" paddingLeft="10" paddingRight="10"> + <mx:Button label="Button 1"/> + <mx:Button label="Button 2"/> + <mx:Button label="Button 3"/> + <mx:ComboBox/> + </mx:Box> + + <mx:Label width="100%" + text="A Box container with horizontally aligned children."/> + <mx:Box direction="horizontal" borderStyle="solid" + paddingTop="10" paddingBottom="10" paddingLeft="10" paddingRight="10"> + <mx:Button label="Button 1"/> + <mx:Button label="Button 2"/> + <mx:Button label="Button 3"/> + <mx:ComboBox/> + </mx:Box> + + </mx:Panel> +</mx:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/mx/containers/SimpleCanvasExample.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/mx/containers/SimpleCanvasExample.mxml b/tourdeflexmodules/src/mx/containers/SimpleCanvasExample.mxml new file mode 100755 index 0000000..a2bef7a --- /dev/null +++ b/tourdeflexmodules/src/mx/containers/SimpleCanvasExample.mxml @@ -0,0 +1,48 @@ +<?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 Canvas layout container.--> +<mx:Module xmlns:fx="http://ns.adobe.com/mxml/2009"; xmlns:mx="library://ns.adobe.com/flex/mx" + paddingBottom="0" paddingTop="0" paddingLeft="0" paddingRight="0" + height="100%" width="100%"> + + <mx:Panel title="Canvas Container Example" + paddingBottom="10" paddingTop="10" paddingLeft="10" paddingRight="10" + height="100%" width="100%"> + + <mx:Label width="100%" + text="Use absolute positioning to place the children of a Canvas container."/> + + <mx:Canvas borderStyle="solid" height="200" width="100%"> + + <!-- Stagger the position of the TextInput controls using absolute positioning.--> + <mx:TextInput width="100" x="50" y="5"/> + <mx:TextInput width="100" x="100" y="30"/> + <mx:TextInput width="100" x="150" y="55"/> + + <!-- Overlap the VBox containers using layout constraints.--> + <mx:VBox right="115" bottom="50" width="75" height="75" backgroundColor="#0080C0"/> + <mx:VBox right="70" bottom="30" width="75" height="75" backgroundColor="#FFFF80"/> + <mx:VBox right="25" bottom="10" width="75" height="75" backgroundColor="#8080C0" alpha="0.8"/> + + <mx:Text right="25" y="110" + text="The Canvas container lets you place components on top of each other."/> + </mx:Canvas> + + </mx:Panel> +</mx:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/mx/containers/SimpleControlBarExample.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/mx/containers/SimpleControlBarExample.mxml b/tourdeflexmodules/src/mx/containers/SimpleControlBarExample.mxml new file mode 100755 index 0000000..8498ff4 --- /dev/null +++ b/tourdeflexmodules/src/mx/containers/SimpleControlBarExample.mxml @@ -0,0 +1,44 @@ +<?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 ControlBar container. --> +<mx:Module xmlns:fx="http://ns.adobe.com/mxml/2009"; xmlns:mx="library://ns.adobe.com/flex/mx" + paddingBottom="0" paddingTop="0" paddingLeft="0" paddingRight="0" + height="100%" width="100%"> + + <mx:Panel title="ControlBar Container Example" + paddingBottom="10" paddingTop="10" paddingLeft="10" paddingRight="10" + height="100%" width="100%"> + + <mx:HBox width="100%" height="100%"> + <!-- Area for your catalog. --> + <mx:Image source="@Embed(source='assets/ApacheFlexLogo.png')" width="50%" height="100%"/> + <mx:Text width="50%" + text="The ControlBar container in this example adds a Label, NumericStepper, Spacer, and Button control to the bottom of the Panel container."/> + </mx:HBox> + + <mx:ControlBar> + <mx:Label text="Quantity"/> + <mx:NumericStepper/> + <!-- Use Spacer to push Button control to the right. --> + <mx:Spacer width="100%"/> + <mx:Button label="Add to Cart"/> + </mx:ControlBar> + + </mx:Panel> +</mx:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/mx/containers/SimplePanelExample.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/mx/containers/SimplePanelExample.mxml b/tourdeflexmodules/src/mx/containers/SimplePanelExample.mxml new file mode 100755 index 0000000..75aa93f --- /dev/null +++ b/tourdeflexmodules/src/mx/containers/SimplePanelExample.mxml @@ -0,0 +1,47 @@ +<?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 Panel layout container. --> +<mx:Module xmlns:fx="http://ns.adobe.com/mxml/2009"; xmlns:mx="library://ns.adobe.com/flex/mx" + paddingBottom="0" paddingTop="0" paddingLeft="0" paddingRight="0" + height="100%" width="100%"> + + <fx:Script> + <![CDATA[ + + private function showProperties():void { + panelPropertyArea.text= "Status: " + panel.status + '\n' + + "Title: " + panel.title + '\n' + + "Width: " + panel.width + '\n' + + "Height: " + panel.height ; + } + ]]> + </fx:Script> + + <mx:Panel id="panel" title="Panel Container Example" status="Active" + paddingBottom="10" paddingTop="10" paddingLeft="10" paddingRight="10" + height="100%" width="100%"> + + <mx:Label width="100%" + text="Click the Button control to see panel properties."/> + + <mx:TextArea id="panelPropertyArea" width="100%" height="100%"/> + <mx:Button label="Click to view Panel properties" click="showProperties()"/> + + </mx:Panel> +</mx:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/mx/containers/SimpleTitleWindowExample.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/mx/containers/SimpleTitleWindowExample.mxml b/tourdeflexmodules/src/mx/containers/SimpleTitleWindowExample.mxml new file mode 100755 index 0000000..2616d8f --- /dev/null +++ b/tourdeflexmodules/src/mx/containers/SimpleTitleWindowExample.mxml @@ -0,0 +1,52 @@ +<?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 custom MXML TitleWindow component. + The TitleWindowApp application displays this component. + You cannot run it independently. --> + +<mx:TitleWindow xmlns:fx="http://ns.adobe.com/mxml/2009"; xmlns:mx="library://ns.adobe.com/flex/mx" + title="Title Window" x="168" y="86"> + + <fx:Script> + <![CDATA[ + import mx.managers.PopUpManager; + import mx.controls.Text; + + // A reference to the TextInput control in which to put the result. + public var loginName:Text; + + // Event handler for the OK button. + private function returnName():void { + loginName.text="Name entered: " + userName.text; + PopUpManager.removePopUp(this); + } + ]]> + </fx:Script> + + <mx:HBox> + <mx:Label text="Enter Name: "/> + <mx:TextInput id="userName" width="100%"/> + </mx:HBox> + + <mx:HBox> + <mx:Button label="OK" click="returnName()"/> + <mx:Button label="Cancel" click="PopUpManager.removePopUp(this)"/> + </mx:HBox> + +</mx:TitleWindow> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/mx/containers/TabNavigatorExample.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/mx/containers/TabNavigatorExample.mxml b/tourdeflexmodules/src/mx/containers/TabNavigatorExample.mxml new file mode 100755 index 0000000..55fad20 --- /dev/null +++ b/tourdeflexmodules/src/mx/containers/TabNavigatorExample.mxml @@ -0,0 +1,57 @@ +<?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 TabNavigator layout container. --> +<mx:Module xmlns:fx="http://ns.adobe.com/mxml/2009"; xmlns:mx="library://ns.adobe.com/flex/mx" + paddingBottom="0" paddingTop="0" paddingLeft="0" paddingRight="0" + height="100%" width="100%"> + + <mx:Panel title="TabNavigator Container Example" + paddingBottom="10" paddingTop="10" paddingLeft="10" paddingRight="10" + height="100%" width="100%"> + + <mx:Label width="100%" + text="Select the tabs to change the panel."/> + + <mx:TabNavigator id="tn" width="100%" height="100%"> + <!-- Define each panel using a VBox container. --> + + <mx:VBox label="Panel 1"> + <mx:Label text="TabNavigator container panel 1"/> + </mx:VBox> + + <mx:VBox label="Panel 2"> + <mx:Label text="TabNavigator container panel 2"/> + </mx:VBox> + + <mx:VBox label="Panel 3"> + <mx:Label text="TabNavigator container panel 3"/> + </mx:VBox> + </mx:TabNavigator> + + <mx:Label width="100%" + text="Programmatically select the panel using a Button control."/> + + <mx:HBox> + <mx:Button label="Select Tab 1" click="tn.selectedIndex=0"/> + <mx:Button label="Select Tab 2" click="tn.selectedIndex=1"/> + <mx:Button label="Select Tab 3" click="tn.selectedIndex=2"/> + </mx:HBox> + + </mx:Panel> +</mx:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/mx/containers/TileLayoutExample.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/mx/containers/TileLayoutExample.mxml b/tourdeflexmodules/src/mx/containers/TileLayoutExample.mxml new file mode 100755 index 0000000..5cc8179 --- /dev/null +++ b/tourdeflexmodules/src/mx/containers/TileLayoutExample.mxml @@ -0,0 +1,45 @@ +<?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 Tile layout container. --> +<mx:Module xmlns:fx="http://ns.adobe.com/mxml/2009"; xmlns:mx="library://ns.adobe.com/flex/mx" + paddingBottom="0" paddingTop="0" paddingLeft="0" paddingRight="0" + height="100%" width="100%"> + + <mx:Panel title="Tile Container Example" + paddingBottom="10" paddingTop="10" paddingLeft="10" paddingRight="10" + height="100%" width="100%"> + + <mx:Label width="100%" + text="A Tile container lays out its children in a grid of equal-sized cells."/> + + <mx:Tile direction="horizontal" borderStyle="inset" + horizontalGap="10" verticalGap="15" + paddingTop="10" paddingBottom="10" paddingLeft="10" paddingRight="10"> + + <mx:Button label="1" height="50" width="75"/> + <mx:Button label="2" height="50" width="75"/> + <mx:Button label="3" height="50" width="75"/> + <mx:Button label="4" height="50" width="75"/> + <mx:Button label="5" height="50" width="75"/> + <mx:Button label="6" height="50" width="75"/> + + </mx:Tile> + + </mx:Panel> +</mx:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/mx/containers/TitleWindowApp.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/mx/containers/TitleWindowApp.mxml b/tourdeflexmodules/src/mx/containers/TitleWindowApp.mxml new file mode 100755 index 0000000..430d613 --- /dev/null +++ b/tourdeflexmodules/src/mx/containers/TitleWindowApp.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. + --> + +<!-- Main application to demonstrate TitleWindow layout container. --> +<mx:Module xmlns:fx="http://ns.adobe.com/mxml/2009"; xmlns:mx="library://ns.adobe.com/flex/mx" + paddingBottom="0" paddingTop="0" paddingLeft="0" paddingRight="0" + height="100%" width="100%"> + + <fx:Script> + <![CDATA[ + + import mx.managers.PopUpManager; + import mx.containers.TitleWindow; + import flash.geom.Point; + + private var point1:Point = new Point(); + + // Open the TitleWindow container. + // Cast the return value of the createPopUp() method + // to SimpleTitleWindowExample, the name of the + // component containing the TitleWindow container. + private function showWindow():void { + var login:SimpleTitleWindowExample=SimpleTitleWindowExample(PopUpManager.createPopUp( this, SimpleTitleWindowExample , true)); + + // Calculate position of TitleWindow in Application's coordinates. + // Position it 25 pixels down and to the right of the Button control. + point1.x=0; + point1.y=0; + point1=myButton.localToGlobal(point1); + login.x=point1.x+25; + login.y=point1.y+25; + + // Pass a reference to the TextInput control + // to the TitleWindow container so that the + // TitleWindow container can return data to the main application. + login.loginName=returnedName; + } + ]]> + </fx:Script> + + <mx:Panel title="TitleWindow Container Example" + paddingBottom="10" paddingTop="10" paddingLeft="10" paddingRight="10" + height="100%" width="100%"> + + <mx:Button id="myButton" label="Click to open the TitleWindow container" + click="showWindow()"/> + + <mx:Text id="returnedName" text="" width="100%"/> + + </mx:Panel> +</mx:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/mx/containers/VBoxExample.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/mx/containers/VBoxExample.mxml b/tourdeflexmodules/src/mx/containers/VBoxExample.mxml new file mode 100755 index 0000000..99adac2 --- /dev/null +++ b/tourdeflexmodules/src/mx/containers/VBoxExample.mxml @@ -0,0 +1,42 @@ +<?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 VBox layout container. --> +<mx:Module xmlns:fx="http://ns.adobe.com/mxml/2009"; xmlns:mx="library://ns.adobe.com/flex/mx" + paddingBottom="0" paddingTop="0" paddingLeft="0" paddingRight="0" + height="100%" width="100%"> + + <mx:Panel title="VBox Container Example" + paddingBottom="10" paddingTop="10" paddingLeft="10" paddingRight="10" + height="100%" width="100%"> + + <mx:Label width="100%" + text="A VBox container with vertically aligned children."/> + + <mx:VBox borderStyle="solid" paddingTop="10" paddingBottom="10" + paddingLeft="10" paddingRight="10"> + + <mx:Button label="Button 1"/> + <mx:Button label="Button 2"/> + <mx:Button label="Button 3"/> + <mx:ComboBox/> + + </mx:VBox> + + </mx:Panel> +</mx:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/mx/containers/VDividedBoxExample.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/mx/containers/VDividedBoxExample.mxml b/tourdeflexmodules/src/mx/containers/VDividedBoxExample.mxml new file mode 100755 index 0000000..2c08bf4 --- /dev/null +++ b/tourdeflexmodules/src/mx/containers/VDividedBoxExample.mxml @@ -0,0 +1,44 @@ +<?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 VDividedBox layout --> +<mx:Module xmlns:fx="http://ns.adobe.com/mxml/2009"; xmlns:mx="library://ns.adobe.com/flex/mx" + paddingBottom="0" paddingTop="0" paddingLeft="0" paddingRight="0" + height="100%" width="100%"> + + <mx:Panel title="VDividedBox Container Example" + paddingBottom="10" paddingTop="10" paddingLeft="10" paddingRight="10" + height="100%" width="100%"> + + <mx:Text width="100%" + text="Drag the divider up and down to resize the children."/> + + <mx:VDividedBox width="100%" height="100%"> + + <mx:Canvas label="Canvas 1" width="100%" height="100%" backgroundColor="#FFFFCC"> + <mx:Label text="Add components here" fontWeight="bold"/> + </mx:Canvas> + + <mx:Canvas label="Canvas 2" width="100%" height="100%" backgroundColor="#99CCFF"> + <mx:Label text="Add components here" fontWeight="bold"/> + </mx:Canvas> + + </mx:VDividedBox> + + </mx:Panel> +</mx:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/mx/containers/ViewStackExample.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/mx/containers/ViewStackExample.mxml b/tourdeflexmodules/src/mx/containers/ViewStackExample.mxml new file mode 100755 index 0000000..3f2a063 --- /dev/null +++ b/tourdeflexmodules/src/mx/containers/ViewStackExample.mxml @@ -0,0 +1,60 @@ +<?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 ViewStack layout container. --> +<mx:Module xmlns:fx="http://ns.adobe.com/mxml/2009"; xmlns:mx="library://ns.adobe.com/flex/mx" + paddingBottom="0" paddingTop="0" paddingLeft="0" paddingRight="0" + height="100%" width="100%"> + + <mx:Panel title="ViewStack Container Example" + paddingBottom="10" paddingTop="10" paddingLeft="10" paddingRight="10" + height="100%" width="100%"> + + <mx:Text width="100%" + text="Use the Button controls to change panels of the ViewStack container."/> + + <mx:HBox borderStyle="solid" width="100%" + paddingTop="5" paddingLeft="5" paddingRight="5" paddingBottom="5"> + + <mx:Button id="searchButton" label="Search Panel" + click="myViewStack.selectedChild=search"/> + <mx:Button id="cInfoButton" label="Customer Info Panel" + click="myViewStack.selectedChild=custInfo"/> + <mx:Button id="aInfoButton" label="Account Panel" + click="myViewStack.selectedChild=accountInfo"/> + </mx:HBox> + + <!-- Define the ViewStack and the three child containers and have it + resize up to the size of the container for the buttons. --> + <mx:ViewStack id="myViewStack" borderStyle="solid" width="100%" height="80%"> + + <mx:Canvas id="search" backgroundColor="#FFFFCC" label="Search" width="100%" height="100%"> + <mx:Label text="Search Screen" color="#000000"/> + </mx:Canvas> + + <mx:Canvas id="custInfo" backgroundColor="#CCFFFF" label="Customer Info" width="100%" height="100%"> + <mx:Label text="Customer Info" color="#000000"/> + </mx:Canvas> + + <mx:Canvas id="accountInfo" backgroundColor="#FFCCFF" label="Account Info" width="100%" height="100%"> + <mx:Label text="Account Info" color="#000000"/> + </mx:Canvas> + </mx:ViewStack> + + </mx:Panel> +</mx:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/mx/containers/assets/ApacheFlexLogo.png ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/mx/containers/assets/ApacheFlexLogo.png b/tourdeflexmodules/src/mx/containers/assets/ApacheFlexLogo.png new file mode 100644 index 0000000..4ff037f Binary files /dev/null and b/tourdeflexmodules/src/mx/containers/assets/ApacheFlexLogo.png differ
