http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/spark/effects/Rotate3DExample.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/spark/effects/Rotate3DExample.mxml b/tourdeflexmodules/src/spark/effects/Rotate3DExample.mxml new file mode 100644 index 0000000..46c6e72 --- /dev/null +++ b/tourdeflexmodules/src/spark/effects/Rotate3DExample.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. + +--> +<s:Module + 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:Declarations> + <s:Rotate3D id="rotateEffect" target="{targetImg}" + angleXFrom="0.0" angleXTo="{Number(xVal.text)}" + angleYFrom="0.0" angleYTo="{Number(yVal.text)}" + angleZFrom="0.0" angleZTo="{Number(zVal.text)}" + duration="{duration.value}" + repeatCount="{repeatCnt.value}" repeatBehavior="{chkReverse.selected?'reverse':'loop'}" + effectStart="this.targetImg.alpha=.8" effectEnd="this.targetImg.alpha=1.0"/> + </fx:Declarations> + + <s:Panel title="Rotate3D Effect Sample" width="100%" height="100%"> + + <s:layout> + <s:HorizontalLayout paddingLeft="10" paddingRight="10" paddingTop="10" paddingBottom="10" /> + </s:layout> + + <s:VGroup> + <s:HGroup verticalAlign="middle"> + <s:Label text="Rotate X To" verticalAlign="bottom"/> + <s:TextInput id="xVal" text="0.0" widthInChars="3"/> + </s:HGroup> + <s:HGroup verticalAlign="middle"> + <s:Label text="Rotate Y By" verticalAlign="bottom"/> + <s:TextInput id="yVal" text="360.0" widthInChars="3"/> + </s:HGroup> + <s:HGroup verticalAlign="middle"> + <s:Label text="Rotate Z To" verticalAlign="bottom"/> + <s:TextInput id="zVal" text="0.0" widthInChars="3"/> + </s:HGroup> + <s:HGroup verticalAlign="middle"> + <s:Label text="Repeat Num" verticalAlign="bottom"/> + <s:NumericStepper id="repeatCnt" value="2" width="35" minimum="1"/> + </s:HGroup> + <s:HGroup verticalAlign="middle"> + <s:Label text="Duration" verticalAlign="bottom"/> + <s:NumericStepper id="duration" width="58" + minimum="100" maximum="9999" + value="1000" + snapInterval="100" /> + </s:HGroup> + <s:CheckBox id="chkReverse" label="Repeat in Reverse?" selected="true"/> + <s:Button id="playButton" + label="Rotate Image" click="rotateEffect.play()"/> + </s:VGroup> + + <s:BitmapImage id="targetImg" width="200" height="200" source="@Embed(source='assets/ApacheFlexLogo.png')"/> + + <s:Label width="200" verticalAlign="justify" + text="The Rotate3D class rotates a target object in three dimensions around the x, y, or z +axes. The rotation occurs around the transform center of the target." textAlign="left"/> + </s:Panel> +</s:Module>
http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/spark/effects/Scale3DExample.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/spark/effects/Scale3DExample.mxml b/tourdeflexmodules/src/spark/effects/Scale3DExample.mxml new file mode 100644 index 0000000..9f4b3e3 --- /dev/null +++ b/tourdeflexmodules/src/spark/effects/Scale3DExample.mxml @@ -0,0 +1,79 @@ +<?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. + +--> +<s:Module + 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:Declarations> + <s:Scale3D id="scaleEffect" target="{targetImg}" + scaleXFrom="1.0" scaleXTo="{Number(xVal.text)}" + scaleYFrom="1.0" scaleYTo="{Number(yVal.text)}" + scaleZFrom="1.0" scaleZTo="{Number(zVal.text)}" + duration="{duration.value}" + repeatCount="{repeatCnt.value}" repeatBehavior="{chkReverse.selected?'reverse':'loop'}" + effectStart="this.targetImg.alpha=.7" effectEnd="this.targetImg.alpha=1.0"/> + </fx:Declarations> + + <s:Panel title="Scale3D Effect Sample" width="100%" height="100%"> + + <s:layout> + <s:HorizontalLayout paddingLeft="10" paddingRight="10" paddingTop="10" paddingBottom="10" /> + </s:layout> + + <s:VGroup> + <s:HGroup verticalAlign="middle"> + <s:Label text="Scale X To" verticalAlign="bottom"/> + <s:TextInput id="xVal" text="0.5" widthInChars="3"/> + </s:HGroup> + <s:HGroup verticalAlign="middle"> + <s:Label text="Scale Y To" verticalAlign="bottom"/> + <s:TextInput id="yVal" text="0.5" widthInChars="3"/> + </s:HGroup> + <s:HGroup verticalAlign="middle"> + <s:Label text="Scale Z To" verticalAlign="bottom"/> + <s:TextInput id="zVal" text="1.0" widthInChars="3"/> + </s:HGroup> + <s:HGroup verticalAlign="middle"> + <s:Label text="Repeat Num" verticalAlign="bottom"/> + <s:NumericStepper id="repeatCnt" width="35" + value="2" minimum="1"/> + </s:HGroup> + <s:HGroup verticalAlign="middle"> + <s:Label text="Duration" verticalAlign="bottom"/> + <s:NumericStepper id="duration" width="58" + minimum="100" maximum="9999" + value="1000" + snapInterval="100" /> + </s:HGroup> + <s:CheckBox id="chkReverse" label="Repeat in Reverse?" selected="true"/> + <s:Button id="playButton" + label="Scale Image" click="scaleEffect.play()"/> + </s:VGroup> + + <s:BitmapImage id="targetImg" width="50%" height="50%" source="@Embed(source='assets/ApacheFlexLogo.png')"/> + + <s:Label width="200" verticalAlign="justify" + text="The Scale3D class scales a target object in three dimensions around the transform center. A scale of +2.0 means the object has been magnified by a factor of 2, and a scale of 0.5 means the object has been +reduced by a factor of 2. A scale value of 0.0 is invalid."/> + + </s:Panel> +</s:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/spark/effects/WipeExample.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/spark/effects/WipeExample.mxml b/tourdeflexmodules/src/spark/effects/WipeExample.mxml new file mode 100644 index 0000000..c6eb544 --- /dev/null +++ b/tourdeflexmodules/src/spark/effects/WipeExample.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:Module + xmlns:fx="http://ns.adobe.com/mxml/2009"; + xmlns:mx="library://ns.adobe.com/flex/mx" + xmlns:s="library://ns.adobe.com/flex/spark"> + + <s:states> + <s:State name="default"/> + <s:State name="flipped"/> + </s:states> + + <s:transitions> + <s:Transition id="t1"> + <s:Wipe id="wipe" + direction="right" + target="{holder}" + duration="1000" /> + </s:Transition> + </s:transitions> + + <s:Panel title="Wipe Effect Example" + width="100%" height="100%"> + + <s:HGroup horizontalCenter="0" top="15" > + <s:VGroup width="100%" height="100%"> + <s:Group id="holder"> + <s:BitmapImage + source="@Embed('assets/back.png')" + visible="true" visible.flipped="false"/> + <s:BitmapImage width="200" height="200" + source="@Embed('assets/ApacheFlexLogo.png')" + visible="false" visible.flipped="true"/> + + </s:Group> + <s:Button + label="Wipe Right" + click="currentState = (currentState == 'flipped') ? 'default' : 'flipped'" /> + </s:VGroup> + + + <!-- Directions --> + <s:VGroup id="detailsBox" + width="400" + left="0"> + <s:Label + width="400" + color="#323232" + text="The Wipe effect wipes from bitmapFrom to the bitmapTo image in the given direction. Click the 'Wipe Right' button to see the effect."/> + </s:VGroup> + </s:HGroup> + + </s:Panel> + +</s:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/spark/effects/assets/ApacheFlexIcon.png ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/spark/effects/assets/ApacheFlexIcon.png b/tourdeflexmodules/src/spark/effects/assets/ApacheFlexIcon.png new file mode 100644 index 0000000..e68d831 Binary files /dev/null and b/tourdeflexmodules/src/spark/effects/assets/ApacheFlexIcon.png differ http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/spark/effects/assets/ApacheFlexLogo.png ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/spark/effects/assets/ApacheFlexLogo.png b/tourdeflexmodules/src/spark/effects/assets/ApacheFlexLogo.png new file mode 100644 index 0000000..4ff037f Binary files /dev/null and b/tourdeflexmodules/src/spark/effects/assets/ApacheFlexLogo.png differ http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/spark/effects/assets/back.png ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/spark/effects/assets/back.png b/tourdeflexmodules/src/spark/effects/assets/back.png new file mode 100644 index 0000000..19367fb Binary files /dev/null and b/tourdeflexmodules/src/spark/effects/assets/back.png differ http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/spark/effects/assets/images/2.jpg ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/spark/effects/assets/images/2.jpg b/tourdeflexmodules/src/spark/effects/assets/images/2.jpg new file mode 100644 index 0000000..2533129 Binary files /dev/null and b/tourdeflexmodules/src/spark/effects/assets/images/2.jpg differ http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/spark/effects/assets/images/3.jpg ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/spark/effects/assets/images/3.jpg b/tourdeflexmodules/src/spark/effects/assets/images/3.jpg new file mode 100644 index 0000000..b98cd8a Binary files /dev/null and b/tourdeflexmodules/src/spark/effects/assets/images/3.jpg differ http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/spark/effects/assets/images/4.jpg ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/spark/effects/assets/images/4.jpg b/tourdeflexmodules/src/spark/effects/assets/images/4.jpg new file mode 100644 index 0000000..657c12b Binary files /dev/null and b/tourdeflexmodules/src/spark/effects/assets/images/4.jpg differ http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/spark/effects/assets/images/5.jpg ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/spark/effects/assets/images/5.jpg b/tourdeflexmodules/src/spark/effects/assets/images/5.jpg new file mode 100644 index 0000000..e296f9c Binary files /dev/null and b/tourdeflexmodules/src/spark/effects/assets/images/5.jpg differ http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/spark/effects/assets/images/6.jpg ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/spark/effects/assets/images/6.jpg b/tourdeflexmodules/src/spark/effects/assets/images/6.jpg new file mode 100644 index 0000000..5ebc534 Binary files /dev/null and b/tourdeflexmodules/src/spark/effects/assets/images/6.jpg differ http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/spark/effects/assets/images/7.jpg ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/spark/effects/assets/images/7.jpg b/tourdeflexmodules/src/spark/effects/assets/images/7.jpg new file mode 100644 index 0000000..3047de0 Binary files /dev/null and b/tourdeflexmodules/src/spark/effects/assets/images/7.jpg differ http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/spark/effects/assets/images/8.jpg ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/spark/effects/assets/images/8.jpg b/tourdeflexmodules/src/spark/effects/assets/images/8.jpg new file mode 100644 index 0000000..4e3f9ca Binary files /dev/null and b/tourdeflexmodules/src/spark/effects/assets/images/8.jpg differ http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/spark/effects/assets/images/9.jpg ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/spark/effects/assets/images/9.jpg b/tourdeflexmodules/src/spark/effects/assets/images/9.jpg new file mode 100644 index 0000000..ed4e5fe Binary files /dev/null and b/tourdeflexmodules/src/spark/effects/assets/images/9.jpg differ http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/spark/events/EventExample1.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/spark/events/EventExample1.mxml b/tourdeflexmodules/src/spark/events/EventExample1.mxml new file mode 100644 index 0000000..50c3ca7 --- /dev/null +++ b/tourdeflexmodules/src/spark/events/EventExample1.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. + +--> +<s: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"> + + <fx:Script> + <![CDATA[ + import mx.controls.Alert; + ]]> + </fx:Script> + + <s:Panel title="Handling Events - Inline property Sample" + width="100%" height="100%"> + + <s:layout> + <s:VerticalLayout horizontalAlign="center" + paddingLeft="10" paddingRight="10" + paddingTop="10" paddingBottom="10"/> + </s:layout> + + <!-- Handling Events - Inline Property --> + + <s:Button label="click me" click="Alert.show('clicked!')"/> + + </s:Panel> + +</s:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/spark/events/EventExample2.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/spark/events/EventExample2.mxml b/tourdeflexmodules/src/spark/events/EventExample2.mxml new file mode 100644 index 0000000..5205adc --- /dev/null +++ b/tourdeflexmodules/src/spark/events/EventExample2.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: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"> + + <fx:Script> + <![CDATA[ + import mx.controls.Alert; + ]]> + </fx:Script> + + <s:Panel title="Handling Events - Inline Block Sample" + width="100%" height="100%"> + + <s:layout> + <s:VerticalLayout horizontalAlign="center" + paddingLeft="10" paddingRight="10" + paddingTop="10" paddingBottom="10"/> + </s:layout> + + <!-- Handling Events - Inline Block --> + + <s:Button id="b" label="click me once"> + <s:click> + b.enabled = false; + mx.controls.Alert.show('clicked!'); + </s:click> + </s:Button> + </s:Panel> + +</s:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/spark/events/EventExample3.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/spark/events/EventExample3.mxml b/tourdeflexmodules/src/spark/events/EventExample3.mxml new file mode 100644 index 0000000..d6663e1 --- /dev/null +++ b/tourdeflexmodules/src/spark/events/EventExample3.mxml @@ -0,0 +1,50 @@ +<?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: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"> + + <fx:Script> + <![CDATA[ + import mx.controls.Alert; + + private function handleClick(event:MouseEvent):void + { + b.enabled = false; + mx.controls.Alert.show('clicked!'); + } + ]]> + </fx:Script> + + <s:Panel title="Handling Events - Function Sample" + width="100%" height="100%"> + + <s:layout> + <s:VerticalLayout horizontalAlign="center" + paddingLeft="10" paddingRight="10" + paddingTop="10" paddingBottom="10"/> + </s:layout> + + <!-- Handling Events - Function --> + + <s:Button id="b" label="click me once" click="handleClick(event)"/> + </s:Panel> + +</s:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/spark/events/EventExample4.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/spark/events/EventExample4.mxml b/tourdeflexmodules/src/spark/events/EventExample4.mxml new file mode 100644 index 0000000..4470368 --- /dev/null +++ b/tourdeflexmodules/src/spark/events/EventExample4.mxml @@ -0,0 +1,56 @@ +<?xml version="1.0" encoding="utf-8"?> +<!-- + + Licensed to the Apache Software Foundation (ASF) under one or more + contributor license agreements. See the NOTICE file distributed with + this work for additional information regarding copyright ownership. + The ASF licenses this file to You under the Apache License, Version 2.0 + (the "License"); you may not use this file except in compliance with + the License. You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. + +--> +<s: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"> + + <fx:Script> + <![CDATA[ + import mx.controls.Alert; + + private function handleClick(event:MouseEvent):void + { + b.enabled = false; + Alert.show('clicked!'); + } + ]]> + </fx:Script> + + <s:Panel title="Handling Events - Function with addEventListener Sample" + width="100%" height="100%"> + + <s:layout> + <s:VerticalLayout horizontalAlign="center" + paddingLeft="10" paddingRight="10" + paddingTop="10" paddingBottom="10"/> + </s:layout> + + + <!-- Handling Events - Function with addEventListener --> + + <s:Button id="b" label="click me once"> + <s:creationComplete> + b.addEventListener(MouseEvent.CLICK, handleClick); + </s:creationComplete> + </s:Button> + + </s:Panel> + +</s:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/spark/events/EventExample5.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/spark/events/EventExample5.mxml b/tourdeflexmodules/src/spark/events/EventExample5.mxml new file mode 100644 index 0000000..1e2f34f --- /dev/null +++ b/tourdeflexmodules/src/spark/events/EventExample5.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: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:local="*"> + + <fx:Script> + <![CDATA[ + import mx.controls.Alert; + ]]> + </fx:Script> + + <fx:Declarations> + <!-- Dispatching an Event --> + <local:FiveSecondTrigger triggered="Alert.show('five second event triggered')"/> + </fx:Declarations> + + <s:Panel title="Dispatching Events Sample" + width="100%" height="100%"> + + <s:layout> + <s:VerticalLayout horizontalAlign="center" + paddingLeft="10" paddingRight="10" + paddingTop="10" paddingBottom="10"/> + </s:layout> + + <s:Label text="wait 5 seconds" color="0x000000"/> + + </s:Panel> + +</s:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/spark/events/EventExample6.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/spark/events/EventExample6.mxml b/tourdeflexmodules/src/spark/events/EventExample6.mxml new file mode 100644 index 0000000..dab9d02 --- /dev/null +++ b/tourdeflexmodules/src/spark/events/EventExample6.mxml @@ -0,0 +1,51 @@ +<?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: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"> + + <fx:Script> + <![CDATA[ + import mx.controls.Alert; + ]]> + </fx:Script> + + <s:Panel title="Dispatching Custom Events Sample" + width="100%" height="100%"> + + <s:layout> + <s:VerticalLayout horizontalAlign="center" + paddingLeft="10" paddingRight="10" + paddingTop="10" paddingBottom="10"/> + </s:layout> + + <!-- Dispatching a Custom Event --> + + <s:initialize> + addEventListener(MyEvent.TRIGGERED, function(event:MyEvent):void { + mx.controls.Alert.show('event handled!'); + }); + </s:initialize> + + <s:Button label="fire the event!" click="dispatchEvent(new MyEvent(MyEvent.TRIGGERED))"/> + + </s:Panel> + +</s:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/spark/events/FiveSecondTrigger.as ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/spark/events/FiveSecondTrigger.as b/tourdeflexmodules/src/spark/events/FiveSecondTrigger.as new file mode 100644 index 0000000..7c562d4 --- /dev/null +++ b/tourdeflexmodules/src/spark/events/FiveSecondTrigger.as @@ -0,0 +1,44 @@ +//////////////////////////////////////////////////////////////////////////////// +// +// 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.EventDispatcher; + import flash.events.TimerEvent; + import flash.utils.Timer; + + [Event(name="triggered")] + + public class FiveSecondTrigger extends EventDispatcher + { + public function FiveSecondTrigger() + { + var t:Timer = new Timer(5000, 1); + t.addEventListener(TimerEvent.TIMER, handleTimer); + t.start(); + } + + private function handleTimer(event:TimerEvent):void + { + var e:Event = new Event("triggered"); + dispatchEvent(e); + } + + } +} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/spark/events/MyEvent.as ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/spark/events/MyEvent.as b/tourdeflexmodules/src/spark/events/MyEvent.as new file mode 100644 index 0000000..28b176c --- /dev/null +++ b/tourdeflexmodules/src/spark/events/MyEvent.as @@ -0,0 +1,33 @@ +//////////////////////////////////////////////////////////////////////////////// +// +// Licensed to the Apache Software Foundation (ASF) under one or more +// contributor license agreements. See the NOTICE file distributed with +// this work for additional information regarding copyright ownership. +// The ASF licenses this file to You under the Apache License, Version 2.0 +// (the "License"); you may not use this file except in compliance with +// the License. You may obtain a copy of the License at +// +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, software +// distributed under the License is distributed on an "AS IS" BASIS, +// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +// See the License for the specific language governing permissions and +// limitations under the License. +// +//////////////////////////////////////////////////////////////////////////////// +package +{ + import mx.events.FlexEvent; + + public class MyEvent extends FlexEvent + { + public static const TRIGGERED:String = "triggered"; + + public function MyEvent(type:String, bubbles:Boolean=false, cancelable:Boolean=false) + { + super(type, bubbles, cancelable); + } + + } +} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/spark/events/TDFGradientBackgroundSkin.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/spark/events/TDFGradientBackgroundSkin.mxml b/tourdeflexmodules/src/spark/events/TDFGradientBackgroundSkin.mxml new file mode 100644 index 0000000..fe2a943 --- /dev/null +++ b/tourdeflexmodules/src/spark/events/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> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/spark/formatters/CurrencyFormatterExample.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/spark/formatters/CurrencyFormatterExample.mxml b/tourdeflexmodules/src/spark/formatters/CurrencyFormatterExample.mxml new file mode 100644 index 0000000..bf600df --- /dev/null +++ b/tourdeflexmodules/src/spark/formatters/CurrencyFormatterExample.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: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"> + + <fx:Script> + <![CDATA[ + + import mx.events.ValidationResultEvent; + private var vResult:ValidationResultEvent; + + // Event handler to validate and format input. + private function Format():void { + + vResult = numVal.validate(); + + if (vResult.type==ValidationResultEvent.VALID) { + var temp:Number=Number(priceUS.text); + formattedUSPrice.text= usdFormatter.format(temp); + } + + else { + formattedUSPrice.text=""; + } + } + ]]> + </fx:Script> + + <fx:Declarations> + <mx:CurrencyFormatter id="usdFormatter" precision="2" currencySymbol="$" decimalSeparatorFrom="." rounding="nearest" + decimalSeparatorTo="." useNegativeSign="true" useThousandsSeparator="true" alignSymbol="left"/> + + <mx:NumberValidator id="numVal" source="{priceUS}" property="text" allowNegative="true" domain="real"/> + </fx:Declarations> + + + <s:Panel title="CurrencyFormatter Example" width="100%" height="100%"> + + <s:layout> + <s:HorizontalLayout paddingLeft="10" paddingRight="10" paddingTop="10" paddingBottom="10"/> + </s:layout> + + <mx:Form> + <mx:FormItem label="Enter dollar amount:"> + <s:TextInput id="priceUS" text="" width="50%"/> + </mx:FormItem> + + <mx:FormItem label="Formatted U.S. dollar amount: "> + <s:Label id="formattedUSPrice" text="" /> + </mx:FormItem> + + <mx:FormItem> + <s:Button label="Validate and Format" click="Format()"/> + </mx:FormItem> + </mx:Form> + + </s:Panel> + +</s:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/spark/formatters/DateFormatterExample.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/spark/formatters/DateFormatterExample.mxml b/tourdeflexmodules/src/spark/formatters/DateFormatterExample.mxml new file mode 100644 index 0000000..6f934fe --- /dev/null +++ b/tourdeflexmodules/src/spark/formatters/DateFormatterExample.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: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"> + + <fx:Script> + <![CDATA[ + + import mx.events.ValidationResultEvent; + private var vResult:ValidationResultEvent; + + // Event handler to validate and format input. + private function Format():void + { + vResult = dateVal.validate(); + if (vResult.type==ValidationResultEvent.VALID) { + formattedDate.text=dateFormatter.format(dob.text); + } + + else { + formattedDate.text= ""; + } + } + ]]> + </fx:Script> + + <fx:Declarations> + <mx:DateFormatter id="dateFormatter" formatString="month: MM, day: DD, year: YYYY"/> + + <mx:DateValidator id="dateVal" source="{dob}" property="text" inputFormat="mm/dd/yyyy"/> + </fx:Declarations> + + <s:Panel title="DateFormatter Example" width="100%" height="100%"> + + <s:layout> + <s:HorizontalLayout paddingLeft="10" paddingRight="10" paddingTop="10" paddingBottom="10"/> + </s:layout> + + <mx:Form width="100%"> + <mx:FormItem label="Enter date (mm/dd/yyyy):" width="100%"> + <s:TextInput id="dob" text=""/> + </mx:FormItem> + + <mx:FormItem label="Formatted date: " width="100%"> + <s:Label id="formattedDate" text="" /> + </mx:FormItem> + + <mx:FormItem> + <s:Button label="Validate and Format" click="Format()"/> + </mx:FormItem> + </mx:Form> + + </s:Panel> +</s:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/spark/formatters/NumberFormatterExample.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/spark/formatters/NumberFormatterExample.mxml b/tourdeflexmodules/src/spark/formatters/NumberFormatterExample.mxml new file mode 100644 index 0000000..da5423b --- /dev/null +++ b/tourdeflexmodules/src/spark/formatters/NumberFormatterExample.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: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"> + + <fx:Script> + <![CDATA[ + + // Event handler to format the input. + private function Format():void + { + // The format() method returns the formatted String, + // or an empty String if there is an error. + var formattedVal:String = numberFormatter.format(inputVal.text); + + if (formattedVal.length==0) { + // If there is an error, the Format.error property + // contains the reason. + formattedNumber.text=numberFormatter.error; + } + + else { + formattedNumber.text=formattedVal; + } + } + ]]> + </fx:Script> + + <fx:Declarations> + <mx:NumberFormatter id="numberFormatter" /> + </fx:Declarations> + + <s:Panel title="Formatter Example" width="100%" height="100%"> + + <s:layout> + <s:HorizontalLayout paddingLeft="10" paddingRight="10" paddingTop="10" paddingBottom="10"/> + </s:layout> + + <mx:Form> + <mx:FormItem label="Enter number - a letter is invalid:"> + <s:TextInput id="inputVal" text="" width="75%"/> + </mx:FormItem> + + <mx:FormItem label="Formatted number: "> + <s:Label id="formattedNumber" /> + </mx:FormItem> + + <mx:FormItem> + <s:Button label="Validate and Format" click="Format()"/> + </mx:FormItem> + </mx:Form> + + </s:Panel> + +</s:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/spark/formatters/PhoneFormatterExample.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/spark/formatters/PhoneFormatterExample.mxml b/tourdeflexmodules/src/spark/formatters/PhoneFormatterExample.mxml new file mode 100644 index 0000000..d157c95 --- /dev/null +++ b/tourdeflexmodules/src/spark/formatters/PhoneFormatterExample.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: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"> + + <fx:Script> + <![CDATA[ + + import mx.events.ValidationResultEvent; + private var vResult:ValidationResultEvent; + + // Event handler to validate and format input. + private function Format():void + { + vResult = pnVal.validate(); + if (vResult.type==ValidationResultEvent.VALID) { + formattedPhone.text= phoneFormatter.format(phone.text); + } + + else { + formattedPhone.text= ""; + } + } + ]]> + </fx:Script> + + <fx:Declarations> + <mx:PhoneFormatter id="phoneFormatter" formatString="(###) ###-####" validPatternChars="#-() "/> + + <mx:PhoneNumberValidator id="pnVal" source="{phone}" property="text" allowedFormatChars=""/> + </fx:Declarations> + + <s:Panel title="PhoneNumberValidator Example" width="100%" height="100%"> + + <s:layout> + <s:HorizontalLayout paddingLeft="10" paddingRight="10" paddingTop="10" paddingBottom="10"/> + </s:layout> + + <mx:Form> + <mx:FormItem label="Enter a 10-digit phone number:"> + <s:TextInput id="phone" text="" width="75%"/> + </mx:FormItem> + + <mx:FormItem label="Formatted phone number: "> + <s:Label id="formattedPhone" text="" /> + </mx:FormItem> + + <mx:FormItem> + <s:Button label="Validate and Format" click="Format()"/> + </mx:FormItem> + </mx:Form> + + </s:Panel> + +</s:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/spark/formatters/SwitchFormatterExample.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/spark/formatters/SwitchFormatterExample.mxml b/tourdeflexmodules/src/spark/formatters/SwitchFormatterExample.mxml new file mode 100644 index 0000000..a919d73 --- /dev/null +++ b/tourdeflexmodules/src/spark/formatters/SwitchFormatterExample.mxml @@ -0,0 +1,75 @@ +<?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: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"> + + <fx:Script> + <![CDATA[ + + import mx.formatters.SwitchSymbolFormatter; + import mx.events.ValidationResultEvent; + + private var vResult:ValidationResultEvent; + + // Event handler to validate and format input. + private function Format():void + { + vResult = scVal.validate(); + + if (vResult.type==ValidationResultEvent.VALID) { + var switcher:SwitchSymbolFormatter=new SwitchSymbolFormatter('#'); + + formattedSCNumber.text = + switcher.formatValue("###-##-####", scNum.text); + } + + else { + formattedSCNumber.text= ""; + } + } + ]]> + </fx:Script> + + <fx:Declarations> + <mx:SocialSecurityValidator id="scVal" source="{scNum}" property="text"/> + </fx:Declarations> + + + <s:Panel title="SwitchSymbolFormatter Example" width="100%" height="100%"> + + <s:layout> + <s:HorizontalLayout paddingLeft="10" paddingRight="10" paddingTop="10" paddingBottom="10"/> + </s:layout> + + <mx:Form width="100%"> + <s:Label text="Enter a 9 digit Social Security number with no separator characters:" /> + + <s:TextInput id="scNum" text="" width="50%" maxChars="9"/> + <s:Button label="Validate and Format" click="Format()"/> + + <mx:FormItem label="formatted Social Security number:"> + <s:Label id="formattedSCNumber" text="" /> + </mx:FormItem> + </mx:Form> + + </s:Panel> + +</s:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/spark/formatters/TDFGradientBackgroundSkin.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/spark/formatters/TDFGradientBackgroundSkin.mxml b/tourdeflexmodules/src/spark/formatters/TDFGradientBackgroundSkin.mxml new file mode 100644 index 0000000..fe2a943 --- /dev/null +++ b/tourdeflexmodules/src/spark/formatters/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> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/spark/formatters/ZipCodeFormatterExample.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/spark/formatters/ZipCodeFormatterExample.mxml b/tourdeflexmodules/src/spark/formatters/ZipCodeFormatterExample.mxml new file mode 100644 index 0000000..09fa73c --- /dev/null +++ b/tourdeflexmodules/src/spark/formatters/ZipCodeFormatterExample.mxml @@ -0,0 +1,74 @@ +<?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: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"> + + <fx:Script> + <![CDATA[ + + import mx.events.ValidationResultEvent; + private var vResult:ValidationResultEvent; + + // Event handler to validate and format input. + private function Format():void + { + vResult = zcVal.validate(); + + if (vResult.type==ValidationResultEvent.VALID) { + formattedZipcode.text= zipFormatter.format(zip.text); + } + + else { + formattedZipcode.text= ""; + } + } + ]]> + </fx:Script> + + <fx:Declarations> + <mx:ZipCodeFormatter id="zipFormatter" formatString="#####-####"/> + + <mx:ZipCodeValidator id="zcVal" source="{zip}" property="text" allowedFormatChars=""/> + </fx:Declarations> + + <s:Panel title="ZipCodeFormatter Example" width="100%" height="100%"> + + <s:layout> + <s:HorizontalLayout paddingLeft="10" paddingRight="10" paddingTop="10" paddingBottom="10"/> + </s:layout> + + <mx:Form width="100%"> + <mx:FormItem label="Enter a 5 or 9 digit U.S. ZIP code:" width="100%"> + <s:TextInput id="zip" text=""/> + </mx:FormItem> + + <mx:FormItem label="Formatted ZIP code: " width="100%"> + <s:Label id="formattedZipcode" text="" /> + </mx:FormItem> + + <mx:FormItem> + <s:Button label="Validate and Format" click="Format()"/> + </mx:FormItem> + </mx:Form> + + </s:Panel> + +</s:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/spark/fxg/BitmapImageExample.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/spark/fxg/BitmapImageExample.mxml b/tourdeflexmodules/src/spark/fxg/BitmapImageExample.mxml new file mode 100644 index 0000000..c355bcc --- /dev/null +++ b/tourdeflexmodules/src/spark/fxg/BitmapImageExample.mxml @@ -0,0 +1,69 @@ +<?xml version="1.0" encoding="utf-8"?> +<!-- + + Licensed to the Apache Software Foundation (ASF) under one or more + contributor license agreements. See the NOTICE file distributed with + this work for additional information regarding copyright ownership. + The ASF licenses this file to You under the Apache License, Version 2.0 + (the "License"); you may not use this file except in compliance with + the License. You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. + +--> +<!-- BitmapGraphicExample.mxml --> +<s:Module xmlns:fx="http://ns.adobe.com/mxml/2009"; xmlns:s="library://ns.adobe.com/flex/spark"> + <s:Panel title="BitmapImage Sample" width="100%" height="100%"> + <s:layout> + <s:HorizontalLayout paddingLeft="10" paddingRight="10" paddingTop="10" paddingBottom="10"/> + </s:layout> + <s:VGroup> + <s:ComboBox id="fillModes" selectedItem="repeat"> + <s:dataProvider> + <s:ArrayCollection> + <fx:String>scale</fx:String> + <fx:String>clip</fx:String> + <fx:String>repeat</fx:String> + </s:ArrayCollection> + </s:dataProvider> + </s:ComboBox> + <s:ComboBox id="blends" selectedItem="normal"> + <s:dataProvider> + <s:ArrayCollection> + <fx:String>add</fx:String> + <fx:String>alpha</fx:String> + <fx:String>difference</fx:String> + <fx:String>erase</fx:String> + <fx:String>hardlight</fx:String> + <fx:String>invert</fx:String> + <fx:String>layer</fx:String> + <fx:String>lighten</fx:String> + <fx:String>multiply</fx:String> + <fx:String>normal</fx:String> + <fx:String>overlay</fx:String> + <fx:String>screen</fx:String> + <fx:String>shader</fx:String> + <fx:String>subtract</fx:String> + </s:ArrayCollection> + </s:dataProvider> + </s:ComboBox> + <s:CheckBox id="cbSmooth" label="Smooth?"/> + </s:VGroup> + + <!-- Single image, scaled to fit specified dimensions. --> + <s:Graphic x="150" y="0"> + <s:BitmapImage id="bg2" source="@Embed('assets/ApacheFlexLogo.png')" width="120" height="120" fillMode="{fillModes.selectedItem}" + smooth="{cbSmooth.selected}" blendMode="{blends.selectedItem}"/> + </s:Graphic> + + + <s:Label width="200" text="A BitmapImage element defines a rectangular region in its parent element's coordinate space, filled with bitmap data drawn from a source file."/> + </s:Panel> + +</s:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/spark/fxg/DropShadowGraphicExample.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/spark/fxg/DropShadowGraphicExample.mxml b/tourdeflexmodules/src/spark/fxg/DropShadowGraphicExample.mxml new file mode 100644 index 0000000..977faf9 --- /dev/null +++ b/tourdeflexmodules/src/spark/fxg/DropShadowGraphicExample.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:Module xmlns:fx="http://ns.adobe.com/mxml/2009"; + xmlns:s="library://ns.adobe.com/flex/spark" + xmlns:mx="library://ns.adobe.com/flex/halo"> + + <s:Panel width="100%" height="100%" + title="DropShadows with MXML Graphics Example" + x="0"> + + <s:Group horizontalCenter="0" y="5" width="117"> + <s:Graphic id="ellipse1"> + <s:filters> + <s:DropShadowFilter color="0x6080a0" alpha="0.6" distance="5" /> + </s:filters> + <s:Ellipse x="30" y="20" width="60" height="60"> + <s:fill> + <s:SolidColor color="0x60a0e0" /> + </s:fill> + </s:Ellipse> + </s:Graphic> + <s:Graphic id="rect1" x="47" y="0" width="100"> + <s:filters> + <s:DropShadowFilter color="0x002020" alpha="0.9" distance="8" angle="10"/> + </s:filters> + <s:Rect right="15" x="120" y="100" width="90" height="90"> + <s:fill> + <s:SolidColor color="0x4060c0" /> + </s:fill> + </s:Rect> + </s:Graphic> + <s:Graphic id="image1"> + <s:filters> + <s:DropShadowFilter color="0xFF6600" alpha="0.7" distance="10" angle="-30"/> + </s:filters> + <s:BitmapImage source="@Embed('assets/ApacheFlexIcon.png')" x="180" y="20" /> + </s:Graphic> + + </s:Group> + <s:Label width="250" verticalAlign="justify" x="10" y="30" + text="The DropShadowFilter class lets you add a drop shadow to display +objects. The shadow algorithm is based on the same box filter that the blur filter uses. You have +several options for the style of the drop shadow, including inner or outer shadow and knockout mode. +You can apply the filter to any display object (that is, objects that inherit from the DisplayObject +class), such as MovieClip, SimpleButton, TextField, and Video objects, as well as to BitmapData objects."/> + + + </s:Panel> +</s:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/spark/fxg/EclipseExample.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/spark/fxg/EclipseExample.mxml b/tourdeflexmodules/src/spark/fxg/EclipseExample.mxml new file mode 100644 index 0000000..a040799 --- /dev/null +++ b/tourdeflexmodules/src/spark/fxg/EclipseExample.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. + +--> +<s: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"> + + <s:Panel title="Ellipse Graphic Sample" + width="100%" height="100%"> + + <s:Graphic horizontalCenter="0" verticalCenter="0"> + <s:Ellipse height="100" width="250"> + <s:stroke> + <s:SolidColorStroke color="0x000000" weight="5"/> + </s:stroke> + <s:fill> + <s:RadialGradient> + <s:entries> + <s:GradientEntry color="0x336699" ratio="0.33" alpha="0.8"/> + <s:GradientEntry color="0x339999" ratio="0.66" alpha="0.8"/> + <s:GradientEntry color="0x323232" ratio="0.99" alpha="0.8"/> + </s:entries> + </s:RadialGradient> + </s:fill> + </s:Ellipse> + </s:Graphic> + <s:Label right="25" top="10" width="270" text="The Ellipse class is a filled graphic element that draws an ellipse. Graphic +objects are placed in a Graphic tag which defines the root of an FXG document."/> + </s:Panel> +</s:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/spark/fxg/EllipseTransformExample.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/spark/fxg/EllipseTransformExample.mxml b/tourdeflexmodules/src/spark/fxg/EllipseTransformExample.mxml new file mode 100644 index 0000000..3dd674a --- /dev/null +++ b/tourdeflexmodules/src/spark/fxg/EllipseTransformExample.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. + +--> +<s:Module xmlns:fx="http://ns.adobe.com/mxml/2009"; + xmlns:s="library://ns.adobe.com/flex/spark" + xmlns:mx="library://ns.adobe.com/flex/halo" minWidth="1024" minHeight="768"> + <s:layout> + <s:BasicLayout/> + </s:layout> + + <fx:Script> + <![CDATA[ + + private function addMatrix(): void + { + ellipse1.transform.matrix = rotation20Matrix; + descriptionText.text = "A matrix transform was applied moving the Ellipse to coordinates: 100, 310 and skewing it to a 20 degree rotation."; + trace(ellipse1.width); + } + ]]> + </fx:Script> + <fx:Declarations> + <!-- This matrix should cause the rotation of the Ellipse be 20 degrees --> + <s:Matrix id="rotation20Matrix" + a="0.939692620786" + b="0.34202014332" + c="0.34202014332" + d="0.939692620786" + tx="50" + ty="210" + /> + </fx:Declarations> + + <s:Panel title="Ellipse Transform Sample" width="100%" height="100%"> + <s:layout> + <s:VerticalLayout paddingLeft="10" paddingRight="10" paddingTop="10" paddingBottom="10"/> + </s:layout> + + <s:Label text="An Ellipse Using a Transform for Rotation" /> + + <s:Label id="descriptionText" width="300"/> + <s:Button label="Apply Transform" click="addMatrix()" x="40" y="330" /> + </s:Panel> + <s:Ellipse id="ellipse1" width="60" height="70" x="40" y="120"> + <s:fill> + <s:LinearGradient> + <s:GradientEntry color="#00FF00" alpha="1" ratio="0"/> + <s:GradientEntry color="#000000" alpha="0" ratio="1"/> + </s:LinearGradient> + </s:fill> + <s:stroke> + <s:SolidColorStroke color="0x666666" weight="1"/> + </s:stroke> + </s:Ellipse> +</s:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/spark/fxg/LineExample.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/spark/fxg/LineExample.mxml b/tourdeflexmodules/src/spark/fxg/LineExample.mxml new file mode 100644 index 0000000..0b855ea --- /dev/null +++ b/tourdeflexmodules/src/spark/fxg/LineExample.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: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"> + + + <s:Panel title="Line Graphic Sample" width="100%" height="100%" > + <s:Group left="133" top="100"> + + <s:Line xFrom="0" xTo="0" yFrom="0" yTo="100"> + <!-- Define the border color of the line. --> + <s:stroke> + <s:SolidColorStroke color="0x000000" weight="1" joints="miter"/> + </s:stroke> + </s:Line> + + <s:Line xFrom="6" xTo="6" yFrom="0" yTo="100" > + <s:stroke> + <s:SolidColorStroke color="0x000000" weight="1" joints="miter"/> + </s:stroke> + </s:Line> + + <s:Line xFrom="12" xTo="12" yFrom="0" yTo="100"> + <s:stroke> + <s:SolidColorStroke color="0x000000" weight="2" joints="miter"/> + </s:stroke> + </s:Line> + + <s:Line xFrom="20" xTo="20" yFrom="0" yTo="100"> + <s:stroke> + <s:SolidColorStroke color="0x000000" weight="3" joints="miter"/> + </s:stroke> + </s:Line> + + <s:Line xFrom="30" xTo="30" yFrom="0" yTo="100"> + <s:stroke> + <s:SolidColorStroke color="0x000000" weight="5" joints="miter"/> + </s:stroke> + </s:Line> + + <s:Line xFrom="43" xTo="43" yFrom="0" yTo="100"> + <s:stroke> + <s:SolidColorStroke color="0x000000" weight="8" joints="miter"/> + </s:stroke> + </s:Line> + + <s:Line xFrom="58" xTo="58" yFrom="0" yTo="100"> + <s:stroke> + <s:SolidColorStroke color="0x000000" weight="13" joints="miter"/> + </s:stroke> + </s:Line> + + <s:Line xFrom="84" xTo="84" yFrom="0" yTo="100"> + <s:stroke> + <s:SolidColorStroke color="0x000000" weight="21" joints="miter"/> + </s:stroke> + </s:Line> + + <s:Line xFrom="123" xTo="123" yFrom="0" yTo="100" > + <s:stroke> + <s:SolidColorStroke color="0x000000" weight="34" joints="bevel" /> + </s:stroke> + </s:Line> + <s:Line xFrom="168" xTo="168" yFrom="0" yTo="100" x="3" y="0"> + <s:stroke> + <s:SolidColorStroke color="0x000000" weight="45"/> + </s:stroke> + </s:Line> + <s:Line xFrom="210" xTo="210" yFrom="0" yTo="100" x="19" y="0"> + <s:stroke> + <s:SolidColorStroke color="0x000000" weight="60"/> + </s:stroke> + </s:Line> + </s:Group> + <s:Label right="20" top="15" width="250" text="The Line class is a graphic element that draws a line between two points. +The default stroke for a line is undefined; therefore, if you do not specify the stroke, the line is invisible."/> + </s:Panel> +</s:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/spark/fxg/LinearGradientsSpreadMethodExample.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/spark/fxg/LinearGradientsSpreadMethodExample.mxml b/tourdeflexmodules/src/spark/fxg/LinearGradientsSpreadMethodExample.mxml new file mode 100644 index 0000000..e5c60c0 --- /dev/null +++ b/tourdeflexmodules/src/spark/fxg/LinearGradientsSpreadMethodExample.mxml @@ -0,0 +1,63 @@ +<?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:Module xmlns:fx="http://ns.adobe.com/mxml/2009"; + xmlns:s="library://ns.adobe.com/flex/spark" + xmlns:mx="library://ns.adobe.com/flex/halo"> + <fx:Script> + <![CDATA[ + import mx.collections.ArrayCollection; + ]]> + </fx:Script> + + <s:Panel title="LinearGradient Control" + width="100%" height="100%" + > + + <s:HGroup horizontalCenter="0" top="10"> + <s:Label verticalAlign="justify" x="10" y="30" width="200" + text="The LinearGradient class lets you specify the fill of a graphical element, where a gradient specifies a gradual color transition in the fill color. You add a series of GradientEntry objects to the LinearGradient object's entries Array to define the colors that make up the gradient fill."/> + <s:Rect id="rect1" height="150" width="160" > + <s:fill> + <s:LinearGradient id="gradient1" scaleX="20" x="0"> + <s:entries> + <s:GradientEntry color="0xFF0000" /> + <s:GradientEntry color="0xFFFFFF" /> + <s:GradientEntry color="0x0000FF" /> + </s:entries> + </s:LinearGradient> + </s:fill> + </s:Rect> + <s:VGroup> + + <s:Label text="scaleX value: " /> + <s:HSlider id="scaleXVal" value="20" maximum="200" change="gradient1.scaleX=scaleXVal.value"/> + <s:Label text="x value: " /> + <s:HSlider id="XVal" value="0" maximum="200" change="gradient1.x=XVal.value"/> + <s:Label text="select a spreadMethod: " /> + <s:DropDownList id="spreadValue" selectedIndex="0" + dataProvider="{new ArrayCollection(['pad', 'reflect', 'repeat'])}" + change="gradient1.spreadMethod=spreadValue.selectedItem"/> + </s:VGroup> + + </s:HGroup> + + </s:Panel> + +</s:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/spark/fxg/OrangeCrayonStar.fxg ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/spark/fxg/OrangeCrayonStar.fxg b/tourdeflexmodules/src/spark/fxg/OrangeCrayonStar.fxg new file mode 100644 index 0000000..601841c --- /dev/null +++ b/tourdeflexmodules/src/spark/fxg/OrangeCrayonStar.fxg @@ -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. + +--> +<Graphic version="1.0" xmlns="http://ns.adobe.com/fxg/2008"; xmlns:fw="http://ns.adobe.com/fxg/2008/fireworks"; viewHeight= "134" viewWidth= "136"> + <Library> + </Library> + + <Group id="Page_1" fw:type="page"> + <Group id="State_1" fw:type="state"> + <Group id="Layer_1" fw:type="layer"> + <Group id="undefined"> + <Path winding="evenOdd" data="M 68 12 L 85 48 L 125 54 L 96 82 L 103 121 L 68 103 L 32 121 L 39 82 L 10 54 L 50 48 L 68 12 Z " blendMode="normal" alpha="1"> + <fill> + <LinearGradient x = "67" y = "42" scaleX = "113" rotation = "70"> + <GradientEntry color="#ff6600" ratio="0" alpha="1"/> + <GradientEntry color="#ff6600" ratio="0.08" alpha="1"/> + <GradientEntry color="#ffcc00" ratio="0.32" alpha="1"/> + <GradientEntry color="#ffff99" ratio="0.53" alpha="1"/> + <GradientEntry color="#dedede" ratio="0.99" alpha="1"/> + <GradientEntry color="#ffffcc" ratio="0.72" alpha="1"/> + </LinearGradient> + </fill> + <stroke> + <SolidColorStroke color="#ff6600" weight="6"/> + </stroke> + </Path> + </Group> + </Group> + </Group> + </Group> +</Graphic> \ No newline at end of file http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/spark/fxg/RectExample.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/spark/fxg/RectExample.mxml b/tourdeflexmodules/src/spark/fxg/RectExample.mxml new file mode 100644 index 0000000..1866ca1 --- /dev/null +++ b/tourdeflexmodules/src/spark/fxg/RectExample.mxml @@ -0,0 +1,82 @@ +<?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: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"> + + <s:Panel title="Rect Graphic Sample" + width="100%" height="100%"> + + + <s:Group left="15" top="20"> + <s:Graphic x="0" y="0"> + <!-- Draw rectangle with square corners. --> + <s:Rect height="100" width="150"> + <s:stroke> + <s:SolidColorStroke color="0x000000" weight="2"/> + </s:stroke> + <s:fill> + <s:SolidColor color="0x336699"/> + </s:fill> + </s:Rect> + </s:Graphic> + + <s:Graphic x="250" y="0"> + <!-- Draw rectangle with rounded corners. --> + <s:Rect height="100" width="150" radiusX="25" radiusY="25"> + <s:stroke> + <s:SolidColorStroke color="0x336699" weight="2"/> + </s:stroke> + <s:fill> + <s:RadialGradient> + <s:entries> + <s:GradientEntry color="0x336699" alpha="0.5"/> + <s:GradientEntry color="0x323232" alpha="0.5"/> + <s:GradientEntry color="0xE2E2E2" alpha="0.5"/> + </s:entries> + </s:RadialGradient> + </s:fill> + </s:Rect> + </s:Graphic> + + <s:Graphic x="500" y="0"> + <s:Rect height="100" width="150"> + <s:stroke> + <s:LinearGradientStroke weight="6" rotation="90"> + <s:GradientEntry color="0x323232" alpha="0.8"/> + <s:GradientEntry color="0x336699" alpha="0.8"/> + </s:LinearGradientStroke> + </s:stroke> + <s:fill> + <s:RadialGradient> + <s:entries> + <s:GradientEntry color="0x336699"/> + <s:GradientEntry color="0x323232"/> + <s:GradientEntry color="0xE2E2E2"/> + </s:entries> + </s:RadialGradient> + </s:fill> + </s:Rect> + </s:Graphic> + + </s:Group> + <s:Label top="165" horizontalCenter="0" width="40%" text="The Rect class is a filled graphic element that draws a rectangle."/> + </s:Panel> +</s:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/spark/fxg/RichTextExample.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/spark/fxg/RichTextExample.mxml b/tourdeflexmodules/src/spark/fxg/RichTextExample.mxml new file mode 100644 index 0000000..9df7a2f --- /dev/null +++ b/tourdeflexmodules/src/spark/fxg/RichTextExample.mxml @@ -0,0 +1,58 @@ +<?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: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"> + + <s:Panel title="RichText Sample" width="100%" height="100%" > + <s:layout> + <s:HorizontalLayout paddingLeft="8" paddingRight="8" paddingTop="8"/> + </s:layout> + <s:Group left="10" right="10" top="10" bottom="10"> + <s:RichText x="0" y="0" width="75" fontFamily="Times" fontSize="15" textRotation="rotate90"> + <s:content>Hello World!</s:content> + </s:RichText> + + <s:Group x="100" y="0"> + <s:RichText width="100" textAlign="justify" paddingTop="5" paddingLeft="5" paddingRight="5" paddingBottom="5"> + <s:content>Hello World! This is a justified paragraph of text in a RichText control. It has a border around it drawn by a Rect inside a Group.</s:content> + </s:RichText> + <s:Rect width="100%" height="100%"> + <s:stroke> + <s:SolidColorStroke/> + </s:stroke> + </s:Rect> + </s:Group> + + <s:Group x="225" y="0" > + <s:RichText width="140" height="120" columnCount="2" columnGap="10"> + <s:content><s:span fontWeight="bold">Hello World!</s:span> This is a paragraph of text in 2 columns. It is about 20 words long, which should be enough to cause a few line breaks.</s:content> + </s:RichText> + <s:Rect width="100%" height="100%"> + <s:stroke> + <s:SolidColorStroke/> + </s:stroke> + </s:Rect> + </s:Group> + </s:Group> + <s:Label width="270" text="RichText is a low-level UIComponent that can display one or more lines of richly-formatted text and embedded images. For performance reasons, it does not support scrolling, selection, editing, clickable hyperlinks, or images loaded from URLs. If you need those capabilities, see the RichEditableText class."/> + </s:Panel> + +</s:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/spark/fxg/StaticFXGExample.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/spark/fxg/StaticFXGExample.mxml b/tourdeflexmodules/src/spark/fxg/StaticFXGExample.mxml new file mode 100644 index 0000000..02a3e92 --- /dev/null +++ b/tourdeflexmodules/src/spark/fxg/StaticFXGExample.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. + +--> +<s: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:fxg="*"> + + + <s:Panel title="Static FXG Sample" width="100%" height="100%"> + <s:layout> + <s:HorizontalLayout paddingLeft="10" paddingRight="10" paddingTop="10" paddingBottom="10"/> + </s:layout> + + <s:Label verticalAlign="justify" width="200" + text="You can use a static file of fxg within your MXML. You include the inline +component as shown here."/> + + <s:VGroup> + <s:VGroup bottom="100"> + <s:HSlider id="star_width" maximum="400" change="crayonStar.width=star_width.value" + horizontalCenter="-90" y="250" /> + <s:Label horizontalCenter="-90" y="269" text="width"/> + </s:VGroup> + <s:VGroup bottom="60"> + <s:HSlider id="star_height" maximum="400" change="crayonStar.height=star_height.value" + horizontalCenter="90" y="250" /> + <s:Label horizontalCenter="90" y="269" text="height"/> + </s:VGroup> + </s:VGroup> + + <fxg:OrangeCrayonStar id="crayonStar" /> + </s:Panel> + + +</s:Module> http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/spark/fxg/assets/ApacheFlexIcon.png ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/spark/fxg/assets/ApacheFlexIcon.png b/tourdeflexmodules/src/spark/fxg/assets/ApacheFlexIcon.png new file mode 100644 index 0000000..e68d831 Binary files /dev/null and b/tourdeflexmodules/src/spark/fxg/assets/ApacheFlexIcon.png differ http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/spark/fxg/assets/ApacheFlexLogo.png ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/spark/fxg/assets/ApacheFlexLogo.png b/tourdeflexmodules/src/spark/fxg/assets/ApacheFlexLogo.png new file mode 100644 index 0000000..4ff037f Binary files /dev/null and b/tourdeflexmodules/src/spark/fxg/assets/ApacheFlexLogo.png differ http://git-wip-us.apache.org/repos/asf/flex-examples/blob/9343d391/tourdeflexmodules/src/spark/i18n/SparkCollator2Example.mxml ---------------------------------------------------------------------- diff --git a/tourdeflexmodules/src/spark/i18n/SparkCollator2Example.mxml b/tourdeflexmodules/src/spark/i18n/SparkCollator2Example.mxml new file mode 100644 index 0000000..5d29531 --- /dev/null +++ b/tourdeflexmodules/src/spark/i18n/SparkCollator2Example.mxml @@ -0,0 +1,86 @@ +<?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: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" + width="100%" height="100%" creationComplete="compareStrings()"> + <fx:Script> + <![CDATA[ + import mx.collections.ArrayCollection; + [Bindable] + private var _locales:ArrayCollection = new ArrayCollection(['en-US','de-DE','ja-JP','ru-RU','zh-CN','fr-FR']); + + private function compareStrings():void { + if(firstTI.text != '' && secondTI.text != '') { + switch (sortCollator.compare(firstTI.text,secondTI.text)) { + case 1: + operatorL.text = '>'; + break; + case 0: + operatorL.text = '='; + break; + case -1: + operatorL.text = '<'; + break; + default: + operatorL.text = ' '; + } + } + } + ]]> + </fx:Script> + + <fx:Declarations> + <s:SortingCollator id="sortCollator" locale="{localeCB.selectedItem}"/> + </fx:Declarations> + + <s:Panel title="Spark Collator" width="100%" height="100%"> + + <s:layout> + <s:HorizontalLayout paddingLeft="10" paddingRight="10" paddingTop="10" paddingBottom="10" /> + </s:layout> + + <s:Form height="100%" width="100%"> + <s:Label text="Compare two strings by using SortingCollator"/> + <s:Spacer height="15"/> + + <s:FormItem label="Locales:" toolTip="Select a locale for the collator instance."> + <s:ComboBox id="localeCB" dataProvider="{_locales}" selectedIndex="5" change="compareStrings()"/> + </s:FormItem> + <s:FormItem label="Collator Options:" toolTip="Set properties for the collator instance."> + <s:HGroup> + <s:CheckBox id="ignoreCaseCB" label="ignoreCase" change="sortCollator.ignoreCase = ignoreCaseCB.selected;compareStrings()"/> + <s:CheckBox id="ignDiacriticsCB" label="ignoreDiacritics" change="sortCollator.ignoreDiacritics = ignDiacriticsCB.selected;compareStrings()"/> + <s:CheckBox id="ignSymbolsCB" label="ignoreSymbols" change="sortCollator.ignoreSymbols = ignSymbolsCB.selected;compareStrings()"/> + <s:CheckBox id="ignKanaTypeCB" label="ignoreKanaType" change="sortCollator.ignoreKanaType = ignKanaTypeCB.selected;compareStrings()"/> + <s:CheckBox id="ignCharacterWidthCB" label="ignoreCharacterWidth" change="sortCollator.ignoreCharacterWidth = ignCharacterWidthCB.selected;compareStrings()"/> + </s:HGroup> + </s:FormItem> + <s:FormItem label="Strings:" toolTip="Input two strings and find out their compare result."> + <s:HGroup> + <s:TextInput id="firstTI" text="coté" change="compareStrings()"/> + <s:Label id="operatorL" text=" " fontSize="15"/> + <s:TextInput id="secondTI" text="côte" change="compareStrings()"/> + </s:HGroup> + </s:FormItem> + </s:Form> + + </s:Panel> +</s:Module>
