android漫画app代码,漫画书Android客户端 – ComicApp

android漫画app代码,漫画书Android客户端 – ComicApp漫画书1.平台:Android客户端(后期完善IOS端)2.开发框架:ReactNativereact-reduxreact-thunk3.开发工具:VsCode1.81.项目架构appactions用户行为reducer对用户行为进行分发,更新状态store整合全部reducercontainer业务模块componentsUI组件utils工具文件images图片con…

漫画书

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模块

分为首页、发现、精选、我四大版块,以下是功能列表:

1.使用ViewPager跟ListView展示图文列表。

2.推荐精彩漫画列表。

3.精选内容,分类展示,增加滑动Tab,增加用户体验。

4.自定义扩展ListView,实现上拉加载更多数据,下拉刷新数据。

5.添加缓存功能,增强用户体验。

项目用到的接口来自聚合数据。

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.运行截图

jEFjeq.jpg

ZZbMvq.jpg

iaq2Ij.jpg

juuEFz.jpg

BjiiYz.jpg

Uz2m6n.jpg

fI7FZn.jpg

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。
如需转载请保留出处:https://bianchenghao.cn/35990.html

(0)
编程小号编程小号

相关推荐

发表回复

您的电子邮箱地址不会被公开。 必填项已用*标注