【瓣芽·Banya】React Native 构建的仿豆瓣应用

2023-05-16

今天介绍一个用 React Native 创建的应用,集合了豆瓣电影,图书等信息展示功能的 app。

github 地址 → 【瓣芽·Banya】

项目使用了react-navigation 做路由。redux 做部分状态管理,redux-persist 做数据本地化 。采用了少量的第三方库,并同时兼容 Android 和 iOS 端。项目适合初级 RN 开发者,对于 React Native 的学习具有一定的借鉴意义。

1. 功能

  • 电影榜单以及电影,影人详情信息展示
  • 本地收藏电影
  • 根据定位获取实时上映数据
  • 预告片播放,图片缩放查看
  • 数据存储,部分数据支持本地获取
  • 主题换肤,全局设置自定义颜色

2. 基本配置:

  • react-navigation 路由管理
  • react-redux 状态管理
  • redux-persist 数据持久化
  • prop-types 类型检查

3. 主要第三方库:

  • react-native-swiper 轮播组件
  • react-native-modal 弹出框组件
  • react-native-linear-gradient 色彩渐变组件
  • react-native-image-zoom-viewer 图片预览查看组件
  • react-native-video 视频播放组件
  • react-native-scrollable-tab-view 页面切换 tab-view 组件

4. 运行截图

换肤蓝色之后:

5 .项目结构

  • component 自定义组件
  • constant  配置常量,资源文件
  • navigation 路由配置
  • redux redux 状态数据管理
  • util  网络请求等公共函数
  • views screen 页面

以上是个人开源项目,任何问题欢迎交流,共同学习!

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

【瓣芽·Banya】React Native 构建的仿豆瓣应用 的相关文章

  • 长按后启用 ScrollView 中元素的拖动

    我已经用 panResponder 和 ScrollView 实现了拖放列表 我希望即使在触摸该项目时也能够滚动列表 问题是当我做滚动手势时该项目会移动 当然 我也希望能够移动该项目 但现在它具有与滚动相同的手势 我想通过仅在长按 1 5秒
  • 在 Visual Studio 2015 中使用 v90 (VS2008) 平台工具集

    是否可以 以及如何 使用 VS2015 IDE 使用编译器 链接器 STL 以及 VS2008 附带的所有其他内容来构建本机 C 项目 我想做的事情叫做 C 本机多目标 众所周知 例如VS2012 允许对 C 项目使用 VS2008 v90
  • 如何在android上加载本地库?

    我有一个 so 库 是我从另一个 APK 中提取的 我已将其复制到项目中的 libs armeabi 位置 在我的课堂上 我正在加载它 static System loadLibrary mylib 该应用程序崩溃了 08 03 07 52
  • 多个 AppDomain 和本机代码

    我的 C 应用程序使用的本机代码不是线程安全的 我可以运行该本机代码的多个进程 使用进程间通信来实现并发 我的问题是 我可以使用应用程序域来代替 以便多个托管线程 每个线程位于不同的应用程序域上 调用本机代码并且它们不会相互干扰吗 主要目标
  • 如何获取android的native方法源码

    是否可以获取并观看Android程序组件的本机方法代码 如果有人知道如何做 请告诉我 您可以使用 查找 Android 本机方法的源代码 以下服务之一 AndroidXRef http androidxref com GitHub http
  • Android 中在 jni 中运行的原生 C 代码与在 shell 中运行的区别

    我有一个原生 C Android 应用程序 首先 我将本机 C 代码构建到共享库中 jni 将使用该库 该库使用一些内核可加载模块 ko 一些已经加载 一些必须通过 insmod 命令加载 我还构建了一个使用该库的可执行文件 并且它可以通过
  • React Native Lottie - 动画结束时反转

    Context 我是lottie react native的新手 并且已经成功实现了我的第一个动画 constructor props super props this state progress new Animated Value 0
  • 使用JNI而不是JNA调用本机代码?

    与 JNI 相比 JNA 似乎更容易用来调用本机代码 在什么情况下您会使用 JNI 而不是 JNA JNA 不支持 C 类的映射 因此如果您使用 C 库 则需要 jni 包装器 如果你需要大量的内存复制 例如 您调用一个方法 该方法返回一个
  • Android 原生代码分析

    我正在尝试分析本机 Android 代码 但我得到了 出现以下错误 我正在 Linux 机器上运行代码 tracedmdump 配置文件后处理 痕迹 静态基本块 64525 动态 基本块 87073132 静态指令 412004 动态 说明
  • 编写软件时 64 位相对于 32 位的优势 [重复]

    这个问题在这里已经有答案了 如果我有一个像 HelloWorld 这样用 C 编写的简单程序 然后我在 32 位和 64 位的机器上编译它 我会得到两个不同的二进制文件做同样的事情 但它们是不同的机器代码 只有 32 位二进制文 件能够在
  • 使用 Spark 加载由 --files 参数分发的共享库 (.so)

    我正在尝试在运行 Spark 作业时使用外部本机库 so 文件 首先 我使用提交文件 files争论 加载我正在使用的库System load SparkFiles get libname 创建后SparkContext 确保 确定Spar
  • 相当于本机 javascript 中的 $(this)

    我想向按钮添加事件侦听器 并且我对纯 javascript 编码还比较陌生 所以我不知道本机等效项是什么 this 在我的代码中 the markup ul class menu li a href text a li li a href
  • Android JNI 本机 C 函数调用杀死活动

    什么有效 我有一个运行 TUN TAP 服务的 c 可执行文件 以及两个在终端中运行良好的 shell 脚本 用于配置 ip 路由 和 iptables 全部以 root 身份运行 什么不起作用 我正在尝试创建一个 Android 应用程序
  • Android 原生代码:将 Surface 分配给特定显示器

    我正在寻找一种将 Surface 本机窗口 对象分配给显示器的方法 以便提交到该本机窗口的缓冲区将渲染到该特定显示器而不是主显示器 我想用本机代码来做到这一点 在Java中 可以通过使用Presentation API来完成 在本机代码中我
  • Flutter - ListView.builder:初始滚动位置

    我想设置 ListView builder 的初始滚动位置 我希望列表从底部开始0 0 如果我设置reverse当然 在 listView 上 我将初始滚动位置设置为所需的位置 但我需要的是让最后一个孩子位于底部 是一个聊天应用程序 这是列
  • 为什么我在 Apple Silicon 上编译的本机应用程序有时构建为 arm64,有时构建为 x86_64?

    我有一个基本的 C 程序 include
  • 模块没有导出成员“IonicNativePlugin”,Ionic2 for facebook

    我尝试在 ionic 2 应用程序中登录 facebook 但在构建我的应用程序时遇到此错误 帮我解决这个问题 13 17 52 转译开始 13 17 58 打字稿 D royalworkspace newfblogin node modu
  • 如何在 maven 的 java.library.path 变量中包含本机库

    我正在尝试为我的应用程序使用 JNotify 它有以下要求 只需使用以下命令运行 jar 文件即可测试 JNotify java Djava library path jar jnotify VER jar 目录 然后 JNotify 将监
  • GWT 中的本机 Javascript 方法

    我的 GWT Java 类之一中有一个本机 Javascript 方法 但我在从本机 Javascript 代码调用我的 Java 方法时遇到问题 我试着跟随this http code google com webtoolkit doc
  • 奇怪的本机崩溃 - pid:0,tid:0 信号 11 (SIGSEGV),代码 1 (SEGV_MAPERR)

    我在 Android 上遇到了奇怪的崩溃 pid 0 tid 0 gt gt gt com oimvo discdj lt lt lt backtrace 00 pc 000000000001d050 data app com oimvo

随机推荐

  • leetcode 417. 太平洋大西洋水流问题

    https leetcode cn com problems pacific atlantic water flow 思路是从海洋开始逆流 如果可以逆流到 就标记为1 然后检查两个海洋都可以逆流到的区域 DFS public List lt
  • Android模拟器检测常用方法

    在Android开发过程中 xff0c 防作弊一直是老生常谈的问题 xff0c 而模拟器的检测往往是防作弊中的重要一环 xff0c 接下来有关于模拟器的检测方法 xff0c 和大家进行一个简单的分享 1 传统的检测方法 传统的检测方法主要是
  • RecyclerView 隐藏部分分割线

    在项目中遇到复杂点的RecyclerView xff0c 可能会有隐藏部分分割线的需求 xff0c 例如item1和item3之间的分割线隐藏 xff0c item4和item5之间的分割线隐藏等 在看了文档里的ItemDecoration
  • 浅谈去中心化应用

    1 中心化应用 现在我们所使用的应用基本上都是中心化的应用 xff0c 什么是中心化应用呢 xff0c 举个栗子 xff0c 我们在天猫买东西的时候 xff0c 需要先付款给支付宝 xff0c 然后卖家发货 xff0c 我们确认收货之后 x
  • EGL综述

    参考 xff1a https www khronos org registry EGL specs eglspec 1 5 pdf 什么是EGL EGL是支持多平台 多操作系统的 xff0c 比如安卓 Unix Windows等 为了扩展性
  • Java二分搜索树及其添加删除遍历

    对于树这种结构 xff0c 相信大家一定耳熟能详 xff0c 二叉树 二分搜索树 AVL树 红黑树 线段树 Trie等等 xff0c 但是对于树的应用以及编写一棵解决特定问题的树 xff0c 不少同学都会觉得不是一件简单的事情 xff0c
  • Android自定RadioGroup实现点击切换效果

    一 xff1a java文件 public class SegmentedGroup extends RadioGroup private int mMarginDp private Resources resources private
  • opencv--将本地摄像头数据转换成ip摄像头数据流,并在客户端获取该流进行显示

    项目介绍 xff1a 在本项目中 xff0c 实现从本地摄像头获取数据帧 xff0c 然后将其转换成ip摄像头数据流并在客户端通过opencv代码实时获取该图像数据进行显示 xff1a 当然也能在浏览器通过输入地址进行视频的访问 方式一 x
  • 8. &和&&的区别?

    答 xff1a amp 运算符有两种用法 xff1a 1 按位与 xff1b 2 逻辑与 amp amp 运算符是短路与运算 逻辑与跟短路与的差别是非常巨大的 xff0c 虽然二者都要求运算符左右两端的布尔值都是true整个表达式的值才是t
  • 记InheritedWidget使用思考

    InheritedWidget 是项目中必不可少的组件 xff0c 用户数据共享 老生常谈的Provider框架也是基于InheritedWidget实现的 简介 InheritedWidget组件是功能性组局 xff0c 实现了由上向下共
  • flutter数据共享系列——随记

    Provider InheritedWidget 解决了数据共享问题 迎面也带来数据刷新导致的组件不必要更新问题 Provider基于InheritedWidget实现数据共享 xff0c 数据更新 xff0c 定向通知组件更新等 接下来我
  • Flutter布局——一段代码解释最常见的约束错误

    flutter布局的原理 Constraints go down Sizes go up Parent sets position 父节点向子节点传约束子节点向父节点上传大小最后由父节点决定位置 不是按照直接约束显示 问题代码 xff1a
  • 流媒体压力测试rtmp&hls(含推流和拉流)

    root 64 localhost yum install git unzip patch gcc gcc c 43 43 make root 64 localhost git clone https github com rzrobert
  • Windows开启网络对时方法

    Windows开启网络对时方法 1 启用 NTPServer 为此 xff0c 请按照下列步骤操作 xff1a a 单击 开始 xff0c 单击 运行 xff0c 键入 regedit xff0c 然后单击 确定 进入注册表 b 找到并单击
  • 关于【finder不能完成该操作 因为未能读取或写入"文件名"中的某些数据(错误代码-36)】快速解决办法

    如题 xff1a finder不能完成该操作 因为未能读取或写入 34 文件名 34 中的某些数据 错误代码 36 我们在Mac上操作NTFS格式的硬盘中的文件 xff0c 删除过程中由于某些原因为删除完整 xff0c 直接拔掉硬盘 xff
  • Ubuntu安装指定版本clang-format

    执行以下命令即可 xff1a wget O https apt llvm org llvm snapshot gpg key sudo apt key add sudo vim etc apt sources list 插入从https a
  • Swift中设置tableview的分割线(separator)的样式、颜色、边距

    Swift中设置tableview的分割线 xff08 separator xff09 的样式 颜色 边距 设置分割线样式 三种分割线样式 xff1a case None 无分割线 case SingleLine 单条分割线 case Si
  • React-Native 程序出现闪退原因之一

    React Native 程序出现闪退原因之一 1 RN的iOS端release版本和staging版本出现闪退 原因 xff1a 使用了Number isInteger 该方法在iOS端debug模式下运行不会出现异常 xff0c 一旦生
  • 【Android】【问题分析】G-sensor因数据交互问题导致手机crash

    G sensor因数据交互问题导致手机crash 问题现象 xff1a 测试同事发现 xff0c 手机在使用和待机时 xff0c 低概率发现手机会crash 问题原因 xff1a G sensor在driver和HAL层因交互的参数不匹配
  • 【瓣芽·Banya】React Native 构建的仿豆瓣应用

    今天介绍一个用 React Native 创建的应用 xff0c 集合了豆瓣电影 xff0c 图书等信息展示功能的 app github 地址 瓣芽 Banya 项目使用了react navigation 做路由 redux 做部分状态管理