リハビリ中

Flash10 Flex


http://moeten.info/flex/20090917_titleShop2/bin-release/main.html
実際の作品例はこちら
http://moeten.info/maidcafe/?m=shop_search
画像から検索のバナーをクリックすると起動します。
＃まだ、作りかけですが、オーバーレイと組み合わせると面白い感じ。
久しぶりにFlash10
っというのも、PV3Dを遊んでたら、これ、別にFlash10でもいいんじゃなかろうかって思って、リハビリがてらアニメーションを作ってみた。
うにょうにょ動くアニメーションは意外と簡単で以下のコードでできます。

<mx:Parallel id="myAnim">
<mx:AnimateProperty property="rotationZ" fromValue="0" toValue="360" easingFunction="Back.easeOut" duration="2000"/>
<mx:AnimateProperty property="rotationY" fromValue="0" toValue="360" easingFunction="Back.easeOut" duration="2000"/>
<mx:AnimateProperty property="rotationX" fromValue="0" toValue="360" easingFunction="Back.easeOut" duration="2000"/>
</mx:Parallel>

すべてのコードはこちら

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="init()" backgroundGradientAlphas="[1.0, 1.0]" backgroundGradientColors="[#FFFFFF, #C9C9C9]">
<mx:Script>
<![CDATA[
import mx.effects.easing.*;
private function init():void{
    hts.send();
}
]]>
</mx:Script>
<mx:HTTPService id="hts" url="http://moeten.info/maidcafe/?type=shop&amp;tid=&amp;cid=1&amp;m=api&amp;image=on" result="pbar.visible=false" resultFormat="e4x"/>
<mx:Parallel id="myAnim">
    <mx:Fade duration="2000"/>
    <mx:AnimateProperty property="rotationZ" fromValue="0" toValue="360" easingFunction="Back.easeOut" duration="2000"/>
    <mx:AnimateProperty property="rotationY" fromValue="0" toValue="360" easingFunction="Back.easeOut" duration="2000"/>
    <mx:AnimateProperty property="rotationX" fromValue="0" toValue="360" easingFunction="Back.easeOut" duration="2000"/>
    <mx:Iris duration="2000"/>
</mx:Parallel>
<mx:ProgressBar id="pbar" x="19" y="10" indeterminate="true" label=" "
    themeColor="#F1A2FF" borderColor="#FFFFFF" creationCompleteEffect="WipeRight" hideEffect="WipeRight" width="714" trackHeight="10"/>
<mx:TileList id="tl" dataProvider="{hts.lastResult.item}" x="19" y="20" width="714" height="592" creationCompleteEffect="Fade"
    backgroundAlpha="0" borderThickness="0" columnWidth="110" rowHeight="110" itemClick="{myImage.visible=true;}">
    <mx:itemRenderer>
        <mx:Component>
            <mx:Image source="{String( data.image.image1).replace( '.jpg' , 'x150.jpg' )  }"
                creationCompleteEffect="myAnim" width="100" height="100"  showEffect="Fade"/>
        </mx:Component>
    </mx:itemRenderer>
</mx:TileList>
<mx:Image id="myImage" x="100" y="100" source="{tl.selectedItem.image_big.image1}" width="480" showEffect="myAnim" visible="false" click="{myImage.visible=false}" hideEffect="myAnim"/>
</mx:Application>