基于iOS和Android的react-native跨平台漫画App
2017-04-12 21:35
711 查看
ComicBook
ComicBook项目参考了ComicApp的部分设计和部分代码,
ComicBook是
ComicApp的重构版。本项目架构清晰,代码简洁,还配套完整的视频。http://yiqizhongchuang.cn/iosandroidreact-nativeapp?utm_source=tuicool&utm_medium=referral
项目使用须知
$ git clone https://github.com/liyuechun/ComicBook.git[/code]$ cd ComicBook$ npm install
如下图打开项目配置文件
配置说明import { Platform } from 'react-native'; /** * 运行项目注意事项 * 1、请移步:https://www.juhe.cn/docs/api/id/163 * 2、注册账号 * 3、申请数据,免费可以访问1000次,如果想花钱,可以花99元买20000次, * 不想花钱,直接换个手机号再注册申请即可 * 4、把申请的key替换掉下面的key */ /** * 备用key * 8f28c126609a563c7ce16f6a83369459 * ed273dc45c5042836181c2356b81db63 */ /** * 将你申请的key替换掉下面的key */ export const KEY = "8f28c126609a563c7ce16f6a83369459"; /** * Android端是否以抽屉样式展示 */ const SHOW_ANDROID_DRAWER = true; // const SHOW_ANDROID_DRAWER = false; /** * iOS端是否以抽屉样式展示 */ const SHOW_IOS_DRAWER = true; // const SHOW_IOS_DRAWER = false; export const IS_TAB_STYLE = Platform.OS === 'ios' && !SHOW_IOS_DRAWER || Platform.OS !== 'ios' && ! SHOW_ANDROID_DRAWER;
运行项目$ react-native start $ react-native run-ios $ android avd //启动android模拟器 $ react-native run-android
Android && iOS端抽屉效果
Android && iOS 抽屉效果主页
Android && iOS TabBar主页效果
其他页面效果
StackNavigator
第三方库
TabNavigator
DrawerNavigator
Redux
redux-thunk
react-static-container
react-native-viewpager
react-native-sglistview
react-native-scrollable-tab-viewmobx版本的ComicBook
TODOS
Weex版本的ComicBook
相关文章推荐
- 使用react-native-pull实现跨平台Android&IOS下拉刷新滑动回弹效果
- React-Native Android 与 IOS App使用一份代码实现方法
- ReactNative做的仿ONE一个app,适配Android/IOS
- 使用react-native-pull实现跨平台Android&IOS下拉刷新滑动回弹效果
- React-Native 开发 android & ios App,共享一份代码
- 基于React Native + redux 开发的客户端(适配IOS和Android),可查看保存妹纸,收藏分享文章等
- React-Native 开发 android & ios App,共享一份代码
- 基于React-Native的高仿「ONE·一个」,兼容Android、iOS双平台
- 基于react的混合APP,同时输出ios,android,wap应用
- React-Native 开发 android & ios App,共享一份代码
- 《React-Native系列》23、 js实现下拉刷新效果(Android和iOS通用)
- 【精】客户端(iOS、Android)/Server,APP内部的通信协议,跨平台方案
- 如何愉快地调试一个 React Native for Android APP
- Facebook F8App-ReactNative项目源码分析5-iOS篇
- react-native ( om.android.support:appcompat-v7:23.0.1.)
- IOS、Android进阶之ReactNative热更新
- 《React-Native系列》13、 组件封装之Dialog(iOS和Android通用)
- 如何用 React Native 创建一个iOS APP?(二)