React-native

React-Native使用React-Navigation在顶部导航栏调用外部定义函数

背景：最近在开发项目时需要在导航栏中点击菜单按钮之后弹出来相应的动态的举报确认。但是举报确认的ActionSheet是在外部调用的。上图：1:点击导航栏中的菜单选项（右上角）2:弹出来相应的举报选项接下来就走一遍这个流程。并将逻辑理清楚。在项目中是使用react-navigation进行导航的。因此这个事件的触发必须要放在navigationOptions中进行定义。在前一篇博客里，描述了如何在导
F-ZERO-F·2019-01-29 18:38

Android Studio集成React native

配置类似如下（具体自己修改）{"name":"ReactHome","version":"0.0.1","private":true,"scripts":{"start":"nodenode_modules/react-native
Devil_Chen·2019-01-27 17:26

first react native

importReact,{Component}from'react';import{Platform,FlatList,StyleSheet,Text,Image,View}from'react-native
haolifengwang·2019-01-26 18:12

react-native 常用组件（三）

[显示文本的React组件，并且它也支持嵌套、样式，以及触摸处理]举栗子：importReact,{Component}from'react';import{Text,StyleSheet}from'react-native
Lucky_ce60·2019-01-25 11:33

react-native init 的时候怎么指定版本

因为react-native更新太快，每次react-nativeinit初始化项目的时候，都会安装最新的rn版本，导致之前的一些api不兼容等问题。
无道暴君·2019-01-25 10:21

react-native 常用组件(二）

8.Modal组件：[是一种简单的覆盖在其他视图之上显示内容的方式]属性：visiblevisible属性决定modal是否显示。supportedOrientationssupportedOrientations用于指定在设备切换横竖屏方向时，modal会在哪些屏幕朝向下跟随旋转。在iOS上，除了本属性外，还会受到应用的Info.plist文件中UISupportedInterfaceOrien
Lucky_ce60·2019-01-22 18:18

react-native Image resizeMode 属性

图片代码1.cover：（默认）等比例填充image设定的宽高，图片可能会有裁剪：cover效果图2.stretch:非等比例填充image设定的宽高，图片不会被裁剪，但可能会变形、拉伸：stretch效果图3.contain:等比例填充image设定的宽高，图片不会被裁剪，控件区域可能会有留白：contain效果4.center:图片原大小居中：center效果5.repeat:图片原大小重复：
m_麻·2019-01-22 16:18

【React-native】导航组件 react-navigation 的使用

之前项目一直用的老版本的React-native（0.35.0），新的导航组件一直没有接触，近来想接触，但是找了半天却发现都实现不了，后来终于折腾好了，所以记录一下。谈组件不写清楚版本完全就是耍流氓！
程序员阿喵·2019-01-21 18:41

React Native 'config.h' file not found

ReactNative'config.h'filenotfoundconfig.hfile解决方法如下：cd到项目目录下执行如下操作：cdnode_modules/react-native/third-partycdglog-xxx
HowieDev·2019-01-21 11:51

react-native 学习记录

1.用webstorm运行react-native工程时，出错：xcrun:error:unabletofindutility"instruments",notadevelopertoolorinPATH
ghost__·2019-01-18 15:21

安卓跨平台开发实践

移动端目前市面上主流的平台主要有Android和IOS两大平台，为了尽可能复用代码和节省开发成本，各大巨头都开发了自己的跨平台框架，比如Facebook的React-Native，阿里的Weex，Cordova
宜信技术学院·2019-01-18 10:58

ionic3的安装，当你总是安装失败的时候看一看。

此时cmd查看node-v和npm-v3.打开React-Native官网执行以下代码npmco
光电园最靓的仔·2019-01-18 10:26

宜信投米RA | 安卓跨平台开发实践

移动端目前市面上主流的平台主要有Android和IOS两大平台，为了尽可能复用代码和节省开发成本，各大巨头都开发了自己的跨平台框架，比如Facebook的React-Native，阿里的Weex，Cordova
宜信技术学院·2019-01-18 00:00

react-native 抽屉页面实现

DrawerLayoutAndroid:抽屉（通常用于导航切换）是通过renderNavigationView方法渲染的，并且DrawerLayoutAndroid的直接子视图会成为主视图（用于放置内容）。导航视图一开始在屏幕上并不可见，不过可以从drawerPosition指定的窗口侧面拖拽出来，并且抽屉的宽度可以使用drawerWidth属性来指定。译注：此组件仅能在Android上使用。我们
Lucky_ce60·2019-01-17 16:04

自定义View——React-Native轮播图(学习)

我尽量不打错别字，用词准确，不造成阅读障碍。最近一直在写RN，赶项目，好久没写博客和更新github了，加上昨天被一个json不会写、甩锅超强的菜鸡同事气到了，今天怎么也得写一些，哭~~。很多人需要轮播图都会使用开源的"react-native-swiper"之类的东西，人家写的确实牛逼，但是我有个执念，不习惯随意使用第三方的东西，就喜欢造轮子，我一般选择把别人的原理看明白然后自己写，这样可以像做
long_surpass。·2019-01-17 10:23

React-Native 使用 React-Native-Vector-Icons 引入 iconfont 文字矢量图标

iconfont(阿里巴巴矢量图标库)1.使用命令行工具进行react-native-vector-icons工具的安装：npminstallreact-native-vector-icons--save安装完成之后在package.json文件中可以看到新增了一行"react-native-vector-icons":"^5.0.0",2.使用命令react-nativelinkreact-na
journey_IT·2019-01-16 15:33

RN(react-native)踩坑实录--页面跳转

页面跳转移动应用基本不会只由一个页面组成。管理多个页面的呈现、跳转的组件就是我们通常所说的导航器（navigator）。社区今后主推的方案是一个单独的导航库react-navigation，它的使用十分简单。ReactNavigation中的视图是原生组件，同时用到了运行在原生线程上的Animated动画库，因而性能表现十分流畅。此外其动画形式和手势都非常便于定制。ReactNavigationR
JS新贵·2019-01-16 15:08

RN(react-native)踩坑实录--编写项目

编写appDEMO：查询天气appgithub:https://github.com/z-god/NewWeather起步搭建一个自己的appreact-nativeinitNewWeathercdNewWeather项目目录分析目录说明androidAndroid项目目录,包含了使用AndroidStudio开发项目的环境配置文件iosiOS项目目录，包含了XCode的环境node_module
JS新贵·2019-01-16 13:12

react-native 常见错误记录

1.unabletofindutility"instruments",notadevelopertoolorinPATH解决方法：https://stackoverflow.com/questions/39778607/error-running-react-native-app-from-terminal-ios2.react-native直接启动闪退，xcode启动正常解决方法：https:/
既然可以颠覆何必循规蹈矩·2019-01-16 11:17

react-native 常见错误记录

1.unabletofindutility"instruments",notadevelopertoolorinPATH解决方法：https://stackoverflow.com/questions/39778607/error-running-react-native-app-from-terminal-ios2.react-native直接启动闪退，xcode启动正常解决方法：https:/
既然可以颠覆何必循规蹈矩·2019-01-16 11:17

react-native——react-navigation的使用

在ReactNative中，官方已经推荐使用react-navigation来实现各个界面的跳转和不同板块的切换。react-navigation主要包括三个组件：StackNavigator导航组件TabNavigator切换组件DrawerNavigator抽屉组件StackNavigator用于实现各个页面之间的跳转，TabNavigator用来实现同一个页面上不同界面的切换，DrawerN
qq_42221334·2019-01-14 16:57

react-native-dva-starter搭建时遇到问题解决方案

所以前端三大框架只要熟悉了react就可以使用react-native开发应用，基本编写方式差不多，各位前端们也可以自豪的说我可以开发“原生应用”了。
citteey·2019-01-12 01:24

(踩坑回忆录)React-Native踩坑与解决方案

原文链接：https://segmentfault.com/a/1190000017855059前言问题textInput相关设置键盘隐藏与换行(ios)要在textInput标签使用keyboardType(指定键盘类型),returnKeyType(指定完成按钮类型)returnKeyType使用"done"遇到需要使用文本域类型(多行输入)，multiline={true}时，需设置onSu
weixin_34341117·2019-01-11 21:09

react-native SectionList 使用详解

勤做笔记，方便自己，帮助他人。属性ScrollViewprops...集成了scrollview的属性sections用来渲染的数据，类似于FlatList中的data属性。数据格式如下：[{title:'a',data:['a1','a2']},{title:'b',data:['b1','b2','b3']},{title:'c',data:['c1']},]initialNumToRende
既然可以颠覆何必循规蹈矩·2019-01-10 09:56

react-native SectionList 使用详解

勤做笔记，方便自己，帮助他人。属性ScrollViewprops...集成了scrollview的属性sections用来渲染的数据，类似于FlatList中的data属性。数据格式如下：[{title:'a',data:['a1','a2']},{title:'b',data:['b1','b2','b3']},{title:'c',data:['c1']},]initialNumToRende
既然可以颠覆何必循规蹈矩·2019-01-10 09:56

RN 经验文档（Android）

ReactNative路由跳转发送广播和接受事件通知DeviceEventEmitterA/B页面之间进行"通信"//A页面导入组件：import{DeviceEventEmitter}from'react-native
liuoomei·2019-01-09 00:00

React-Native之 Xcode 真机测试/打包

第一部分：真机测试一、修改APP图标和名称1.修改图标，如图：image.png注：图片命名规则：[email protected],[email protected]，图片的尺寸：2x:2x20,3x:3x20(用“x”前面的数字乘以pt前面的数字即可，其他的类似)2.修改名称，如图：image.png二、闪屏页修改在APPIcon空白页单机鼠标右键会出来下图中的选项image.png之后添加相应的图片就可以了，如图：im
灵魂深灵·2019-01-08 15:04

react-navigation RNGestureHandlerModule.State error

react-navigationerror最近正在使用react-native开发手机app，初次使用其进行开发中途确实遇到不少问题。
OutbreakUniverse·2019-01-05 17:47

初识react-native

1.安装node.js，在cmd命令下输入node-v可查看版本；（需配置环境变量）2.安装reactnative环境；3.安装androidsdk，因为androidsdk要依赖java环境，因此需要先安装jdk（建议jdk1.8及以上），在cmd命令下输入java-version可查看版本；（需配置环境变量）附上下载地址：http://www.androiddevtools.cn，打开网站，找
品味Code·2019-01-04 19:00

前端知识总结-2018上篇

，层出不穷，但是不变的点依旧存在：html,css,js“三架马车”依旧引领这前端的发展和展示着多样化、个性化的前端各类门户网站；前端目前的框架比较多，比较火的有：vue、react、angular、react-native
星光笔·2019-01-04 09:00

关于ReactNative0.56版本Flatlist列表内容跳动的问题

于是开始上react-native的issues上寻找答案，有通过查看官方的版本升级日志找到了答案：react-native升级日志0.57在其中看到如下bugFix描述：因为
似水流年·2019-01-04 00:00

react native练习

importReact,{Component}from'react'import{Platform,StyleSheet,Text,View,Image,FlatList}from'react-native
若水无痕·2019-01-03 00:00

react-native下拉刷新组件react-native-flatlist-pull

完成拉下拉刷新的功能后，老板要求下拉刷新要能自定义。于是到网上找了找，发现了react-native-pull这个开源库。但是这个库本身已经很久没更新，里面使用的还是被淘汰的listView，于是我到源码看了看，把列表替换成了flatList，顺便修复了几个bug。github地址：react-native-flatlist-pullreact-native-flatlist-pull是一个基于F
qq_40962320·2019-01-01 22:30

windows环境下搭建React-Native开发环境

前言：因为电脑是windows系统，为了开始React-Native的入坑之路，只能硬着头皮上了，搭建环境的路上走了很多的坑，现在我把我成功搭建的路子记录下来，希望帮助大家少走弯路，也让我以后再搭建的时候
Neral·2018-12-29 10:40

react-native-image-crop-picker(react-native 图片选择)

好记性不如烂笔头，今天把react-native-image-crop-picker总结下。废话不多说，开始。1.执行下面命令行：npmireact-native-image-crop-picker--savereact-nativelinkreact-native-image-crop-picker安卓配置1.在android/build.gradle添加以下代码allprojects{repo
Mr丶易客·2018-12-27 17:10

react-native image 设置默认图片

Image组件的引入图片提供了下面这几种类型：静态图片资源，网络图片资源静态资源引用方式：网络图片资源默认图片注意事项：图片上添加文字文字想添加背景图片Inside图片无法显示第一：检查是否资源请求正确，比如网络资源使用{uri}注意加上{},本地资源require没有{}第二：检查是否有设置宽高，没有设置是不会显示滴哦～ps:觉得还有那么一点点帮助，请点个赞，给予一下心灵安慰哈哈哈～ps:觉得还
小西瓜简书·2018-12-27 15:11

基于ReactNative实现动态加载

下载Demo代码之后发现用到了facebook开源的react-native框架。然后打算研究一下是否能模拟动态下发模块的效果。于是决定从以下几个方面来实现这个过程。
奇舞移动·2018-12-24 09:32

浅析 Realm 在 React-Native 中的使用

在开发中有些数据我们需要在本地进行持久化存储，在需要的地方调用。一般来说，我们会用到AsyncStorage来对数据进行持久化的存储，这是官方推荐使用的存储方式，类似于iOS中的NSUserDefault，区别在于，AsyncStorage只能存储字符串键值对，而NSUserDefault可以存储字符串和number。如此，当我们需要存储的数据规模较为庞大时，需要考虑选择另一种持久化的存储方式--
广州芦苇科技App·2018-12-21 15:39

react-native环境搭建出现的问题

前两天项研究react-native开发安卓，然后去react-native中文网看环境搭建的教程发现并不是很完整好多东西都没有提到解决问题。
还好还好L·2018-12-21 15:42

react-native 上传图片和视频到阿里云, 带进度条

实现上面的效果需要的库如下react-native-image-pickerreact-native-progress先来说下是如何实现点击上传图标弹出optionModal上传选项的动画的.整个optionModal区域是一个Animated.View,render的时候他的position是absolute的，整个位置是隐藏在屏幕下的，bottom:-200.点击按钮之后，用Animated.
撸啊撸·2018-12-21 00:00

react-native 类似tab的两个页面Segmented

勤做笔记，方便自己，帮助他人。代码地址：https://github.com/libinWeny/RNLibin1.gif核心代码如下：1.头部的一个切换按钮。这里我用的是蚂蚁金服的SegmentedControl组件，这个自己画也很简单。this.refs.ScrollView.scrollTo({x:W*e.nativeEvent.selectedSegmentIndex,animated:t
既然可以颠覆何必循规蹈矩·2018-12-20 17:37

react-native 类似tab的两个页面Segmented

勤做笔记，方便自己，帮助他人。代码地址：https://github.com/libinWeny/RNLibin1.gif核心代码如下：1.头部的一个切换按钮。这里我用的是蚂蚁金服的SegmentedControl组件，这个自己画也很简单。this.refs.ScrollView.scrollTo({x:W*e.nativeEvent.selectedSegmentIndex,animated:t
既然可以颠覆何必循规蹈矩·2018-12-20 17:37

React-Native code-push（Android）热更新完整篇

1、首先在项目中安装code-pushnpminstall-gcode-push-cli2、注册一个CodePush的账户code-pushregister3、添加一个Android项目（这个项目会在自己CodePush账户上创建一个相对应的工程项目，这里会返回两个环境的key，怎么使用自己随意）code-pushappaddandroidDemo(项目名称，自定义)androidreact-na
无灬痕·2018-12-20 14:21

【React-native】安卓运行报错 Could not install the app on the device, read the error above for details.

RN在IOS运行一切正常，准备去Android端测试发现报错，但是我设备启着的，于是乎根据提示./gradlewinstallDebug，却说我Permissiondenied错误截图：可能原因一gradlew权限不足导致react-nativerun-android失败解决方案执行如下命令：chmod+xgradlew可能原因二安卓运行后报错，在android/app/src/main/下创建a
程序员阿喵·2018-12-19 23:12

[React-Native PanResponder拖拽实现]

1.PanResnponder相关ApicomponentWillMount(){this.panResponder=PanResponder.create({/*****************要求成为响应者*****************///单机手势是否可以成为响应者onStartShouldSetPanResponder:(evt,gestureState)=>true,//移动手势是否
iOSTianNan·2018-12-19 14:32

react-native零基础用Xcode手动打包热更新

打开Xcode->File->Open打开rn项目中ios目录下的***.xcodeproj进行如下操作：在第3处填写项目名称、包名、版本号并且一般情况下4处是不打勾的。在在上图的第6处（如果是测试包在第5处）选择描述文件,你要是打adhot包就选adhot的描述文件,打appstore的包就选你做的appstore的描述文件然后点击Product->Archive进行编译点击Distribute
萝卜-兔子·2018-12-18 17:50

react-native android模拟器或真机上定时器setInterval和setTimeout失效

从Mac系统换到Windows，runandroid后真机和模拟器的定时器都不运行（Mac下runandroid不会），看了下https://github.com/facebook/react-native
骑马过海WULIbinbin·2018-12-18 15:33

react-native-art 绘制波浪动画

gif.gif直接看代码吧波浪组件WaveView.jsimportReact,{Component}from'react';import{View,ART,Dimensions}from'react-native
明天的天明·2018-12-17 16:38

2、React Native-Pushy发布

（这里只有iOS的部分其他的可以去官网查看链接）pushycreateApp--platformiosAppName:3、添加代码热更新功能获取appKeyimport{Platform,}from'react-native
学习abc·2018-12-17 09:37

React-Native集成dva.js

dvajs作为一个基于redux的状态管理框架，在react中的表现还是很不错的，如果我们想要在react-native应用中使用dvajs该怎么做呢？
weixin_30615767·2018-12-14 17:00
上一页 103 104 105 106 107 108 109 110 下一页
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他