该方案,是预加载:前一张,当前,下一张图片,一共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. Math函数的"四舍五入",Floor,Ceiling,Round的一些注意事项!

    1.Math.Round:四舍六入五取偶 引用内容 Math.Round(0.0) //0Math.Round(0.1) //0Math.Round(0.2) //0Math.Round(0.3) / ...

  2. python笔记1,语法,函数,类和实例,异常

    >>> int(12.34) 12 >>> float('12.34') 12.34 >>> str(1.23) '1.23' >>& ...

  3. 解决Bootstrap 试用手机端 布满全屏

    @media (max-width: 767px) { body{ margin: 0; padding: 0; } } @media (max-width: 970px) { body{ margi ...

  4. 【转】锤子CTO钱晨:福利好是一种堕落的公司文化

    “这是拉勾网对锤子科技CTO钱晨的访谈,作为中国手机界三大产品经理之一,他带领着一众硬件工程师在手机红海中厮杀.钱晨喜欢焦虑的工程师,佩服有方向感的人. 本文作者:西岳 拉勾网原创出品,转载请注明作者 ...

  5. 基于python的七种经典排序算法(转)

    一.排序的基本概念和分类 所谓排序,就是使一串记录,按照其中的某个或某些关键字的大小,递增或递减的排列起来的操作.排序算法,就是如何使得记录按照要求排列的方法. 排序的稳定性:经过某种排序后,如果两个 ...

  6. ASP.NET动态网站制作(29)-- 正则

    前言:继续讲框架,然后介绍正则的相关知识. 内容: 1.封装分页方法,方便以后调用:响应的CSS代码也可以封装. 2.WEB层里面的页面名称不要和model和dal里面的名称相同. 3.两个表联合查询 ...

  7. Docker入门与应用系列(一)介绍与部署

    Docker介绍 Docker 是一个开源的应用容器引擎,让开发者可以打包他们的应用以及依赖包到一个可移植的容器中,然后发布到任何流行的 Linux 机器上,也可以实现虚拟化.容器是完全使用沙箱机制, ...

  8. Unity3d 子线程能做的事

    一,子线程中能做的事: 1,数据逻辑方面计算: 二,子线程中,不能: 1,加载场景相关事件: Application.LoadLevelAsync.Application.LoadLevel等: 2, ...

  9. 关于spring MVC中加载多个validator的方法。

    首先讲下什么叫做validator: validator是验证器,可以验证后台接受的数据,对数据做校验. SpringMVC服务器验证有两种方式,一种是基于Validator接口,一种是使用Annot ...

  10. mysql编译参数详解(./configure)

    1.--prefix=PREFIX:指定程序安装路径: 2.--enable-assembler:使用汇编模式:(文档说明:compiling in x86 (and sparc) versions  ...