• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com专业计算机教程网站
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure
您的位置:首页 > 网页设计 >HBuilder教程 > HBuilder开发App教程-推开前端开发App的大门

HBuilder开发App教程-推开前端开发App的大门

作者:教程 字体:[增加 减小] 来源:互联网 时间:2017-05-31

本文主要包含hbuilder开发app,hbuilder打包app,hbuilder开发app教程,hbuilder app教程,hbuilder制作app等相关知识,教程希望在学习及工作中可以帮助到您
"); </div>

HBuilder开发App教程-推开前端开发App的大门

奇妙的前端,奇妙的js

众所周知,自从js有nodejs后,前端人员可以华丽的转身,去开发高并发非阻塞的服务端程序,

随着html5的出现,伴随一些amazing的特性,h5开发app的技术越发的成熟,

自从2008年国外推出phonegap后,前端人员又踏上开发app的路程,

今年来国内也对应推出了一些可以让前端人员开发app的ide,

不过大部分是收费的,强定制的,这里就不一一列举了。

这里推荐DCloud推出的HBuilder,一句话谁用谁知道。


一次开发两种app

通过HBuilder的云端打包技术(也可以放到本地),

你只需要写html+js+css即可开发出app,

并且是一次开发,即可生成android和ios两种对应app。


原理介绍-ui层

app中的ui对应html中的ui,你可以自行选择ui框架,

无论是bootstrap还是amazeui,还是jquery mobi(phonegap推荐ui),

还是HBuilder推荐的mui都可以,

这里建议使用HBuilder推荐的mui,

因为封装了一部分nativejs的东西,

而且HBuilder也封装了mui的快捷键,使用起来很方便。

总结一下,就是用html层次的ui框架来实现(模拟)app中的ui。

点这里下载官方mui-app:http://www.dcloud.io/hellomui/


原理介绍-nativejs

HBuilder开发app,不可避免的是调用android和ios中的原生方法,

大概原理如下:
 

  1. qiao.ng.toast = function(msg){ 
  2. // for ios 
  3. if(window.WebViewJavascriptBridge){ 
  4. WebViewJavascriptBridge.sendMessage('showSystemToast$' + msg); 
  5. }else{ 
  6. document.addEventListener('WebViewJavascriptBridgeReady',function onBridgeReady(){ 

您可能想查找下面的文章:

  • Hbuilder移动app 开发微信支付-前后端要点
  • HBuilder制作的APP怎么连接SQLServer数据库!
  • HBuilder开发App教程-定制图标,启动页以及打包
  • HBuilder开发App教程-推开前端开发App的大门

相关文章

  • 2017-05-31分享基于plus.downloader的图片懒加载功能,支持本地缓存
  • 2017-05-31HTML加密混淆、源码保护、代码安全,防止解压直接看源码
  • 2017-05-31为什么HBuilder变卡了,响应变慢了
  • 2017-05-31Hbuilder 常用快捷键汇总
  • 2017-05-31HBuilder 入门(5) / 编写一个登录页面 - Ajax交互
  • 2017-05-31MUI新手指南
  • 2017-05-31Hbuilder MUI积分兑换页面
  • 2017-05-31HBuilder mui 如何判断网络是否连接
  • 2017-05-31再谈webview,从小白变“大神”!-mui入门到精通(四)
  • 2017-05-31mui.init方法配置

文章分类

  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure

最近更新的内容

    • MUI的input搜索框里的清除按钮的点击监听事件,JS,JQ及时监听input值的变化
    • HBuilder mui 基于MUI的移动端数字密码键盘
    • mui H5游戏平台完整源码
    • Uncaught TypeError: Cannot read property 'value' of undefined at js/mui.min.js:9;
    • 重写h5+在线升级版本比较代码
    • webview启动速度优化及事件顺序解析
    • Hbuilder MUI 分享插件开发指南
    • 再谈webview,从小白变“大神”!-mui入门到精通(四)
    • Hbuilder MUI 微信支付、分享、登陆说明
    • Hbuilder MUI拨打客服电话js代码

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有