该方案,是预加载:前一张,当前,下一张图片,一共3张图片放入内存中。这样对内存的消耗可以非常小,加载之后的图片就释放内存。

下面示例一个是类ImagePlayers,一个是index.mxml

package
{
import flash.display.BitmapData;
import flash.display.Loader;
import flash.events.Event;
import flash.events.TimerEvent;
import flash.net.URLRequest;
import flash.utils.Timer; import mx.collections.ArrayCollection; import spark.components.Image; public class ImagePlayers
{
private var bitmapDataArrPre:ArrayCollection=new ArrayCollection();
private var bitmapDataArrPla:ArrayCollection=new ArrayCollection();
private var bitmapDataArrNex:ArrayCollection=new ArrayCollection(); private var playerxh:int=0;
private var playTimer:Timer; public var UrlArr:Array=[];
public var show:Image;
public var play:Image; public function ImagePlayers()
{
playTimer=new Timer(Number(500));
playTimer.addEventListener(TimerEvent.TIMER, function(evt:TimerEvent):void
{
if (playerxh < (UrlArr.length-1))
{
nextf();
}
else
{
playTimer.stop(); play.toolTip="播放"
play.source="assets/images/play/play.png";
}
});
} public function start():void
{
imgLoadPla(UrlArr[0].url);
} private function imgLoadPre(url:String):void
{
var loader:Loader = new Loader();
loader.contentLoaderInfo.addEventListener(Event.COMPLETE, imgLoadedPre);
loader.load(new URLRequest(url));
}
private function imgLoadedPre(e:Event):void
{
var _bitmapData:BitmapData = new BitmapData(e.target.width,e.target.height,false);
_bitmapData.draw(e.target.content); bitmapDataArrPre.removeAll();
bitmapDataArrPre.addItem(_bitmapData);
}
private function imgLoadPla(url:String):void
{
var loader:Loader = new Loader();
loader.contentLoaderInfo.addEventListener(Event.COMPLETE, imgLoadedPla);
loader.load(new URLRequest(url));
}
private function imgLoadedPla(e:Event):void
{
var _bitmapData:BitmapData = new BitmapData(e.target.width,e.target.height,false);
_bitmapData.draw(e.target.content); bitmapDataArrPla.removeAll();
bitmapDataArrPla.addItem(_bitmapData); if(playerxh==0)
{
show.source=bitmapDataArrPla[0];
imgLoadNex(UrlArr[1].url);
}
}
private function imgLoadNex(url:String):void
{
var loader:Loader = new Loader();
loader.contentLoaderInfo.addEventListener(Event.COMPLETE, imgLoadedNex);
loader.load(new URLRequest(url));
}
private function imgLoadedNex(e:Event):void
{
var _bitmapData:BitmapData = new BitmapData(e.target.width,e.target.height,false);
_bitmapData.draw(e.target.content); bitmapDataArrNex.removeAll();
bitmapDataArrNex.addItem(_bitmapData); }
//上一张
public function pref():void
{
if(playerxh>0)
{
bitmapDataArrNex.removeAll();
bitmapDataArrNex.addItem(bitmapDataArrPla[0]); bitmapDataArrPla.removeAll();
bitmapDataArrPla.addItem(bitmapDataArrPre[0]); playerxh--;
if(playerxh!=0)
{
imgLoadPre(UrlArr[playerxh-1].url);
} show.source=bitmapDataArrPla[0];
} }
//下一张
public function nextf():void
{
if(playerxh<(UrlArr.length-1))
{
bitmapDataArrPre.removeAll();
bitmapDataArrPre.addItem(bitmapDataArrPla[0]); bitmapDataArrPla.removeAll();
bitmapDataArrPla.addItem(bitmapDataArrNex[0]); playerxh++;
if(playerxh!=(UrlArr.length-1))
{
imgLoadNex(UrlArr[playerxh+1].url);
} show.source=bitmapDataArrPla[0];
}
}
//播放
public function playf(delay:Number=500):void
{
if(play.toolTip=="播放")
{
play.toolTip="暂停"
play.source="assets/images/play/pause.png";
if(delay!=playTimer.delay)
{
playTimer.delay=delay;
}
playTimer.start();
}
else if(play.toolTip=="暂停")
{
play.toolTip="播放"
play.source="assets/images/play/play.png";
playTimer.stop();
}
}
}
}
<?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"
creationComplete="application1_creationCompleteHandler(event)">
<fx:Script>
<![CDATA[
import mx.events.FlexEvent; private var player:ImagePlayers;
protected function application1_creationCompleteHandler(event:FlexEvent):void
{
player=new ImagePlayers();
player.show=show;
player.play=play; for(var i:int=5;i<=15;i++)
{
player.UrlArr.push({url:"http://192.168.2.9/png/data/pm25/"+Strings(i)+".gif"});
} player.start();
}
private function Strings(i:int):String
{
if(i<10)
{
return "00"+i.toString();
}
if(i<100)
{
return "0"+i.toString();
}
return "";
}
]]>
</fx:Script>
<fx:Declarations>
<!-- 将非可视元素(例如服务、值对象)放在此处 -->
</fx:Declarations>
<s:VGroup>
<s:HGroup>
<s:Image id="play" source="assets/images/play/play.png" toolTip="播放" click="player.playf()" buttonMode="true" useHandCursor="true" />
<s:Image source="assets/images/play/pre.png" click="player.pref()" toolTip="上一个" buttonMode="true" useHandCursor="true" />
<s:Image source="assets/images/play/next.png" click="player.nextf()" toolTip="下一个" buttonMode="true" useHandCursor="true" />
</s:HGroup>
<s:Image id="show" fillMode="scale" scaleMode="letterbox" smooth="true" smoothingQuality="high"
width="1000" height="800" />
</s:VGroup>
</s:Application>

flex 实现图片播放 方案二 把临时3张图片预加载放入内存的更多相关文章

  1. flex 实现图片播放 方案一 图片全部预加载放内存

    这种方案,对于web的应用有局限性,在图片量比较多,比较大的时候,就会爆浏览器异常.一般建议轻量级的采用这种方案. <?xml version="1.0" encoding= ...

  2. 再谈javascript图片预加载技术

    图片预加载技术的典型应用: 如lightbox方式展现照片,无疑需要提前获得大图的尺寸,这样才能居中定位,由于javascript无法获取img文件头数据,必须等待其加载完毕后才能获取真实的大小然后展 ...

  3. 苹果cms如何添加播放器预加载和缓冲广告

    1,来到系统后台>>系统>>播放器参数设置  可以看到添加预加载和缓冲广告的输入框.文件格式为html 自己写一个html的网页上传到网站进行调用即可.链接前面不要加http或 ...

  4. Javascript实现图片预加载【回调函数,多张图片】

    使用JS实现一组图片动画效果或者使用HTML5 Canvas渲染一系列图片等案例中,需要图片全部加载完成方可运行动画效果.此时程序中就会涉及多张图片预加载代码.当接二连三的案例中都涉及图片预加载时,就 ...

  5. Javascript兑现图片预加载【回调函数,多张图片】 (转载)

    Javascript实现图片预加载[回调函数,多张图片] 使用JS实现一组图片动画效果或者使用HTML5 Canvas渲染一系列图片等案例中,需要图片全部加载完成方可运行动画效果.此时程序中就会涉及多 ...

  6. js图片预加载与延迟加载

    图片预加载的机制原理:就是提前加载出图片来,给前端的服务器有一定的压力. 图片延迟加载的原理:为了缓解前端服务器的压力,延缓加载图片,符合条件的时候再加载图片,当然不符合的条件就不加载图片.​ 预加载 ...

  7. pyspider 示例二 升级完整版绕过懒加载,直接读取图片

    pyspider 示例二 升级完整版绕过懒加载,直接读取图片,见[升级写法处] #!/usr/bin/env python # -*- encoding: utf-8 -*- # Created on ...

  8. js 函数的多图片预加载(preload) 带插件版完整解析

    前言:         本人纯小白一个,有很多地方理解的没有各位大牛那么透彻,如有错误,请各位大牛指出斧正!小弟感激不尽.         本篇文章为您分析一下原生JS实现图片预加载效果 本篇文章写的 ...

  9. Javascript图片预加载详解

    预加载图片是提高用户体验的一个很好方法.图片预先加载到浏览器中,访问者便可顺利地在你的网站上冲浪,并享受到极快的加载速度.这对图片画廊及图片占据很大比例的网站来说十分有利,它保证了图片快速.无缝地发布 ...

随机推荐

  1. openWRT自学---针对backfire版本的主要目录和文件的作用的分析整理

    特别说明:要编译backfire版本,一定要通过svn下载:svn co svn://svn.openwrt.org/openwrt/branches/backfire,而不能使用http://dow ...

  2. hdu1533 Going Home 最小费用最大流 构造源点和汇点

    Going Home Time Limit: 10000/5000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)Total ...

  3. Spark Core源代码分析: RDD基础

    RDD RDD初始參数:上下文和一组依赖 abstract class RDD[T: ClassTag]( @transient private var sc: SparkContext, @tran ...

  4. 个人博客开发之xadmin 布局和后台样式

    项目源码下载:http://download.vhosts.cn 一. xadmin 后台配置注册信息 1. 在apps 的blogs 和 users 两个app中添加adminx.py文件 vim ...

  5. Mysql 变量讲解

    set语句的学习: 使用select定义用户变量的实践将如下语句改成select的形式: set @VAR=(select sum(amount) from penalties);我的修改: sele ...

  6. 通信协议之广播---recvfrom 放回客户端的ip地址第一次全为0.0.0.0

    遇到一个很恶心的问题. while(1) { recvfrom(sockfd, readbuff, UDP_CMD_BUFF_LENGTH - 1, 0, (struct sockaddr *)&am ...

  7. poj 2594(可相交的最小路径覆盖)

    题目链接:http://poj.org/problem?id=2594 思路:本来求最小路径覆盖是不能相交的,那么对于那些本来就可达的点怎么处理,我们可以求一次传递闭包,相当于是加边,这样我们就可以来 ...

  8. SQL Server 日期格式化输出

    转自:http://hi.baidu.com/%BC%D1%C0%D6%B1%C8%BA%A3/blog/item/fdaf6c9525adfa0f7af480ec.html T-SQL Script ...

  9. (四)DIH导入结构化数据

    (四)DIH导入结构化数据 目前大多数的应用程序将数据存储在关系数据库(如oracle.sql server .mysql等).xml文件中.对这样的数据进行搜索是很常见的应用.所谓的DataImpo ...

  10. 关于后台传来的json是含英文字母的string

    最近帮朋友写东西,遇上一个比较坑的后台,传来的json是字符串,并且还伴有英文字符,类似 callback({xxx:xxx,xxx:xxx}),我打印了一下后台传来的数据格式,发现时string,所 ...