lufylegend:加载进度

实现图片加载进度

LoadingSample Class

用来显示进度条的对象。

引擎中目前提供的进度条类有:LoadingSample1~7

你可以制作自己的进度条,自制进度条类中要包含setProgress函数。

//初始化引擎组件
init(50, "div_caiquan", 800, 400, main);

//定义游戏层,加载进度层、游戏背景层
var loadingLayer, backLayer;

//定义游戏图片
//定义图片资源加载完成后返回的图片对象
var imglist = {};
//定义图片资源数组
var imgData = new Array(

    {name:"title",path:"../images/title.png"},
    { name: "shitou", path: "../images/shitou.png" },
    { name: "jiandao", path: "../images/jiandao.png" },
    { name: "001", path: "../images/001.jpg" },
    { name: "002", path: "../images/002.jpg" },
    { name: "003", path: "../images/003.jpg" },
    { name: "004", path: "../images/004.jpg" },
    { name: "bu", path: "../images/bu.png" }

    );

//回调函数
function main() {

    //创建背景层
    backLayer = new LSprite();

    //将背景层添加到画布
    addChild(backLayer);

    //创建加载进度层
    loadingLayer = new LoadingSample3();

    //将加载进度层添加到背景层
    backLayer.addChild(loadingLayer);

    //loadingLayer.setProgress(35);

    //加载图片资源
    LLoadManage.load(
        //图片数据数组
        imgData,
        function (progress) {
            //显示加载进度
            loadingLayer.setProgress(progress);
        },
        function (result) {

            //加载完成
            //result可以认为是一个map,资源列表中的资源可以按键获取
            imglist = result;
            //移除加载进度层
            backLayer.removeChild(loadingLayer);
            loadingLayer = null;
            //游戏初始化
            gameInit();
        }
        );
};

//游戏初始化
function gameInit() {

    //game begin

};
时间: 2024-11-09 04:35:13

lufylegend:加载进度的相关文章

Html5游戏之KiwiJs(4)-资源加载进度

Kiwi.js中资源的加载是在Kiwi.State.preload方法中进行的,而关于加载进度State中有另外一个方法loadProgress来实现,所以要实现进度百分比显示,只需要重写loadProgress方法即可. 下面是Kiwi.js的loadProgress的API说明 重写loadProgress方法 loading.loadProgress = function(percent, bytesLoaded, file){ Kiwi.State.prototype.loadProgr

网页加载进度条的实现

本次主要介绍一下网页加载进度的实现.如下图,在页面加载的时候,上方红色的进度条 网页加载进度的好处是能够更好的反应当前网页的加载进度情况,loading进度条可用动画的形式从开始0%到100%完成网页加载这一过程.但是目前的浏览器并没有提供页面加载进度方面的接口,也就是说页面还无法准确返回页面实际加载的进度,本文中我们使用jQuery来实现页面加载进度条效果. 首先我们要知道的是,目前没有任何浏览器可以直接获取正在加载对象的大小.所以我们无法通过数据大小来实现0-100%的加载显示过程. 因此我

给WebView添加漂亮的加载进度条

为了增强用户体验,所有在WebView头部给加了个进度条,看起来不错哦. 布局XMl:activity_main.xml <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent&q

【css系列】创建网页加载进度条

一.最简单或者明显的方式是使用定时器 1.在网页中加入布局覆盖真实网页内容 2.使用定时器确定加载所用时间的长短,其实并不是真正的加载进度实现 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>定时器的进度条</title> <script src="../js/jquery-3.2.1.j

网站顶部显示预加载进度条preload.js

网站加载的速度快的话,不会显示进度条加载时候的样式. 支持性主流浏览器都支持,ie浏览器需要9以上9也支持. 使用方法 <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script> <script src="js/preload.js"></script> <script type="text/javascript">

【Web前沿技术】纯 CSS3 打造的10个精美加载进度条动画

之前向大家介绍8款优秀的 jQuery 加载动画和进度条插件,今天这篇文章向大家推荐10个纯 CSS3 代码实现精美加载进度条动画效果的方案.加载动画和进度条在网站和 Web 应用中的使用非常流行,特别是在使用 Ajax 技术加载内容的应用场景中,使用时尚的加载动画和进度条告诉用户内容正在加载中是一种非常友好的方式. 您可能感兴趣的相关文章 20个非常绚丽的 CSS3 特性应用演示 23个纯 CSS3 打造的精美LOGO图案 35个让人惊讶的 CSS3 动画效果演示 推荐12个漂亮的 CSS3

pace.js和NProgress.js两个加载进度插件的一点小总结

这两个插件都是关于加载进度动画的,应该说各有特点吧,最起码对我来说是各有优势的.今天一天就捣鼓了加载进度动画,也研究了大量的(也就这两个)加载进度动画,也算对加载进度动画有了一个初步的了解了吧. NProgress.js NProgress是基于jquery的,且版本要 >1.8 API: NProgress.start() — 启动进度条 NProgress.set(0.4) — 将进度设置到具体的百分比位置 NProgress.inc() — 少量增加进度 NProgress.done() 

Chromium中网页加载进度条研究

1.     Shell.java中有成员变量:mProgressDrawable. 该成员变量在方法:onFinishInflate中被初始化. 在该类中有方法:onLoadProgressChanged,该方法中对进度条的值进行改变,并且对刷新完成事件进行反馈. 2.     上面的这个方法是在cc文件中被调用的. 上面方法对应的cc方法是shell_android.cc文件中的LoadProgressChanged方法. voidShell::LoadProgressChanged(Web

Android 自定义View修炼-自定义加载进度动画LoadingImageView

一.概述 本自定义View,是加载进度动画的自定义View,继承于ImageView来实现,主要实现蒙层加载进度的加载进度效果. 支持水平左右加载和垂直上下加载四个方向,同时也支持自定义蒙层进度颜色. 直接看下面的效果图吧. 二.效果图 废话不说,先来看看效果图吧~~ 三.实现原理方案 1.自定义View-XCLoadingImageView,继承ImageVIew来实现,这样就不用自己再处理drawable和测量的工作内容. 2.根据蒙层颜色创建一个蒙层bitmap,然后根据这个bitmap来