297 天前 / 祝坤荣(时序)
原文:https://blog.logrocket.com/co... 2020.1.31 翻译: 祝坤荣 ( 时序) email: zhukunrong@yeah.netURI versus URL in the image element(图像标签的 URI 和 URL) 当在图像标签中显示远程图片时,你需要将原对象命名为 URI,就像这样: 如果你错误的用了"URL",而不是"URI",在 iOS 设备上可以正常显示,但在安卓设备上就会挂掉。知道这个坑可以节省你大量的 debug 时间。 String outside textInvariant Violation: Text strings must be rendered within component. This error is located at: in a (at App.js:29) in RCTScrollContentView (at S...
305 天前 / 祝坤荣(时序)
原文:https://blog.logrocket.com/common-bugs-in-react-native/ 2020.1.31 翻译: 祝坤荣 ( 时序) email: zhukunrong@yeah.net React Native 是可以用来同时实现 Android 和 iOS 平台应用的不错的框架。由于它被 React 社区和 Facebook 支持,它离 version 1.0 还很早。 一些你遇到的 error 可能很容易被误导或极难发现。最近,React Native 团队在向开发者提问来帮助他们确定哪些恼人的 error 可能会让人失望。当他们定位了最差的 error, 让我们看看这些 issue 并且讨论下当他们跳出来时如何定位。
381 天前 / HueiFeng
总篇 88 篇 2020 年 第 12 篇 1、背景“汽车人”App 是汽车之家自主研发的一款移动办公应用。已经经历了多年的版本更新迭代,从最初的 0.X 系列到现在的 4.1.X,从原生开发到现在的跨平台,平台应用有 70+ 个,目前在线的应用覆盖了日常绝大多数的移动办公场景。汽车人 App 最初采用原生的开发方式,Android 和 iOS 同时上线一个功能时,两端都要实现一遍,耗时耗力。和大多数原生应用一样,无法应对业务快速变化,在没有热修复或热更新的前提下,通过原生发新版让用户频繁升级极度影响用户体验。因此这种纯原生开发模式无法满足之家业务快速变化的需求。
406 天前 / 携程技术
作者简介 海涛,携程前端开发工程师,负责机票主流程预订、React Native 技术栈相关开发工作。 前言 本文将主要介绍在携程中文 APP 国内机票模块中,对往返机票的预定流程改造期间,在 React Native 中进行复杂动画、手势交互的经验总结,包括复杂交互对于 RN 页面的性能开销,以及在不断解决问题的过程中总结出来的实践方案。 一、背景 项目背景源自于产品需求。经过产品调研,旧有的往返机票预定分页模式在用户体验中存在以下痛点: 用户需要反复进行信息确认,确认过程中切换页面有较强跳出感; 往返的去程列表和返程列表认知度不高...
568 天前 / 美团技术团队
总第357篇 2019年 第35篇 2018年,我们开源了React Native组件库——beeshell 1.0。时隔一年,我们对React Native组件库继续优化,实现beeshell 2.0升级,开源38个功能。希望更好的服务社区,同时也希望利用社区力量丰富React Native组件库。引言 随着 React Native(以下简称 RN)技术的出现,大前端的发展趋势已经势不可挡,跨平台技术因其通用性、低成本、高效率的特点,逐渐成为行业追捧的热点。为了进一步降低开发成本、提升产品迭代的效率,美团开始推广使用 RN 技术。随之而来,相关业务方开始提出对 RN 组件库的诉求。
615 天前 / 会飞的Pikachu
前言第一次接触 React Native 是在四年前实习的时候,当时在项目中使用的 RN 版本是 0.28.x,间隔四年之后,再次在项目中使用 RN 时版本已是 0.57.x。在撰写本文时,RN 的版本是 0.60.4,所以,本文将以 0.60.4 版本为基础,简要分析 RN 应用在 Android 平台上的启动流程。 Hello World用 RN 来写一个 Hello World 应用非常简单。通过 RN cli 生成项目之后,更改程序的入口文件即可: import { Text, AppRegistry } from 'react-native'import App from './App'// ...AppRegistry.registerComponent('HelloWorld', () => App);程序的入口文件一般是通过 ...
634 天前 / 人人贷大前端技术中心
本文介绍如何实现利用共享UI元素的动画,实现类似苹果App Store的Today页面的动画效果,我们先看最终的效果:
第一步:完成静态UI布局UI布局很简单,就是一个普通的ScrollView,我们直接看代码:
636 天前 / ElevenBeans
画一条精细无比的实线还记得一开始作为前端小萌新,被 0.5px 支配的恐惧吗? “你这条线画的有问题,跟我视觉稿上不一样,看起来不够精致~”“就一条线,咋不一样?咋不精致?”“你这个粗了一点点!”“哪有???我看不出来啊???”“很明显啊!你再帮我调小 0.5 个像素。”“。。。” 当年我们幸运 + 惊喜地发现 CSS 有伪元素、有 transform: scaleY(0.5),可以相对画出一条精确到小数点的线条时,才意识到:原来细微处还有这么多门门道道呵。
637 天前 / 携程技术中心
作者简介 任跃华, 携程机票前台软件工程师,从事机票android、react和react native技术栈相关研发工作。 前言 携程机票前台团队在使用 React Native 实现众多业务的过程中,经历了前期少量探索,中期大量应用,后期架构和性能优化的三个阶段。 在该技术栈积累了一定经验之后,结合不同业务的特点和复杂性,我们重新审视和思考一些前期实践项目的整体优化方向。在 App 国际机票查询列表页的相关业务模块,基于 Clean Architecture 整洁架构之道的思想,进行了一次技术大重构。
689 天前 / 开发者头条
点击链接或图片即可阅读 喜欢请分享到朋友圈哦 项目介绍 Alita,战斗天使阿丽塔,原型是《铳梦》中一位不断战斗和自我超越的生化改造少女。 Alita 是一套 React Native 代码转换引擎工具。它对 React 语法有全新的处理方式,支持在运行时处理 React 语法,可以用简洁、高效的方式把 React Native 代码转换成微信小程序代码,并且实现了 React Native 和微信小程序之间的主要组件对齐。 借助 Alita 引擎,可以实现用 React Native 进行多终端业务开发,除了官方支持的 Android、iOS 外...
689 天前 / 人人贷大前端技术中心
首发于大前端博客园写文章React Native 九宫格抽奖人人贷大前端技术中心人人贷大前端团队5 人赞同了该文章本文将介绍从零开始实现一个 React Native 版本的九宫格抽奖转盘,先看最终效果图 也可以直接使用react-native-super-lottery组件开发抽奖功能。 一、布局布局很简单,我们可以采用flex 3行布局,也可以单行、配合flex-wrap子控件自动折行实现。直接上代码 const LotteryStyle = StyleSheet.create({container: {flexDirection: 'row',flexWrap: 'wrap',justifyContent: 'center',}});const img_width = 100; // 图片的宽度const img_height ...
729 天前 / 闲鱼技术
嗯。。。这个问题十分不好回答啊(捋下鱼须)。闲鱼作为flutter领域的先驱者,以及fish_redux、flutter_boost等当红flutter库的作者,当然是欢迎广大的开发者多多使用flutter相关技术栈 逃~:)。咳咳,不过呢,我们还是正经得聊一下React Native(下面简称RN)和flutter之前的异同: 0x00 简单介绍一下React NativeReact Native是Facebook开源的一款基于react思想、使用JS、能够给移动平台带来native般体验的框架,官网最新的版本是0.5.9。
732 天前 / u336221
code小生,一个专注 Android 领域的技术平台 公众号回复 Android 加入我的安卓技术群 作者:tooyoungt 链接:https://www.jianshu.com/p/129c04476a2f 声明:本文已获tooyoungt授权发表,转发等请联系原作者授权 移动开发的发展渐渐趋于成熟,开发者的技能树分布渐渐完善。随着大前端的发展跨平台技术也衍生除了相关平台。对于移动开发者来说,也是面临着新的机遇与挑战,各个公司也尝试拥抱新技术,可以说这也是一个趋势相关的挑战。由于公司产品,存在Android,iOS两组开发人员,且业务逻辑与UI几无差别。
736 天前 / 携程技术中心
作者简介 赵辛贵,携程无线平台研发部开发总监。2013年加入携程,主要负责App基础框架研发相关工作,曾参与Native、Hybrid和ReactNative框架设计、工程模块化、Android插件化等项目。目前重点关注ReactNative技术在公司的推广和研发支持、无线框架和工程架构升级。 经过近两个月的准备,携程无线平台研发团队正式将内部的ReactNative开发框架-CRN实现开源。CRN对原生的ReactNative框架进行了大量架构简化、性能和稳定性调优的工作,能大幅降低RN技术的应用成本。
739 天前 / 黎跃春
来源 |愿码(ChainDesk.CN)内容编辑 愿码Slogan | 连接每个程序员的故事 网站 |http://chaindesk.cn 愿码愿景 | 打造全学科IT系统免费课程,助力小白用户、初级工程师0成本免费系统学习、低成本进阶,帮助BAT一线资深工程师成长并利用自身优势创造睡后收入。 官方公众号 | 愿码 | 愿码服务号 | 区块链部落 免费加入愿码全思维工程师社群 | 任一公众号回复“愿码”两个字获取入群二维码 本文阅读时长:4min 任何高质量移动应用程序的一个重要方面是用户界面的流动性。动画用于提供丰富的用户体验,任何jank或抖动都会对此产生负面影响。