随笔分类 - React-Native
跨平台开发
摘要：一、简介 接上篇文章，继续研究PickerIOS组件，这个组件是RN中专门针对iOS平台封装的。它的用法与Picker组件相同，都是要配置子项一起使用。它的子项组件PickerIOS.Item组件。当然，PickerIOS组件与Picker组件还有一个区别就是PickerIOS组件支持对文本样式的一
阅读全文
摘要：一、简介 本系列博客已经介绍过了日期选择器的使用，日期选择器是高度封装的组件，开发者可以选择最原始的选择器组件Picker组件进行定制，它是跨平台的组件。Picker组件需要配合Picker.Item组件一起使用。Picker.Item组件是Picker组件的子项，用来设置Picker组件值的。Pi
阅读全文
摘要：一、简介 在iOS端切换控制器的方式大致有三种，分别是导航、标签、模态，在ReactNative中也有这三种方式可以实现。在前面的文章中已经实现了用导航和标签切换页面，同样地，RN中也有一个模态组件Modal组件来进行页面的切换。 二、API Modal组件提供的属性不多，但是都比较常用，现在来分析
阅读全文
摘要：一、简介 在前面介绍过了FlatList列表组件用来展示大量的数据，ListView组件也是同样地功能。虽然ListView组件已经过时，但是作为新手还是有必要了解一下。它们的API差不太多，但是ListView组件使用起来确实要比FlatList列表组件复杂一下。ListView组件是一个垂直滚动
阅读全文
摘要：一、简介 在前面使用了TextInput实现了文本输入和搜索功能，一般情况下，我们会通过样式设置把控键盘弹起后与视图的间距，以至于不会挡住某些视图。但是，如果视图上的组件比较多，键盘的弹起覆盖某些视图几乎是无法避免的。ReactNative中就提供了一个KeyboardAvoidingView组件来
阅读全文
摘要：一、简介 ImageStore组件是ReactNative中用来存储图片的，支持通过uri从内存中获取和移除图片，也支持二进制图片的存储和获取。ImageStore组件提供的API就只有4个静态函数，使用起来比较简单。 二、API 1、通过uri获取图片 2、通过uri移除图片 3、存储图片的bas
阅读全文
摘要：一、简介 图片在应用中的使用非常常见，绚丽的图片能使App增色不少。当设计师给开发者一张图片后，有时根据情况需要用到该图片中的某一部分，当然研发可以让设计师再设计一张，其实，还有其他的办法可以实现，例如绘制指定局域的图片、裁剪图片等。在ReactNative中，提供了图片裁剪组件ImageEdito
阅读全文
摘要：一、简介 在前面介绍Text组件时，我们将其封装过列表组件，用来显示大量的数据。ReactNative中对于大量数据清单列表展示的需求，有提供可用的列表组件，FlatList组件就是其中之一。FlatList组件的功能非常强大，既可以展示和增删数据，也可以支持下拉刷新和上拉加载，跟iOS中的UITa
阅读全文
摘要：一、简介 在App中，时间选择器使用的场景还是比较多的，例如选择外卖的送货时间、物流的收货日期等等。在ReactNative中提供了一个日期选择器组件DatePickerIOS，这个是iOS平台使用的。它的API也比较简单，一般实际开发中需要再次封装使用。 二、API 组件中常用属性如下 三、使用
阅读全文
摘要：一、简介 按钮组件在开发中最常见不过了，有文字，有事件，使用简单，直接看API。注意此按钮组件无法显示图片，如果需要显示图片，可以使用TouchableOpacity等可触摸组件配合Image组件自定义按钮。 二、API 常用的属性和函数如下： 三、使用 将其作为View的子组件，设置大小背景色，示
阅读全文
摘要：一、简介 在App开发中，当某一个耗时的活动或者事件被触发后，经常需要显示一个loading，表示正在等待过程中。除了第三方提供的比较完善的吐司框架外，还可以使用原生的活动指示器显示。在ReactNative中提供了ActivityIndicator组件，可以用来显示一个loading。 二、API
阅读全文
摘要：一、简介 网络监听，这是App开发中必不可少的功能。开发者会根据网络状态的不同，对App采取不同的应对措施来应对网络问题。例如，在WIFI状态下，用户可以浏览大图或者自动播放视频，在离线状态下，要关闭正在加载的Loading，通过提示用户网络状态不好，以避免长时间等待，提高用户体验。在iOS移动端开
阅读全文
摘要：一、简介 App在运行的整个过程中，它会有不同的运行状态，例如激活失活状态、前后台进入和离开状态等。开发者可以根据App的不同状态选择合适的时机完成需要的工作。ReactNative中提供了AppState这个API来告知App的状态，它还可以通知状态的改变、甚至用于消息通知的推送等。 二、API
阅读全文
摘要：一、简介 在iOS中可以使用UIStatusBar控件改变App的状态栏，同样地，React-Native中可以使用StatusBar组件来控制。 二、API 属性： 方法： 三、使用 使用方法设置 使用属性设置
阅读全文
摘要：在RN开发中，ReactNative框架中提供了大量的API、组件以及插件等提供开发者使用，在前面已经大概介绍了一些。详情的内容如下所示。 1、组件部分： 2、API部分 3、插件部分 5、类型部分 6、弃用部分
阅读全文
摘要：一、简介 在上一篇文章中，详细介绍了对话框组件，除此之外，React-Native系统还给开发者提供了一个弹框框组件ActionSheetIOS组件，它的弹出方式与对框框不同，它是从底部弹出，与iOS系统提供的UIActionSheet( deprecated in iOS 8)类似。使用Actio
阅读全文
摘要：一、简介 在使用一款App的时候，经常会用到对话框进行信息的友好提示，一般简单要求性不高的时候我们可以使用web提供的alert实现即可。但是，对于需要交互性和美观性的对话框，alert就明显无法满足需求了，首先alert对话框比较丑陋，不符合我们的业务和审美需求，此时如果我们去定制的话，稍微有些浪
阅读全文
摘要：一、简介 AsyncStorage是一个简单的具有异步特性可持久化的键值对key-value的存储系统。它对整个APP而言，是一个全局的存储空间，可以用来替代H5中提供的window属性LocalStorage。AsyncStorage跟iOS中的偏好设置NSUserDefault很类似，也是通过p
阅读全文
摘要：一、简介 每一个应用程序的运行都有一个入口文件或者入口函数，例如iOS中的使用UIApplicationMain类完成入口函数的实现，在React-Native中，AppRegistry类就肩负着这个责任。AppRegistry主要负责运行React-Native应用程序的JavaScript入口，
阅读全文
摘要：一、简介 在移动端开发中，很多时候需要嵌入一个网页来帮助实现某一个活动，这方式大大提高了活动快速迭代的灵活性，在RN中，同样也这么处理这种情况的。其实，这种混合式开发称为Hybird APP，它们就是基于WebView来实现的。React-Native中的WebView组件提供的功能基本满足需求，现
阅读全文