apicloud教程2 (转载)
本帖最后由 中山赢友网络科技有限公司 于 2015-10-17 15:38 编辑
继《APICloud之小白图解教程系列(一):认识APICloud》之后的第二篇教程。 本篇教程有以下知识点: 1、APICloud Studio的介绍和常用快捷键的使用 3、优化官方的fixStatusBar方法,实现兼容性状态栏处理! 工欲善其事,必先利其器:APICloud Studio的使用介绍及常用快捷键使用 APICloud Studio是官方推荐IDE编辑器,也就是我们开发APP的软件工具,内置了调试,编译,文档,提示,实时预览等功能,可以帮助我们快速的开发APP。该软件的使用也不用多说,现在给大家介绍一下APICloud Studio一些常用的快捷键,可以帮助大家快速开发。首先我下载的是2015年10月16号最新的包,版本为:APICloud_SDK_v1.1.41。APICloud Studio的版本为:APICloud-Studio_1.2.2。 常用快捷键有: Ctrl+Z:撤销 流布局:目前非常火的前端开发布局方式 移动开发布局最火的就是Flexbox流布局,也叫伸缩布局。详细教程可以看:http://www.w3cplus.com/css3/css3-flexbox-layout.html 1、新建APICloud项目:目前我们就新建一个APICloud的项目,模板选空白应用(我们要从基本的布局开始学习):如图所示: <ignore_js_op> 2、更新并提交代码(养成这个习惯),如图所示 <ignore_js_op> 3、删除默认的代码,保留干净的编辑环境,保留css,和js文件!如图所示: 4、实现简单的APP页面三栏布局,如图所示: 大家观察上面图片,可以清楚看出三块结构,那我们应该创建一个父容器包裹着三个div(头,中间,底)(推荐使用div+css布局哦,table就不推荐了!)表示,如:
复制代码 2、添加CSS样式,将id为main的区域变为自动伸缩布局,头和尾部固定,样式如下:
复制代码 图片如下: <ignore_js_op> 好了,简单的三栏布局以及完毕。 5、在Index页面创建Frame,也就是在Main区域打开。在打开之前先说明一些注意的东西,我相信很多朋友在学习的时候都碰到过IOS或Android状态栏遮住问题,或者想实现状态栏沉浸式效果,那你需要做下面几件事情: 1)、在根目录下面的config.xml配置文件中添加以下代码:
复制代码 2)优化官方的fixStatusBar代码,通过这个代码就可以兼容以前版本和未来版本状态栏问题!包括IOS和Android版本!
复制代码 3)创建并打开main框架,也就是页面的主体
复制代码 6、直接使用快捷的Ctrl+R真机运行就可以看到效果了。如果想看沉浸式的效果,可以云编译或者编译自定义Loader使用(快捷键为Ctrl+W),新版本直接真机调试也可以看到了。,如下图: <ignore_js_op> 好了简单的布局页面完成。
复制代码 |
apicloud教程2 (转载)的更多相关文章
- HttpClient 4.3教程(转载)
HttpClient 4.3教程(转载) 转自:http://www.yeetrack.com/?p=779 前言 Http协议应该是互联网中最重要的协议.持续增长的web服务.可联网的家用电器等都在 ...
- 深入浅出Git教程【转载】转载
深入浅出Git教程(转载) 目录 一.版本控制概要 1.1.什么是版本控制 1.2.常用术语 1.3.常见的版本控制器 1.4.版本控制分类 1.4.1.本地版本控制 1.4.2.集中版本控制 1 ...
- apicloud教程3 (转载)
本帖最后由 中山赢友网络科技有限公司 于 2015-10-26 16:44 编辑 继<APICloud之小白图解教程系列(一):认识APICloud><APICloud之小白图解教程 ...
- apicloud教程1 (转载)
非常感谢APICloud官方给我版主职位,每天都看到很多朋友提出很多问题,我就借此机会写了一系列的教程,帮助大家从小白到高手之路.系列名称:<APICloud之小白图解教程系列>,会不定时 ...
- jQuery官方基础教程笔记(转载)
本文转载于阮一峰的博文,内容基础,结构清晰,是jquery入门不可多得的资料,非常好,赞一个. 阮一峰:jQuery官方基础教程笔记 jQuery是目前使用最广泛的javascript函数库. 据统计 ...
- Node初学者入门,一本全面的NodeJS教程(转载)
分类 JS学习 发布 ourjs 2013-12-02 注意 转载须保留原文链接,译文链接,作者译者等信息. 作者: Manuel Kiessling 翻译: goddyzhao &a ...
- GitHub这么火,程序员你不学学吗? 超简单入门教程 【转载】
本GitHub教程旨在能够帮助大家快速入门学习使用GitHub. 本文章由做全栈攻城狮-写代码也要读书,爱全栈,更爱生活.原创.如有转载,请注明出处. GitHub是什么? GitHub首先是个分布式 ...
- Make 命令教程(转载)
代码变成可执行文件,叫做编译(compile):先编译这个,还是先编译那个(即编译的安排),叫做构建(build). Make是最常用的构建工具,诞生于1977年,主要用于C语言的项目.但是实际上 , ...
- StoryBoard不使用AutoLayout情况下 按比例快速兼容适配iPhone6/6 Plus教程【转载】
StoryBoard不使用AutoLayout情况下 按比例快速兼容适配iPhone6/6 Plus教程[转] 声明:本文章是为了后期快速兼容6和6Plus的按比例放大方法,对于部分读者来说可能觉得该 ...
随机推荐
- Node.js:常用工具util
概要:本篇博客的主要内容是介绍node.js的常用工具util. 1.util.inherits util.inherits(constructor,superConstructor)是一个实现对象间 ...
- 【Python】Python&&MySQL
按照廖雪峰的官方网站http://www.liaoxuefeng.com/中给的步骤做的,但还是出现了一些问题: 1.安装MySQL时候,提示我没有安装Python3.4,我电脑安装的3.3,所以直接 ...
- Opencv常用函数
一.图像读写与简单处理 1. Mat cv::imread(const String& filename, int flags=IMREAD_COLOR). imread函数加载filenam ...
- bug记录_signalr执行$.connnection.testhub结果为空
最后发现配置文件<appSettings>中多了一句<add key="owin:AutomaticAppStartup" value="false&q ...
- kettle连接Hive中数据导入导出(6)
1.hive往外写数据 http://wiki.pentaho.com/display/BAD/Extracting+Data+from+Hive+to+Load+an+RDBMS 连接hive
- JSP中 JSTL
1,JSTL是JSP的标准标签库的简称,JSP标准标签库包括5类:分别是核心标签库,国际化标签库,SQL标签库,XML标签库,函数标签库: 2,常用的就是核心标签库和SQL标签库: 核心标签库:前置名 ...
- NOIP2014-普及组复赛-第一题-珠心算测验
题目描述 Description 珠心算是一种通过在脑中模拟算盘变化来完成快速运算的一种计算技术.珠心算训练,既能够开发智力,又能够为日常生活带来很多便利,因而在很多学校得到普及. 某学校的珠心算老师 ...
- ****ural 1141. RSA Attack(RSA加密,扩展欧几里得算法)
1141. RSA Attack Time limit: 1.0 secondMemory limit: 64 MB The RSA problem is the following: given a ...
- SEO优化技巧总结
SEO优化技巧总结 一:了解搜索引擎 基础知识 搜索引擎:由蜘蛛程序沿着链接爬行和抓取网上的大量页面,存进数据库,经过预处理,用户在搜索框 输入关键词后,搜索引擎排序从数据库中挑选出符合搜索关键词要求 ...
- Mybatis批量更新数据
转载:http://blog.csdn.net/tolcf/article/details/39213217 第一种方式 <update id="updateBatch" p ...