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

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

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

<script type="text/javascript">

mui("#slider").slider({

interval: 5000

});

</script>

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

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

2.问题描述:

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

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

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

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

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

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

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

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

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

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

图一

图二

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模式的选项卡,支持原生加速的下拉刷新。如下图:

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

6.问题描述:见下

解决措施:见上。

由此转入Angular框架

再分享一下我老师大神的人工智能教程吧。零基础!通俗易懂!风趣幽默!希望你也加入到我们人工智能的队伍中来!https://www.cnblogs.com/captainbed

原文地址:https://www.cnblogs.com/shaoye007/p/10147879.html

时间: 2024-10-09 18:39:16

跨平台移动APP开发进阶 三 hbuilder+mui mobile app 开发心酸路的相关文章

网站开发进阶(四十一)中文字体网页开发指南

网站开发进阶(四十一)中文字体网页开发指南 前言 字体的选择,是网页开发的关键因素之一. 合适的字体,对网页的美观度(或可读性)有着举足轻重的影响.   但是,相比英文字体,中文字体的网页开发有着极大的局限性.因为,一套中文字体最少也要有几千个字符,体积为几个MB:单单为了浏览网页,开发者不可能让用户去下载字体,只能依靠操作系统的预装字体.(*注:确实有网站提供中文字体的web服务,从技术角度,我不推荐这样做.) 不同的操作系统.不同的版本预装不同的字体(因为版权),几乎没有交集.因此,大多数开

QT开发(三十一)——NotePad实例开发

QT开发(三十一)--NotePad实例开发 一.界面开发 NotePad使用主窗口作为顶层窗口组件,使用QMainWindow作为基类,QMainWindow内部封装了菜单栏.工具栏.中央组件.停靠组件.状态栏等.QMainWindow内置了布局管理器,基本的组件布局如下: 使用二阶构造模式构建NotePad界面. MainWindow::MainWindow() {     resize(800, 600); }   MainWindow::~MainWindow() {   }   Mai

QT开发(三十)——计算器实例开发

QT开发(三十)--计算器实例开发 一.计算器界面制作 计算器界面需要QWidget组件作为顶层窗口,QLineEdit组件作为输入框,QPsuhButton作为按钮. 界面规划设计如下: #include <QApplication> #include <QWidget> #include <QLineEdit> #include <QPushButton>   int main(int argc, char *argv[]) {     QApplica

HTML5进阶 二 HBuilder实现软件自动升级

HBuilder实现软件自动升级 前言 移动APP开发好后需要实现软件自动升级功能,经过一番搜索,发现HBuilder具有"App资源在线升级更新"的功能,遂研究之. 经过一番测试,在源码思想的基础之上对其进行了优化.代码如下: var wgtVer = null; function plusReady(){ // 获取本地应用资源版本号 plus.runtime.getProperty(plus.runtime.appid,function(inf){ wgtVer=inf.vers

HTML5游戏开发进阶指南 中文pdf扫描版?

HTML5游戏开发进阶指南介绍了HTML5游戏开发的一般过程和技巧.全书共分12章,第1章介绍了本书相关的HTML5的诸多新特性,包括在canvas上绘图.播放声音等,另外还引入了子画面页的概念:第2-4章利用Box2D物理引擎开发了一款非常类似于<愤怒的小鸟>的游戏,全面介绍了物理引擎的概念,以及在游戏中使用物理引擎的方法,这一部分还引入了视差滚动技巧,以实现某种伪3D效果:第5-10章开发了一款简化版的<红色警戒>游戏,这一部分涉及了相当多的内容,包括地图的制作,建筑与单位的设

带你从零学ReactNative开发跨平台App开发(三)

经过上两篇文章的讲解,已经基本搭建起来基础环境,接下来就要真是开发了,这边文章,我想先普及一下CRNA(create-react-native-app xx)的知识,因为有不少人问过我expo方面的东西,所以实战时候第一个项目使用CRNA方式创建,然后再将其转化为原生混合模式开发 .声明,本人打算app开发中的所有接口api,由我自己来实现,并上传服务器,届时大家可以一起调用,当然实战项目肯定是会上传到github的.废话不多说,开始撸码,你准备好了吗? 介绍一款新武器-xde 采用crna模式

基于Html5 Plus + Vue + Mui 移动App开发(三)-文件操作(读取、保存、更新数据)

实全资讯采用基于Html5 Plus + Vue + Mui 移动App.主要实现功能包括: 实现搜索站点设置 实现搜索关键字定义 实现搜索资讯保存.删除功能. 主界面实现关键字搜索.预定义关键字搜索,下拉刷新,支持搜索结果保存.分享. 我的界面主要是展示自己保存的搜索资讯,支持删除.分享. 设置界面主要实现搜索站点.初始搜索关键字定义. 搜索站点目前支持:凤凰资讯.参考信息.腾讯资讯.百度资讯: 读取数据 /*读取内容*/ shiquan.readNews = function(callbac

Hbuilder mui——app微信支付

一.参数说明 登陆微信开放平台(注意是开放平台,不是公众平台):https://open.weixin.qq.com 做app首先需要在微信开放平台后台创建应用,第二步勾选ios和Android应用平台,其中Android应用需要填写应用签名.应用包名,重点就在与如何获取应用包名.应用签名.(审核和开通方式教程) 应用包名:就是Hbuilder中打包时填写的Android包名: 应用签名:如果用的是DCloud公用证书,则微信应用签名为:"59201cf6589202cb2cdab2675247

APP开发的三种模式

APP开发的三种模式:Native App .web App.hybrid App 1.原生app 使用原生app (android或iOS)开发APP.. 技术: Native技术主要用于提供原生支持,要做到跨平台,就需要掌握部分Android和iOS的知识,除了多线程,文件存储等基础知识,Android需要非常熟练的掌握WebView.WebSettings.WebChromeClient.WebClient四大对象.iOS需要非常熟练掌握UIWebView对象. 缺点:技术多,门槛高.无法