App：漫画书
1.平台：Android客户端（后期完善IOS端）
2.开发框架：React Native react-redux react-thunk
3.开发工具：Vs Code 1.8
1.项目介绍
。app
。actions ---- 用户行为
。reducer ---- 对用户行为进行分发，更新状态
。store ---- 整合全部reducer
。container ---- 业务模块
。components ---- UI组件
。utils ---- 工具文件
。images ---- 图片
。constan ---- 常量
。style ---- 样式
。api ---- 网络URL
。widget ---- 自定义组件
。root.js ---- App根文件
。app.js ---- App入口
。index.ios.js
。index.android.js
项目采用React-Native react-redux react-thunk框架开发，目前由于没有mac设备，只完成兼容Android环境，代码模块化实现，组件封装实现代码复用。
2.App模块
分为首页、发现、精选、我四大版块，以下是功能列表：
- 使用ViewPager跟ListView展示图文列表。
- 推荐精彩漫画列表。
- 精选内容，分类展示，增加滑动Tab，增加用户体验。
- 自定义扩展ListView，实现上拉加载更多数据，下拉刷新数据。
- 添加缓存功能，增强用户体验。
项目用到的接口来自聚合数据。
3.整体设计
- 使用官方的Navigator管理全局路由，可自由配置Scene的出场动画，处理Android端的后退键事件
- 使用FlexBox和jsx语法进行布局，并封装了一系列通用的组件，比如TopBar、带上下拉功能的ListView等，便于全局复用
- 导入第三方库react-native-wechat实现微信分享
- 使用InteractionManager，阻止ListView的头部和尾部频繁刷新，优化渲染性能。
- 在深刻理解的前提下引入redux相关功能，包括redux/react-redux/redux-thunk/，设计与漫画列表和详情相关的全局state结构，使用redux管理相关的组件
4. 第三方库
依赖方式，cd到项目根目录，执行： npm install [插件名称] -save
(1)redux: ^3.6.0
(2)react-redux: ^5.0.2
(3)react-thunk: ^1.0.0
(4)redux-thunk: ^2.1.0
(5)react-native-blur: ^2.0.0
(6)react-native-viewpager
(7)react-native-vector-icons: ^4.0.0
(8)react-native-scrollable-tab-view: ^0.7.0
(9)react-native-lightbox: ^0.6.0
(10)react-native-simple-store: ^1.1.0
5.运行截图
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。