flex 实现图片播放 方案二 把临时3张图片预加载放入内存
该方案,是预加载:前一张,当前,下一张图片,一共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张图片预加载放入内存的更多相关文章
- flex 实现图片播放 方案一 图片全部预加载放内存
这种方案,对于web的应用有局限性,在图片量比较多,比较大的时候,就会爆浏览器异常.一般建议轻量级的采用这种方案. <?xml version="1.0" encoding= ...
- 再谈javascript图片预加载技术
图片预加载技术的典型应用: 如lightbox方式展现照片,无疑需要提前获得大图的尺寸,这样才能居中定位,由于javascript无法获取img文件头数据,必须等待其加载完毕后才能获取真实的大小然后展 ...
- 苹果cms如何添加播放器预加载和缓冲广告
1,来到系统后台>>系统>>播放器参数设置 可以看到添加预加载和缓冲广告的输入框.文件格式为html 自己写一个html的网页上传到网站进行调用即可.链接前面不要加http或 ...
- Javascript实现图片预加载【回调函数,多张图片】
使用JS实现一组图片动画效果或者使用HTML5 Canvas渲染一系列图片等案例中,需要图片全部加载完成方可运行动画效果.此时程序中就会涉及多张图片预加载代码.当接二连三的案例中都涉及图片预加载时,就 ...
- Javascript兑现图片预加载【回调函数,多张图片】 (转载)
Javascript实现图片预加载[回调函数,多张图片] 使用JS实现一组图片动画效果或者使用HTML5 Canvas渲染一系列图片等案例中,需要图片全部加载完成方可运行动画效果.此时程序中就会涉及多 ...
- js图片预加载与延迟加载
图片预加载的机制原理:就是提前加载出图片来,给前端的服务器有一定的压力. 图片延迟加载的原理:为了缓解前端服务器的压力,延缓加载图片,符合条件的时候再加载图片,当然不符合的条件就不加载图片. 预加载 ...
- pyspider 示例二 升级完整版绕过懒加载,直接读取图片
pyspider 示例二 升级完整版绕过懒加载,直接读取图片,见[升级写法处] #!/usr/bin/env python # -*- encoding: utf-8 -*- # Created on ...
- js 函数的多图片预加载(preload) 带插件版完整解析
前言: 本人纯小白一个,有很多地方理解的没有各位大牛那么透彻,如有错误,请各位大牛指出斧正!小弟感激不尽. 本篇文章为您分析一下原生JS实现图片预加载效果 本篇文章写的 ...
- Javascript图片预加载详解
预加载图片是提高用户体验的一个很好方法.图片预先加载到浏览器中,访问者便可顺利地在你的网站上冲浪,并享受到极快的加载速度.这对图片画廊及图片占据很大比例的网站来说十分有利,它保证了图片快速.无缝地发布 ...
随机推荐
- centos httpd服务做yum本地源,以及安装Mysql
step0 首先centos的iso文件是有两张的,dvd1和dvd2,dvd2是额外的软件,常有的一些软件都在dvd1里面,而且repodata配置文件也在dvd1里面,如果直接把dvd2当做镜像文 ...
- ffmpeg 错误系统
avcodec_decode_video2. returns -1094995529. #define AVERROR_INVALIDDATA FFERRTAG( 'I','N','D','A') ...
- ECharts:企业报表工具
ECharts.纯Javascript图表库,基于Canvas,底层依赖ZRender.商业产品经常使用图表库,提供直观,生动.可交互,可个性化定制的数据可视化图表.创新的拖拽重计算.数据视图.值域漫 ...
- poj 1270(dfs+拓扑排序)
题目链接:http://poj.org/problem?id=1270 思路:就是一简单的dfs+拓扑排序,然后就是按字典序输出所有的情况. http://paste.ubuntu.com/59872 ...
- Netdata安装和使用(Linux 性能实时监测工具)
Netdata 是一款 Linux 性能实时监测工具..以web的可视化方式展示系统及应用程序的实时运行状态(包括cpu.内存.硬盘输入/输出.网络等linux性能的数据). Netdata文档地址: ...
- ionic + cordova 环境搭建
1.安装nodejs:官网下载安装包,双击安装即可.成功后在控制台输入node -v 显示版本号即成功. 2.安装Java,配置环境变量,下载安卓sdk ,配置环境变量 ANDROID_HOME 为s ...
- 最详细的PHP flush()与ob
buffer ---- flush()buffer是一个内存地址空间,Linux系统默认大小一般为4096(1kb),即一个内存页.主要用于存储速度不同步的设备或者优先级不同的 设备之间传办理数据的区 ...
- [Spring Data MongoDB]学习笔记--牛逼的MongoTemplate
MongoTemplate是数据库和代码之间的接口,对数据库的操作都在它里面. 注:MongoTemplate是线程安全的. MongoTemplate实现了interface MongoOperat ...
- Convert.ToInt32(string '000000003') 变成了 3
Convert.ToInt32(string '000000003') 变成了 3 但是在查询的时候需要用的是string 这里的convert.toint32 反而起了坏作用,不是所有的时候都要用c ...
- MySQL中常用字符串函数
1.字符串长度函数CHAR_LENGTH(str),LENGTH(str) CHAR_LENGTH()返回值为字符串str的长度,长度的单位为字符.一个多字节字符算作一个单字符.对于一个包含五个二字 ...