跨平台移动APP开发进阶(三):hbuilder+mui mobile app 开发心酸路

跨平台移动APP开发进阶(三):hbuilder+mui mobile app 开发心酸路1.问题描述:在实现图片轮转时,若将mui(“#slider”).slider({interval:5000});置于图片加载之前,图片不会显示,解决措施:将其置于图片显示之后才会显示。2.问题描述:同上面的问题,会遇到报指针为null的异常。若要获取一个组件的id,可能带获取的组件还未加载,导致获取失败。解决措施:将获取组件id的js脚本

大家好,又见面了,我是你们的朋友全栈君。

注:请点击此处进行充电!​

1.问题描述在实现图片轮转时,若将

<script type="text/javascript">

mui("#slider").slider({

interval: 5000

});

</script>

置于图片加载之前,图片不会显示,

解决措施:将其置于图片显示之后才会显示。

2.问题描述: 跨平台移动APP开发进阶(三):hbuilder+mui mobile app 开发心酸路

同上面的问题,会遇到报指针为null的异常。若要获取一个组件的id,可能带获取的组件还未加载,导致获取失败。

解决措施:将获取组件id的js脚本在定义组件id之后完成。

3.问题描述:页面是由主页面加内容页面组合而成。在主页面做弹出菜单时,弹出菜单无法显示。

问题根源:内容页面遮挡了弹出菜单,致其无法显示。

解决措施:弹出层放在内容页面里,父页面通知内容页面来显示。(使用遮罩蒙版技术解决)

注:在popover、侧滑菜单等界面,经常会用到蒙版遮罩;比如popover弹出后,除popover控件外的其它区域都会遮罩一层蒙版,用户点击蒙版不会触发蒙版下方的逻辑,而会关闭popover同时关闭蒙版;再比如侧滑菜单界面,菜单划出后,除侧滑菜单之外的其它区域都会遮罩一层蒙版,用户点击蒙版会关闭侧滑菜单同时关闭蒙版。

这是一个跨webview的popover示例,在父webview中,点击后通过自定义事件通知子webview,子webview再执行popover的显示隐藏逻辑;

思想来源于Hbuilder群,启发了自己。通过HBuilder自带的示例可以很好的解决自己遇到的问题。

折腾了将近一天这个问题还是没能得到解决!弹出菜单还是被内容页面遮挡。如图一所示,其实自己是想实现图二:

疑惑:父页面如何与内容页面传递数据?

  跨平台移动APP开发进阶(三):hbuilder+mui mobile app 开发心酸路

图一

跨平台移动APP开发进阶(三):hbuilder+mui mobile app 开发心酸路

                 图二

4.问题描述:一个view有诸多button,可不可以通过一个函数判断点击的是哪一个button?并获取其id

解决措施

//on中参数的含义依次为事件、选择器、参数、方法,其中选择器与参数为可选项

mui(‘.mui-content’).on(‘tap’,‘body’,function(){

   alert(this.id);// (根据id判断是哪一个button)

})

总结:mui中的方法都是封装的jquery,所以自己还得从jquery着手,因为好多方法不会用,不知道参数的含义。

 

5.问题描述:由于index页面的顶部导航栏与分类页面的头顶部导航栏相同,header和content在不同的webview中。我想提升代码的复用性(即多个content页面均使用同一个header页面),如何解决?Mui能够做到吗?

解决措施:使用webview模式选项卡。何谓webview模式?其实就是每个选项卡内容都是一个独立的webview,彼此之间互相独立、互不影响; 对于较为复杂的业务系统,推荐使用该模式。另外,基于webview模式的选项卡,支持原生加速的下拉刷新。如下图:

 跨平台移动APP开发进阶(三):hbuilder+mui mobile app 开发心酸路

感触:其实很多问题都可以从Hello mui demo 中得到答案。自己要经常操作以求更加熟悉。

6.问题描述:见下

跨平台移动APP开发进阶(三):hbuilder+mui mobile app 开发心酸路

解决措施:见上。

由此转入Angular框架 

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/138266.html原文链接:https://javaforall.net

(0)
上一篇 2022年5月31日 下午6:36
下一篇 2022年5月31日 下午6:36


相关推荐

  • 专门下载激活成功教程软件的网站_激活成功教程软件下载网址

    专门下载激活成功教程软件的网站_激活成功教程软件下载网址今天想给大家推荐一些免费下载激活成功教程软件的网站,希望能帮助到大家!第一个要推荐的就CSDN自己的下载资源网站:https://download.csdn.net/推荐的原因主要是资源够全,一般网上有的这里都有,而且下载的时候能看到其他下载者的真实评价,但是有点不好的就是对新人不太友好,虽然有很多免积分的,但是一些新的资源都需要积分,不过人人为我,我为人人,在这里赚扣分也是很简单的事,只要你能上…

    2022年10月12日
    5
  • Java——JCF简介

    Java——JCF简介JCF 简介 JCF JavaCollecti Java 容器框架 一 Collection 和 CollectionFr 容器 能够存放数据的空间结构数组 多维数组 只能线性存放列表 散列集 树 容器框架 为表示和操作容器二规定的一种标准体系结构对外的接口 容器中能存放的抽象数据类型接口的实现 可复用的数据结构算法 对数据的

    2026年3月19日
    3
  • mysql数据库数据迁移操作「建议收藏」

    mysql数据库数据迁移操作「建议收藏」1.新建一个需要迁移的数据库2.进行数据迁移迁移步骤:1.工具–>点击数据传输,选择需要被导的数据库,和导入的数据库看到了吗以及导入成功了

    2022年7月3日
    32
  • 带你重新认识ZooKeeper!云浮java培训班

    带你重新认识ZooKeeper!云浮java培训班1关于MySQL,面试官会问哪些问题?第一个:MySQ性能优化最佳实践21个(有具体的解释)你知道哪些?为查询缓存优化你的查询EXPLAIN你的SELECT查询当只要一行数据时使用LIMIT1为搜索字段建索引在Join表的时候使用相当类型的例,并将其索引千万不要ORDERBYRAND()避免SELECT*永远为每张表设置一个ID使用ENUM而不是VARCHAR从PROCEDUREANALYSE()取得建议尽可能

    2022年7月9日
    24
  • 报表开发流程

    报表开发流程报表开发是数据分析师的常见工作之一 报表是业务监控必备工具之一 用数据说话 另一方面 报表监控的指标通常都是业务相关的重要指标 做报表的过程也是深入了解业务的过程 把数据分析分为 描述 解释 预测 控制 4 个层级 那么报表开发就对应 描述 这一层级 也就是要做到准确 及时地监控业务数据 描述 解释是最常见的工作内容本文梳理报表开发的主要流程及注意事项 在不同的实际操作场景下涉及到

    2026年3月26日
    2
  • CentOS安装python-dev,python-devel[通俗易懂]

    CentOS安装python-dev,python-devel[通俗易懂]说明安装Python-dev,但是在centos上面没有该包.[root@masteraudiotools-3.0]#yuminstallpython-dev已加载插件:fastestmirrorLoadingmirrorspeedsfromcachedhostfile*base:mirrors.163.com*extras:centos.ustc.edu.cn*updates:mirrors.163.com没有可用软件包python-dev。原

    2022年6月22日
    160

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号