基于wex5的新闻类html5 app开发和设计

《基于wex5的新闻类html5 app开发和设计》由会员上传分享，免费在线阅读，更多相关内容在学术论文-天天文库。

1、基于WeX5的新闻类HTML5App开发和设计　　本文是基于WeX5工具来开发的新闻类的HTML5App，利用MySQL数据库来分类储存数据，WeX5在制作app具有、快速开发、多端运行、开源免费等优点。　　【关键词】WeX5数据库HTML5App　　1WeX5工具　　WeX5是一款免费开源跨端HybridApp的开发工具。WeX5具有可视化、快速开发、多端运行、开源免费等优点。　　1.1快速开发　　WeX5页面组件是可视化页面设计，以模块化形式快速开发，开发、编程、调试是一体化集成开发环境，并且不需要原声开发经验即可使用。　　1.2多端运行　　WeX5支持Android端a

2、pp开发运行、ios端app开发运行WeChat(微信)端app开发运行。　　1.3开源免费　　永久免费，运行框架全部开源，底层内库也是开放的，Apache开源协议商业友好。　　2关键功能模块的设计　　2.1登录注册模块　　主要由login控制器类实现。具体实现上包含login、register方法，用于产生验证码的verify方法和用于注册控制checkRegister的方法、用于登录校验的checklogin方法及用于找回密码的getPassword方法。其中通过post方法获得提交的用户提交的注册信息(这里考虑到get方法不安全)。用等函数对所获得的信息进行处理，用MD

3、5函数进行密码加密等操作。　　2.2后台管理功能模块　　后台的核心功能是增删改查操作数据，这个操作只需要用add、delete、save就可以方便的实现。其实模块关键点在于权限控制。我们按部门来为管理员划分角色，分为高级管理员和普通管理员，不同级别管理员权限不同、责任不同。高级管理员可以添加和删除普通管理员账号，普通管理员进行数据的增删改查具体操作。　　2.3MySQL数据库设计　　通过对该项目内容的需求模型进行分析，将数据库划分为9张数据库表，其储存内容为：　　2.3.1党务政务表　　包括部门机构、通知公告、政策文件、人事管理、政务公开、党建之窗等二级目录。　　2.3.2新

4、闻快递表　　包括剑河新闻、乡镇之窗、新闻视频、部门动态。　　2.3.3平安剑河表　　法治剑河、综合动态、治安防控、纠纷调解、见义勇为、网格服务、平安常识。　　2.3.4剑河旅游表　　包括景点、线路、美食、酒店、资讯、特产、视频、留言。　　2.3.5个人中心表　　包括用户注册信息、用户登录记录、用户书签等。　　2.3.6社情民意表　　包括群众来信（公开/非公开）、投诉举报（公开/非公开）。　　2.3.7便民服务　　包括政务中心、医疗卫生、脱贫攻坚、民生查询。　　2.3.8百信生活　　包括房屋租赁、求职招聘、交通出行、常用电话查询、保修服务、科技知识、剑河公益。　　测试连接来创建

5、数据库表TABLE，创建一个example_News的数据库表createtable，开始添加字段，数据类型为VARCHAR，新闻要闻内容页表中的9个字段为例，fID、fTitle、fImg、fAlt、fClass、fAuthor、fData、fText、fFilter。　　主?IfID、字段长度50、确保数据唯一；　　文章的标题fTitle、字段长度200；　　图片名称fImg，字段长度200、(储存图片名称)；　　图片详情fAlt、字段长度200、图片加载失败出现的内容；　　文章分类fClass、字段长度50；　　作者fAuthor、字段长度50（定义长度也可为20，）　

6、　来源fSource、字段长度50；作者fAuthor、字段长度50；　　时间日期fData、字段长度50；正文fText、字段长度20000(数据库表的排序规则和字符集定义的均为utf8格式，则字段设置的最大值为(65535-1-2-4-30*3)/3=21812字段）；　　过滤显示字段fFilter、字段长度50；(前端调用，区分二级目录下不同的文件位置，用来过滤后显示内容的字段）。　　3HTML5页面设计　　管理员从后台把数据录入,数据经过处理为前端可直接显示的html5文件,新闻类app数据以图片和文本为主。我们要把文章标题、文章来源、时间日期、正文和图片等用java

7、script编码来实现。　　（1）考虑到手机屏幕尺寸不同，我们要设置为自适应宽度，我们在body里的table中设置宽度在width=”100%”,保障可以自适应手机屏幕尺寸。　　（2）简单用程序把我们所要显示的文章标题、来源、时间等文本消息导入到html文件body里面的table中的相应位置；　　（3）利用js代码实现在手机上显示双击图片放大和单击图片缩小到原来状态的简单功能，我们用ondblclick和onclick这对函数来实现，用js中的function定义enlargeImage（放大图片）