原生端(iOS和Android)读取ReactNative本地图片

源码已上传Github:https://github.com/songxiaoliang/native-read-rn-image 在ReactNative开发过程中,有时需要在原生端显示RN里的图片,这样的好处是可以通过热更新来更新APP里的图片,而不需要发布原生版本,而ReactNative...

2019-05-24 19:49:15

阅读数 259

评论数 0

Detox实现ReactNative E2E自动化测试

Detox 是什么? 在创建新功能或修复错误后,我们通常会在我们的设备上安装该应用并手动测试。但是,当我们想要在标记版本之前验证所有新旧功能时,此过程可能会很麻烦。解放双手,是我们梦寐以求的。 Detox,一个用于测试 React Native 应用程序 Selenium 界面的端到端自动化...

2019-05-16 21:41:55

阅读数 213

评论数 0

React Native字体问题解决方案指北

源码已上传 Github:react-native-app-font “怎么又是字体,老常的话题现在还拿出来说。关于字体适配的解决方式网上一搜几十篇!”。看到标题的烙铁心里一万个xxx疾驰飞腾。But! 我总是会给大家带点什么惊喜。关于 pxToDp、启动缩放 我们一点不说。本篇博客的主题很简单...

2019-05-12 22:40:51

阅读数 181

评论数 0

React Native图片资源使用的优美方案

图片资源( jpeg、png、svg、webp ... )作为与用户交互的界面元素,在客户端产品中起到了非常重要的角色作用。在应用开发中,移动端与PC的图片使用策略也有所不同。PC端较大的内存容量,快速的渲染能力使各类型图片资源都能得到较好的使用。而移动端由于设备内存,GPU渲染都与PC有较大差别...

2019-04-02 16:38:04

阅读数 166

评论数 0

在 React Native 中使用 Hooks

React官方在 2018 ReactConf 大会上宣布 React v16.7.0-alpha(内测) 将引入 Hooks。什么是Hooks,我们来了解一下。 什么是Hooks? 在平时开发过程中,我们一般都会遇到如下问题: 1. 难以重用和共享组件中的与状态相关的逻辑 2. 逻辑复杂...

2019-03-13 16:15:03

阅读数 1064

评论数 2

Android 集成 Flutter 及通信交互详解

欢迎大家关注【跨平台开发那些事】公众号,定期推送跨平台开发技术实践。 前不久开源了用Flutter开发的一个音视频类App客户端,欢迎大家star, fork。 ⚠️ 项目地址:https://github.com/songxiaoliang/visitor-flutter ⚠️ 本篇博...

2019-01-28 16:18:03

阅读数 2213

评论数 1

基于 Flutter 视频客户端 Vistor【已开源】

项目已开源到 Github:Vistor,欢迎大家 fork,star。 模块 开发环境: Vs Code (1.30.2) Android Studio 3.+ 开发框架 ( Flutter sdk: ">=2.0.0-dev.68.0 <...

2019-01-24 10:16:10

阅读数 5047

评论数 17

Flutter以两种方式实现App主题切换

欢迎大家关注【跨平台开发那些事】公众号,定期推送跨平台开发技术实践。 概述 App主题切换已经成为了一种流行的用户体验,丰富了应用整体UI视觉效果。例如,白天夜间模式切换。实现该功能的思想其实不难,就是将涉及主题的资源文件进行全局替换更新。说到这里,我想你肯定能联想到一种设计模式:观察者模...

2018-12-26 11:29:27

阅读数 3082

评论数 4

Flutter优化之将小部件拆分为方法将影响渲染性能

欢迎大家关注【跨平台开发那些事】公众号,定期推送跨平台开发技术实践。 在React Native跨平台开发框中,我们经常会看到,当界面组件层次嵌套深,组件交互涉及业务逻辑时,为了代码层次简洁、清晰,都会将组件拆分到方法中,然后在主布局中引入,例如: render() { return ...

2018-12-22 15:56:07

阅读数 416

评论数 3

CodePush优化之减小更新包体积

欢迎大家关注【跨平台开发那些事】公众号,定期推送跨平台开发技术实践。 述 还有 10 天就要迎来 2019 新年,感慨 18 年过的好快,恍恍惚惚。2018 年经历了很多,人生最重要的事情,很开心。闲余时间浏览了这一年写过的博客,9 篇相对 17 年少了很多。时间不等人,什么事还是要提前计...

2018-12-19 16:21:01

阅读数 569

评论数 6

RN JSBundle 拆分解决方案(3): 固定ModuleId,JSBundle按需加载

实践源码:react-native-split-bundle:https://github.com/songxiaoliang/react-native-split-bundle 前面两篇文章分别从源码加载、Bundle文件结构、Metro打包工具等做了简单分析,逐步了解关于RN打包,Bundl...

2018-11-30 12:56:28

阅读数 1112

评论数 4

RN JSBundle 拆分解决方案(2): JSBundle 、Metro 结构分析

  在第一篇(RN JSBundle 拆分解决方案(1): 应用启动、视图加载原理解析)中我们对RN的启动、视图加载流程从源码角度做了简单的梳理。本篇内容我们继续对JSBundle 文件内容结构,以及当前RN框架默认的打包工具 Metro 进行分析。 JSBundle 文件结构 当我们执行 ...

2018-11-27 18:35:56

阅读数 1186

评论数 0

React Native BackHandler exitApp 源码分析

欢迎大家关注【跨平台开发那些事】公众号,定期推送跨平台开发技术实践。 概述 昨天技术交流群里有个朋友提出一个问题,在 Android 中嵌入了 React Naitve,并且想从RN层执行代码,回到上一个原生Activity。说起来比较模糊,假设他的界面执行流程如下: Activity...

2018-11-22 17:29:28

阅读数 680

评论数 0

React Native 手势触摸事件机制详解(进阶篇)

  源码已开源到Github,详细代码可以查看:《React Native 触摸事件代码实践》。 在基础篇,对RN中的触摸事件做了详细的介绍。相信大家对于触摸事件流程机制有了更为清晰的认识。没有浏览的可以先看看基础篇:《 React Native 手势触摸事件机制详解(基础篇)》 本篇博客中...

2018-10-20 14:41:11

阅读数 1184

评论数 1

React Native 手势触摸事件机制详解(基础篇)

欢迎大家关注【跨平台开发那些事】公众号,定期推送跨平台开发技术实践。 源码已开源到Github,详细代码可以查看:《React Native 触摸事件代码实践》。 博客产出拖延了很久,老早定的主题现在才开始写。之前群里朋友对于React Native(以下简称RN)中手势触摸相...

2018-09-26 16:07:47

阅读数 2362

评论数 0

React Native v0.56.0 最新版本更新日志

欢迎大家关注【跨平台开发那些事】公众号,定期推送跨平台开发技术实践。 React Native v0.56.0 已发布,这也是属于 6 月的更新发布! FB开发团队表示,自3月以来,超过 60 位贡献者贡献了 816 个 commit。另外,由于这个新版本有一些重要的破坏性变化需要大量...

2018-07-05 15:07:14

阅读数 1761

评论数 0

React Native封装Android原生UI组件最详教程

欢迎大家关注【跨平台开发那些事】公众号,定期推送跨平台开发技术实践。 篇幅预计阅读时间10分钟,结尾有福利~~ 前些天群里有朋友说想了解如何在React Native项目中使用封装原生View组件,之前有写过一篇Android原生层与React Native 交互的文章,感兴趣...

2018-04-17 18:16:58

阅读数 4590

评论数 2

React Native未来导航者:react-navigation 使用详解(进阶篇)

欢迎大家关注【跨平台开发那些事】公众号,定期推送跨平台开发技术实践。 本篇内容为react-navigation的进阶内容以及高级用法。基础篇请看: React Native未来导航者:react-navigation 使用详解(基础篇) (1)适配顶部导航栏标题: 测试中发现,在i...

2018-03-06 17:44:25

阅读数 2131

评论数 2

RN JSBundle 拆分解决方案(1): 应用启动、视图加载原理解析

前两篇文章和大家分享了RN中的触摸事件机制。链接如下: React Native 手势触摸事件机制详解(基础篇) React Native 手势触摸事件机制详解(进阶篇) 接下来的系列内容将结合 Android 原生层来分析拆包解决方案。如果你具有Android原生开发经验,并且在实践 An...

2018-02-22 14:57:46

阅读数 1718

评论数 4

React Native集成Sentry错误日志统计

欢迎大家关注【跨平台开发那些事】公众号,定期推送跨平台开发技术实践。 App版本升级想必大家都不陌生。原生开发中App升级方式有很多种,Android和iOS也不尽相同。大致区别如下: App错误收集的实现方式有很多,例如友盟、Bugly、阿里云、Sentry等等。本篇博客和大家分享一...

2017-12-04 21:25:16

阅读数 3826

评论数 0

提示
确定要删除当前文章?
取消 删除