| <?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. |
| |
| --> |
| <js:View xmlns:fx="http://ns.adobe.com/mxml/2009" |
| xmlns:js="library://ns.apache.org/royale/basic" |
| xmlns:local="*" |
| xmlns:models="models.*" |
| xmlns:acc="org.apache.royale.html.accessories.*"> |
| |
| <fx:Style> |
| .title { |
| font-size: 14pt; |
| font-weight: bold; |
| } |
| |
| global { |
| IEffectTimer: ClassReference("org.apache.royale.utils.EffectTimer"); |
| } |
| |
| </fx:Style> |
| |
| <fx:Script> |
| <![CDATA[ |
| import org.apache.royale.effects.Fade; |
| import org.apache.royale.effects.Move; |
| |
| private function swapit():void |
| { |
| var move1:Move = new Move(image1); |
| var move2:Move = new Move(image2); |
| move1.xTo = image1.x == 100 ? 400 : 100; |
| move2.xTo = image2.x == 100 ? 400 : 100; |
| move1.play(); |
| move2.play(); |
| } |
| |
| private function fadeout():void |
| { |
| var fade:Fade = new Fade(image1); |
| fade.alphaFrom = 1; |
| fade.alphaTo = 0; |
| fade.play(); |
| } |
| |
| private function fadein():void |
| { |
| var fade:Fade = new Fade(image1); |
| fade.alphaFrom = 0; |
| fade.alphaTo = 1; |
| fade.play(); |
| } |
| ]]> |
| </fx:Script> |
| |
| <js:Container width="600" height="700" x="50" y="50"> |
| <js:beads> |
| <js:VerticalLayout /> |
| </js:beads> |
| |
| <js:Container width="600" height="40"> |
| <js:beads> |
| <js:HorizontalLayout /> |
| </js:beads> |
| <js:TextButton text="swap" click="swapit()" /> |
| <js:TextButton text="fade out" click="fadeout()" /> |
| <js:TextButton text="fade in" click="fadein()" /> |
| </js:Container> |
| |
| <js:Container width="500" height="500"> |
| <js:Image id="image1" src="twong.jpg" x="100" y="20" /> |
| <js:Label id="caption1" text="Dick" x="100" y="200" /> |
| <js:Image id="image2" src="jproctor.jpg" x="400" y="20" /> |
| <js:Label id="caption2" text="Jane" x="400" y="200" /> |
| </js:Container> |
| </js:Container> |
| |
| </js:View> |