web开发者一步一步开发app
关注
分享
扫一扫
擅长做web开发的技术们，在未接触app原生开发的情况下，也可以做app开发，就是所谓的混合开发技术。本专栏，带您利用html5 plus技术，从web开发者的角度，来做app。原来app开发可以这样来玩。
KnuthZ
开发唯快不破
QQ 260737830
展开
-
WEB开发者之混合开发APP（十二）， 页面间的参数传递方式
混合开发app中，页面之间的参数传递方式，主要使用一下两种。1. 新建页面的参数传递传递参数：//获取商品分类idvar id = '121212';//直接打开产品分类页面,传递参数pidmui.openWindow({ url:'products.html', id:'products.html', extras:{ pid:id ...原创 2018-06-29 19:08:15 · 1150 阅读 · 0 评论 -
WEB开发者之混合开发APP（九）， 商城案例--商城分类页(products.html)
由商城首页，进入商城分类页的方法，已经在上一篇博文中说过，核心代码如下：//获取商品分类idvar id = this.getAttribute("data-id");//直接打开产品分类页面mui.openWindow({ url:'products.html', id:'products.html', extras:{ pid:id }});...原创 2018-06-29 18:52:03 · 1361 阅读 · 0 评论 -
WEB开发者之混合开发APP（八）， 商城案例--商城首页(shop.html)
结合以前的知识点，做一个商城App的几个页面。 开发工具：Hbuilder，前端框架：mui，类型：混合开发App.1. 商城app效果图：商城首页商城分类页商品详情页商品兑换页2. 代码部分2.1 商城首页shop.html，部分代码说明：页面布局：<!DOCTYPE html><h...原创 2018-06-28 15:09:03 · 2465 阅读 · 0 评论 -
WEB开发者之混合开发APP（七）， 预加载和自定义事件
混合开发App同h5页面开发，完全不同之一就是预加载技术。因为不可能所有的页面打开时，都需要重新创建， （1） 每次重新创建页面，耗费性能； （2）新建页面时，如果加载耗时较长，则会出现类似白屏问题，体验极差。预加载和自定义事件，就可以解决这类问题。 （1）通过页面预加载，提前将页面内容加载完毕； （2）触发页面的自定义事件，处理数据； （3）...原创 2018-06-27 16:46:37 · 769 阅读 · 0 评论 -
WEB开发者之混合开发APP（六）， 下拉刷新
下拉刷新，本文只介绍下拉刷新重置页面的情况。同上一篇博文一样，笔者介绍两种形式的下拉刷新方法。1. mui下拉刷新1.1 相对固定的页面结构<div id="pullrefresh" class="mui-content mui-scroll-wrapper"> <div class="mui-scroll"&a原创 2018-06-27 16:02:30 · 689 阅读 · 0 评论 -
WEB开发者之混合开发APP（五）， 上拉加载
本文介绍2种方式的上拉加载实现。mui的上拉加载mui的上拉加载和下拉刷新类似，都属于pullRefresh插件，使用过程如下：1、页面滚动到底，显示“正在加载...”提示（mui框架提供）2、执行加载业务数据逻辑（开发者提供）3、加载完毕，隐藏"正在加载"提示（mui框架提供）1.1 相对固定的页面结构&amp原创 2018-06-27 10:34:54 · 487 阅读 · 0 评论 -
WEB开发者之混合开发APP（一），概述
WEB开发者，直接入手app原生开发的门槛较高，但是找到优秀的app混合开发工具，再加上详细丰富的文档说明，则可以相对容易的开发出高质量的app，性能堪比原生app性能。 开发工具来自dcloud官网，http://www.dcloud.io/index.html 开发工具叫Hbuilder，飞速编码的极客工具。技术规范采用HTML5 Plus规范。通过...原创 2018-06-24 11:23:03 · 1014 阅读 · 0 评论 -
WEB开发者之混合开发APP（二），Hbuilder使用
开发IDE下载，可进入官网下载，http://www.dcloud.io/，安装完毕后，打开工具如下图：1. 新建项目，APP开发，请选择【移动App】。2. 视图，常用的显示控制台，搜索等视图。3. 人性化视觉主题设置。4. 发行，可打包原生App，云打包后自动下载到本地，可打包Android apk， iOS ipa。打包成功后，5. 真机运行，用数据线连接安卓和苹果手机后，可直接真机运行调...原创 2018-06-24 17:34:28 · 1877 阅读 · 0 评论 -
WEB开发者之混合开发APP（三），manifest.json
混合开发APP，不得不知manifest.json.新建项目后，工程中会有一个文件，manifest.json。以下说明，比较重要：1. 应用信息，描述App应用的基本信息，应用名称，版本号，页面入口（一般是index.html，就是打开App后的第一个页面）2. App图标配置，就是App安装到手机后显示的图标。技巧，可在选择源图片的地方上传1024*1024像素的图片，点击【自动生成所有图标并...原创 2018-06-24 18:00:11 · 1894 阅读 · 0 评论 -
WEB开发者之混合开发APP（四），index.html 首页
App项目的首页，index.html.首页显示效果和样式的部分，不在此讨论，本项目采用的是mui框架。 mui框架（http://www.dcloud.io/mui.html）也是dcloud公司团队的框架，使用该框架的优点，1，以iOS 7为基础，补充部分Android特有控件，显示为原生UI效果；2.mui的窗口的管理，事件管理，ajax,上拉加载，下拉刷新等功能强大。笔者认为，第2点...原创 2018-06-24 19:21:36 · 1779 阅读 · 0 评论