MUI框架预加载

MUI - 预加载

预加载都是在mui.init({)}中执行的

方式一:preload一次仅能预加载一个页面(除非循环)

var subWebview = mui.preload({
    url: ‘examples/accordion.html‘,
    id: ‘template_sub‘,
    top: ‘
    styles: {
        48 px ‘,
        bottom: ‘0px‘
    }
});

不设置循环,第一遍可以,第二遍开始就还是卡顿,效果很不好,特别是添加了图片,或者图片滚动

方式二:create一次仅能预加载一个页面  (除非循环)

function clicklist (id) { //list点击item后的事件
    var nwaiting = plus.nativeUI.showWaiting();//显示原生等待框
    webviewShow = plus.webview.create("show.html");//后台创建webview并打开show.html
    webviewShow.addEventListener("loaded", function() { //注册新webview的载入完成事件
        nwaiting.close(); //新webview的载入完毕后关闭等待框
        webviewShow.show("slide-in-right",150); //把新webview窗体显示出来,显示动画效果为速度150毫秒的右侧移入动画
    }, false);
}

方式三:通过mui.init方法中的preloadPages参数进行配置.可预加载多个页面,但不会返回预加载每个页面的引用(异步执行)

mui.init({
    preloadPages: [{
        url: prelaod - page - url,
        id: preload - page - id,
        extras: {
            valueArray: styles: {}, //窗口参数
            valueArray,
            productArray: productArray
        }, //自定义扩展参数,在该页面获取方式:varweb=plus.webview.currentWebview;web.valueArray
        subpages: [{}, {}] //预加载页面的子页面
    }]
});

方式四:加载子页面,通常是在原来具备【header】或者【footer】的前提下,再加载进来一个【list列表】或者【mui-content】与原页面进行合并

注:用此方法设计一次页首和页尾就行,如果在子页在设置页首和页尾的高度,则就会相比首页再次加载高度,就不好看了

subpages:
[{
    id:‘list‘,
    url:‘list.html‘,
    styles:{
        top:‘45px‘,
        bottom:0,
        bounce:‘vertical‘
    }
}]
时间: 2024-11-05 20:40:58

MUI框架预加载的相关文章

《H5 App开发》MUI框架显示加载中动画

最近使用MUI框架比较多,现在有个需求就是在每个页面加上一个加载中动画 如图: 在百度上找到两个MUI框架的加载中样式, 第一种是需要引用一个js库,在这里不多做解释,小编推荐第二种方式, 只需要一串代码就可以实现 <div class="mui-loading" v-if="loading"> <div class="mui-spinner"></div> </div> 可以利用vue中v-if来

Android 加载gif图片强大框架(支持预加载、缓存,还支持显示静态图片,一行代码全搞定)

之前项目中没有涉及到显示gif图片的功能,也没有着重研究过,最近项目中要用到显示gif图片,于是就在网上一顿搜,用过之后发现如下几个缺点. 1.加载大的gif图片会出现oom. 2.没有预加载和缓存功能,比较消耗内存. 3.功能比较单一,显示gif了但是不能显示静态图片. 最后无意间发现了一个强大的gif加载框架,能够满足上面的所有缺陷,支持预加载和缓存,同时支持显示静态图片和gif图片.下面是一些源代码: //xml布局就是一个ImageView //在需要的地方直接调用 Glide.with

pre-network android预加载网络框架

网络优化是所有app开发中非常重要的一部分,如果将网络请求前置就是在点击跳转activity之前开始网络加载那么速度将会有质的提升.也就是网络预先加载框框架. 网络预加载框架,监听式网络前置加载框架-Network preload, network preload the framework.- pre-network 框架说明 pre-network:是基于观察者模式的网络预先前置加载框架,可以对大程度优化网络加载速度:每一个网络请求相当于被观察者,只要订阅了的观察者能够拿到被观察者的实例.

mui预加载

预加载 页面正常打开步骤:先创建 -> 在显示 plus.webview.create( url, id, styles, extras ); // 创建页面 plus.webview.show( id_wvobj, aniShow, duration, showedCB, extras ); // 显示已经创建的或者隐藏的窗口 plus.webview.open( url, id, styles, aniShow, duration, showedCB ); // 创建并打开 问题:在创建打开

【原创】从零开始搭建Electron+Vue+Webpack项目框架(五)预加载和Electron自动更新

导航: (一)Electron跑起来(二)从零搭建Vue全家桶+webpack项目框架(三)Electron+Vue+Webpack,联合调试整个项目(四)Electron配置润色(五)预加载及自动更新(六)构建.发布整个项目(包括client和web)(未完待续) 摘要:到目前为止,我们的项目已经具备了PC客户端该有的一些基础功能和调试环境,但是总感觉缺了灵魂,那就是结合实际项目.实际业务的细节处理,缺着吧...这篇文章就介绍一下预加载和自动更新,文字功底有限,如有介绍的不清楚的地方,欢迎留言

没错预加载就是这么简单

之前项目中遇到图片加载问题,首先想到异步加载 ,接着想用什么框架,框架很多,我用的是volley,感觉挺方便的,废话不多说,记录一下自己的错误然后接着前行,用volley的时候虽然出现了效果,但是在出现默认图片之前还是出现几秒让人难以忍受的空白,不得不靠. 上代码: /** 在刷屏页 创建任务: private void getData(){ ReadImgTask task = new ReadImgTask(); task.execute(); } 接着: /** * 预加载跑马灯图片 *

jQuery图片预加载

jQuery图片预加载早已不是什么新鲜的技术,比如在图片轮播(一些hover事件中)时为了提高图片加载速度,这就需要用到图片预加载技术,这样图片的切换就显得流畅,这样做一定意义上提升了用户体验.我们简单看看实现方法及简单的说明:UI前端框架最新力作!有奖试读 .代码   var img = $('<img />').attr('src', 'imageurl.jpg'); jQuery创建了一个图片元素并设置了它的地址,如果将它放在document ready中处理时,当页面加载时就会告诉浏览

ViewPager的刷新、限制预加载、缓存所有

[框架]: 公共部分:左侧菜单.TitleBar.RadioGroup(3个RadioButton:X.Y.Z) 选择X页面:指示器+ViewPager [要达成的效果]: (1)左侧选择A,进入X页面,X1联网刷新页面,此时禁止X2预加载—>滑动到X2页面,X2才联网刷新—>X3—>X4: (2)从X4再滑到X3.X2.X1时,X1.X2.X3不需要再次刷新,假设停留在X2页面: (3)左侧再点选择B,或者先点Y再点选择B再点X,这时候X2联网刷新: (4)X2页面滑到X1.X3.X4

Cocos2d-x 精灵图片预加载中不会出现重复加载问题

为了应对大量精灵图片的加载问题,cocos2d-x提供了精灵数据的异步预加载机制,这是要是借助于CCTextureCache::addImageAsync函数来实现的. 那么,当使用上述函数多次加载同一个精灵图片文件时,是否会出现加载多次呢?不会的. 让我们来分析一下上述函数的关键部分代码: void CCTextureCache::addImageAsync(const char *path, CCObject *target, SEL_CallFuncO selector) { #ifdef