初学flex遇到加载gif问题,翻遍网络(由于google被封)找不到解决方法。总结整理后得到如下方法解决:
Flex里Image控件插入gif动画的图片默认只显示一帧,也就是说是不会动的,我们可以借助GifPlayer类包来实现Flex里插入动画的Gif图片。
GifPlayer下载:http://download.csdn.net/detail/d294083434/9432178,如图,提取org文件夹并放在程序目录src下面就可以了。
实例一:简单添加gif
- <?xml version="1.0" encoding="utf-8"?>
- <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
- xmlns:s="library://ns.adobe.com/flex/spark"
- xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
- <fx:Script>
- <![CDATA[
- import org.bytearray.gif.player.GIFPlayer;
- private var gifPlay:GIFPlayer=new GIFPlayer();
- private function init():void{
- var req:URLRequest=new URLRequest("../flex_src/images/复件-雨量图标.gif");
- gifPlay.load(req);
- gifImg.addChild(gifPlay);
- }
- ]]>
- </fx:Script>
- <mx:TitleWindow title="abc" id="ADwindow" width="1000" height="800" >
- <mx:Image id="gifImg" width="221" height="92" creationComplete="init()"/>
- </mx:TitleWindow>
- </s:Application>
实例二:演示了几个常用的功能:播放、停止、到第几帧播放、到第几帧停止。
- <?xml version="1.0" encoding="utf-8"?>
- <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
- xmlns:s="library://ns.adobe.com/flex/spark"
- xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600" creationComplete="init()">
- <fx:Script>
- <![CDATA[
- import flash.net.URLRequest;
- import org.bytearray.gif.player.GIFPlayer;
- import org.bytearray.gif.events.FileTypeEvent;
- import org.bytearray.gif.events.GIFPlayerEvent;
- import org.bytearray.gif.events.FrameEvent;
- import org.bytearray.gif.events.TimeoutEvent;
- private var _myGIFPlayer:GIFPlayer = new GIFPlayer();//实例化GIFPlayer实例
- private var _totalFrame:Number;//总帧数
- //private var _currentFrame:Number;
- private function init():void
- {
- var request:URLRequest = new URLRequest("../flex_src/images/复件-雨量图标.gif");//同级目录下得md.gif图片
- _myGIFPlayer.load(request);
- img.addChild(_myGIFPlayer);//img控件添加播放
- _myGIFPlayer.addEventListener(GIFPlayerEvent.COMPLETE, onCompleteGIF);//载入gif图片完毕时的回调函数
- _myGIFPlayer.addEventListener(FrameEvent.FRAME_RENDERED, onFrameRendered);//读取帧的回调函数
- //_myGIFPlayer.addEventListener(TimeoutEvent.TIME_OUT, onTimeOut);
- }
- private function onCompleteGIF(event:GIFPlayerEvent):void
- {
- _totalFrame = _myGIFPlayer.totalFrames;//总帧数
- totalframe.text = String(_totalFrame);
- }
- private function onFrameRendered(event:FrameEvent):void
- {
- currentframe.text = String(_myGIFPlayer.currentFrame);//当前播放的帧数
- }
- private function onTimeOut(event:TimeoutEvent):void
- {
- trace ("gif is error!");
- }
- private function play():void
- {
- _myGIFPlayer.play();
- }
- private function stop():void
- {
- _myGIFPlayer.stop();
- }
- private function gotoandplay():void
- {
- var numFrame:Number = Math.floor(Math.random() * _totalFrame ) + 1;
- _myGIFPlayer.gotoAndPlay(numFrame);
- gotoplaybtn.label = "gotoPlay(" + numFrame + ")";
- }
- private function gotoandstop():void
- {
- var numFrame:Number = Math.floor(Math.random() * _totalFrame ) + 1;
- _myGIFPlayer.gotoAndStop(numFrame);
- gotostopbtn.label = "gotoStop(" + numFrame + ")";
- }
- ]]>
- </fx:Script>
- <s:layout>
- <s:BasicLayout/>
- </s:layout>
- <fx:Declarations>
- <!-- 将非可视元素(例如服务、值对象)放在此处 -->
- </fx:Declarations>
- <mx:Image id="img" width="217" height="300" top="30" left="240"/>
- <mx:ApplicationControlBar width="80%" bottom="20" horizontalCenter="0">
- <mx:Button label="Play" height="22" click="play();" styleName="primaryButton" />
- <mx:Button label="Stop" height="22" click="stop();" />
- <mx:Button id="gotoplaybtn" height="22" label="gotoPlay(rand)" click="gotoandplay();" />
- <mx:Button id="gotostopbtn" height="22" label="gotoStop(rand)" click="gotoandstop();" />
- <mx:Label text="TotalFrame:" />
- <mx:Label id="totalframe" />
- <mx:Label text="CurrentFrame:" />
- <mx:Label id="currentframe" />
- </mx:ApplicationControlBar>
- </s:Application>