zoukankan      html  css  js  c++  java
  • Hbuilder------窗口管理

    ------页面初始化

      在app开发中,若要使用HTML5+扩展api,必须等plusready事件发生后才能正常使用,mui将该事件封装成了mui.plusReady()方法,涉及到HTML5+的api,建议都写在mui.plusReady方法中.

      打印当前页面URL的示例:

        mui.plusReady(fouction(){

          console.log("当前页面URL:"+plus.webview.currentWebview().getURL());

            });

    ------扩展阅读:

       mui.init()     mui插件初始化
       mui.ready()     当DOM准备就绪时,指定一个函数来执行
               代码块激活字符:minit

    ------创建子页面

      在mobile app开发过程中,经常会出现共用的导航栏或者选项卡,每次打开页面都需要重新渲染,而且容易出现卡头卡尾的现象。并且此时若使用局部滚动,在android手机上会出现滚动不流畅的问题;

      mui提供的两种解决方案:
      第一种:在plus环境下,使用原生titleNView以及原生tabbar来替换页面的导航栏或者选项卡。在页面打开时,渲染已经完成,让你的应用更接近原生app。     原生titleNView参考mui.openWindow,原生tabbar可参考ask教程示例。

      第二种:通过双webview模式解决,此种情况适用于需要上下拉刷新的列表页面。将需要滚动的区域通过单独的webview实现,完全使用原生滚动。具体做法则是:将目标页面分解为主页面和内容页面,主页面显示卡头卡尾区域,比如顶部导航、底部选项卡等;内容页面显示具体需要滚动的内容,然后在主页面中调用mui.init方法初始化内容页面。如:

      mui.init({
        subpages:[{
          url:your-subpage-url,    //子页面HTML地址,支持本地地址和网络地址
          id:your-subpage-id,    //子页面标志
          styles:{
            top:subpage-top-position,     //子页面顶部位置
            bottom:subpage-bottom-position,    //子页面底部位置
            subpage-width,    //子页面宽度,默认为100%
            height:subpage-height,    //子页面高度,默认为100%
            ......
            },
            extras:{}     //额外扩展参数
            }]
           });

      参数说明:styles表示窗口属性,特别注意,height和width两个属性,即使不设置,也默认按100%计算;因此若设置了top值为非"0px"的情况,建议同时设置bottom值,否则5+ runtime根据高度100%计算,可能会造成页面真实底部超出屏幕范围的情况;left、right同理。
       index.html-----作用为显示固定导航
       list.html----显示具体列表内容,列表项的滚动实在list.html所在webview中使用原生滚动,既保证了滚动条不会穿透顶部导航,list.html是index.html的子页面。创建代码简单,如下:

        mui.init({
          subpages:[{
            url:"list.html",
            id:"list.html",
            styles:{
              top:"45px",
    //mui标题栏默认高度为45px;
              bottom:"0px"  //默认为0px,可不定义
              }
             }]
            });

    ------扩展阅读:

       代码块激活字符:misubpage

    ------打开新页面(针对web app)

  • 相关阅读:
    phpcms列表页内容如何替换?
    如何用phpcms将静态网页生成动态网页?
    简单介绍phpcms以及phpcms如何安装?
    注册账号的验证
    js跳转页面
    流程审核处理
    关于XML(可扩展标记语言)的基础知识与写法
    php随机获取验证码
    流程管理
    HDU 5894 hannnnah_j’s Biological Test
  • 原文地址:https://www.cnblogs.com/suyun1219/p/11555910.html
Copyright © 2011-2022 走看看