手机应用程序开发AppCan开发.doc

AppCan移动应用开发框架开发文档AppCan开发框架AppCan官方网址： 1、AppCan的页面1.1、页面的创建AppCan的页面使面向用户的最小屏幕单元，它只是一种推荐的页面管理方案，是一种使用HTML处理界面布局的参考，用来划分用户进行交互操作的UI界面。当然开发者也可以自己定义页面管理方案。如下图的网页大纲显示的是一个名字叫page_0的页面。 创建AppCan页面可以通过AppCan集成开发IDE中的页面创建向导进行创建。 1.2、页面的布局AppCan的页面一般由标题、内容区域和页脚组成。常见的布局方式有固定标题页脚和自适应布局两种。 固定标题页脚标题和页脚位置固定，当内容进行滚动时标题和页脚不随之滚动。当内容区域内容不能撑满一屏时，标题和页脚依然固定在最上部和最下部。如图： 如下图网页大纲所示，在页面page_0中，包含标题fixheader、页脚fixfooter和内容content部分 标题和页脚不一定必须包含于页面中，当多个页面共用一个标题或页脚时可以定义在页面外部，如下图大纲所示，两个页面page_0和page_1共用一个标题和页脚。 自适应布局自适应布局中，标题和页脚在屏幕中位置不固定，标题保持在整个网页的最上边，页脚在整个网页的最下边，随着内容区的扩大自动排列。当滚动时，标题和页脚随之滚动。 如下图网页大纲所示 页面Page_1中包含header footer和content三个部分，与固定布局方案框架保持一致，只是对应的CSS属性稍有差别。 1.3、页面间的切换一个窗体可以由多个页面组成，AppCan提供了一组基于页面切换动画效果的接口，这些页面间可以通过调用这些预制接口实现切换效果。接口封装在zy_anim.js中，开发者可引用这个文件，来实现动画效果调用。页面间的切换类型如下 左右滑入切换 上滑入/下滑出切换调用可参考如下代码 onclick=zy_anim_slide(page_0,page_1,slide_left)如果希望在动画结束后执行某项定制操作，可以在动画调用函数里指定回调函数，供动画结束后调用，可参考如下代码 function anim_cb();onclick=zy_anim_slide(page_0,page_1,slide_left,anim_cb) 1.4、页面间共用标题或页脚多个页面间可以共用一个标题和页脚，通过导航按钮，用户可以方便的实现功能的变更。如下图所示 通过共用的标题和页脚，实现内容区域的变换。如下图，范例网页大纲所示， 网页分为5个页面，这五个页面共用一个header和footer，通过点击页脚的图标实现页面的变化。 1.5、页面的色彩方案AppCan选用的是JQueryMobile的色彩方案，它提供了5套可选方案供开发者选用，黑、蓝、灰、白和黄，每一中色彩方案，分别为页面、容器和控件进行了定义。开发者可以参考这5套色彩方案，快速的添加自己的页面色彩。 更多AppCan相关信息，请关注AppCan官方网站： 2、AppCan的控件AppCan的控件是一套基于HTML5、CSS3和JavaScript的预定义代码段，开发者可以通过AppCan集成开发调试环境的向导快速的引入到界面中，并可以进行有效的配置。控件类别如下 2.1 iOS导航条AppCan提供了类iOS效果的导航条控件，并预置了6张预置图片供开发者选择。开发者可以通过替换自己的图片或者添加自己的效果类来扩展导航条。导航条支持预置的5中色彩方案。 2.2 文本输入框和文本输入域文本输入框和文本输入域使常用的用户信息录入控件，AppCan提供了封装完善的数据输入控件公开发者选用。 2.3 列表视图列表是应用开发中作为应用数据展示控件使用率最高的。AppCan提供了丰富的可配置项，开发者可以通过集成开发环境的想到快速的生成列表。 2.4 下拉列表控件下拉列表控件可以帮助用户快速的选择所选条目，减少输入频率，提高用户感受性。AppCan提供了标准的Select控件公开发者选用。 2.5 网格控件网格控件是用来平分屏幕，常作为导航条使用。 2.6 图片按钮图片按钮常作为图片预览控件使用，与网格控件组合使用可以快速的实现图片预览布局。 2.7 复选框复选框常用来进行多项选择，AppCan提供了横排与纵排两种布局的复选框组件供开发者选用。 2.8 折叠按钮折叠按钮经常用来把大段的内容进行隐藏，当用户点击时张开，这样可以在有限的界面内提供给用户更多的可用信息。AppCan提供了标准的折叠按钮，如下图所示。 2.9 按钮按钮是每个界面中都不可缺少的组件，AppCan提供了丰富的按钮样式，如下图所示。 2.10 开关按钮开关按钮是复选框的一种特殊应用，AppCan提供了类iOS效果的开关按钮供开发者选用。 2.11 单选框AppCan提供了横排与纵排两种布局的单选框组件供开发者选用。 3、JSON2ViewJSON是网络应用常用的数据格式，AppCan提供了快捷的JSON到View的转换接口，可以帮助开发者方便的管理界面，减少代码结构复杂度，提高代码质量。一般网页中使用XMLHttpRequest获取到数据后，开发者经常使用字符串拼接方法组合数据和页面标签为目标HTML代码块。AppCan提供了Data Model接口，通过设定与JSON数据格式对应的模板，快速生成目标HTML代码块，两行代码即可完成之前复杂的操作。 var tmpl = $catname;var result=zy_tmpl(tmpl,json,zy_tmpl_count(json); 如上述代码所示，开发者定义模板tmpl, 通过调用zy_tmpl接口传入模板tmpl，与模板对应的JSON数据对象json, 传入通过zy_tmpl_count获得的json中包含条目个数，直接获得目标代码段。开发者可以把用到的模板整理成外接JS文件，当界面需要修改时，只需要调整对应的模板即可完成界面效果的变化。 3.1 支持常见的几种JSON数据格式数组类型catid:16,catname:CSS3u6559u7a0b,articles:96,catid:9,catname:HTML5u8d44u8baf,articles:557 对于数组类型，需要调用zy_tmpl(tmpl,json，count)来处理。对象类型 1:catid:16,catname:CSS3u6559u7a0b,articles:96,445:catid:9,catname:HTML5u8d44u8baf,articles:557 对于数组类型，需要调用zy_tmpl(tmpl,json，count)来处理。单条数据 catid:16,catname:CSS3u6559u7a0b,articles:96对于单条数据，需要调用zy_tmpl_s(tmpl,json)来处理。 3.2 模板中支持的关键字通过模板生成网页视图时，经常用到的是ID的替换和对首尾条目进行的UI特殊处理。AppCan的Json2View接口可以通过使用关键字来帮助应用适配这种情况。$index:通过在模板中引入index关键字，JSON2View将替换$index:为索引。例如 Var tmpl=;Var data=a,b,c,d,e,f.split(,);zy_tmpl(tmpl,data,zy_tmpl_count(data); 得到的结果如下 可以看到$index:被替换为索引0,1,5$first:通过在模板中引入first关键字，可以为第一个JSON元素指定定制属性。例如 var tmpl=$first:key;var data=key:1,key:3,key:5,key:7,key:9;var c=zy_tmpl(tmpl,data,zy_tmpl_count(data); 得到的结果如下 1 可以看到当首条记录时 $first:corner_top中包含的字符串corner_top被添加到条目，而 $first:key中的key则被对应的JSON数据所替换。$last:通过在模板中引入last关键字，可以为最后一个JSON元素指定定制属性。例如 var tmpl=$last:key;var data=key:1,key:3,key:5,key:7,key:9;var c=zy_tmpl(tmpl,data,zy_tmpl_count(data); 得到的结果如下 9 可以看到当最后一条记录时 $last:corner_bottom中包含的字符串corner_bottom被添加到条目，而 $last:key中的key则被对应的JSON数据所替换。 4、代码安全简介使用HTML5+CSS+JavaScript编写应用，所有代码都是明文字符串，即使把页面打入安装包也被解压出来，很容易被非开发者查阅，因此如果在代码中需要使用私密的信息时，将会非常不安全，例如进行OAuth2验证的应用AppKey和AppSecurt Key。为了解决此问题，AppCan平台提供了专有的代码加密工具，可以快速的对HTML页面进行加密，加密后的页面只能被AppCan中间件引擎读取，避免用户私密信息的泄露。AppCan HTML页面加密工具可以在 下载。使用指南AppCan HTML加密工具为绿色软件无需安装。通过双击应用图标打开应用 点击选择文件，打开文件选择器美白的方法，单选或多选文件后，点击打开按钮，把选中的文件加入文件列表。 点击加密按钮后，完成对所选HTML页面的加密。同时会在加密文件同目录下生成同名的备份文件。注意：由于加密过程不可逆，请最好在加密前备份原始代码。 5、Config.xml文件每一个AppCan应用都会有一个Config.xml存放在其应用代码根路径下。这个Config.xml文件定义了应用的必要信息和配置。主要信息如下： 应用的基本信息如应用ID，用来作为应用的唯一标识 应用的名称，用来在开发、调试、发布时帮助开发者更直观的区分应用。 应用的控制参数-图标、默认加载页、是否支持加密、调试服务器、升级链接、背景色控制等。他设定了应用在运行时的一些处理机制和配置。 应用的版权信息-作者信息、版权摘要和链接等。Config.xml的文件结构: 所有在config.xml中出现的元素都列在默认顺序列在下方。这些定制元素能够被AppCan中间件识别。目前不允许开发者添加自定义元素。格式： 描述：定义了应用的基本关键信息。是整个config.xml的主元素。其他元素都是其子元素。属性：widgetIdAppCan保留参数appId在通过AppCan创建应用时向服务器申请的唯一标识ID.用于区分应用。channelCode3位整数，当把应用向多个发布渠道推广时，开发者可以为每个渠道自定义ID，用于在AppCan统计时能够得到分类的统计结果Version当前AppCan应用的版本.版本定位三个部分主版本 2位整数 定义应用的快速美白关键发布版本小版本 2位整数 定义版本发布后的重大变更版本修改次数 4位整数 定义版本发布后的微调版本JsproloadTrue或False可选。Symbian平台专用，定义是否开启默认UEX接口库自动引用。一般情况下不需要配置此选项。默认开启。格式： HelloWorld描述：定义了应用的名称。用于在集成开发环境、打包、后端服务器中帮助用户标识应用。属性：无格式： 这是我的第一个AppCan应用描述：定义了应用的描述，用于发布系统上提供给下载者了解应用的作用。属性：无格式： AppCan研发组描述：定义了应用的开发作者，用淘必惠于在发布系统上显示开发者信息给应用下载者。属性：Email应用开发者的Email地址。格式： 描述：定义了应用的图标，用于显示在发布系统上作为应用图标显示，同时用于在AppCan Player中标识应用。属性：src应用的默认图标名称，图标一般保存在config.xml同级目录下格式： 本程序版权属于正益无线（北京）科技开发有限公司。程序源码用于AppCan开发者研究。未经同意，不得随意拷贝传播。描述：定义了应用的基本版权信息和版权详细信息链接。属性：href应用的版权信息链接，在发布系统中，让下载者可以查看详细的版权内容格式： 描述：定义了应用的默认启动页面。属性：src应用的默认启动页面文件名。格式： 3描述：定义了开发者用于开发应用的AppCan集成调试环境的IP地址，当使用AppCan Player调试应用时，可以通过IDE环境获取到应用使用uexLog接口发出的文本信息。属性：无格式： false描述：当应用中有使用AppCan HTML加密工具的网页时，需要打开此功能，使AppCan引擎能够处理加密的HTML页面，正常的展示给用户。此属性默认为False属性：无格式： /updat