React Native API

AppRegistry

AppRegistry是JS运行所有React Native应用的入口。

最常用的是：注册根组件
registerComponent(appKey, getComponentFunc)

AppRegistry.registerComponent('Test', () => SampleComponent);

AsyncStorage

异步存储读取

(第三方的)react-native-storage

AlertIOS

static alert(title, message?, callbackOrButtons?)
- callbackOrButtons:一个函数func(()=> void)或者button数组 ButtonsArray
- 默认情况下，Cancel和OK, func是点OK的方法
- ButtonsArray: 对象数组，有以下几个参数
- text:
- onPress:
- style: AlertButtonStyle
  - default
  - cancel
  - destructive
```
this.customButtons = [{
    text: 'Custom OK',
    onPress: this.saveResponse(按钮方法)
},
{
    text: 'Custom cancel',
    style: 'cancel',（default/cancel/destructive）
}
];
```
static prompt(title, message?, callbackOrButtons?, type?, defaultValue?) 有输入框的提示，可以用于提示用户名/密码输入
- type: AlertType
- default
- plain-text
- secure-text
- login-password
```
AlertIOS.prompt(
      'input your password', 
      null, 
      this.customButtons, 
      'login-password', 
      'userName')
```

ActionSheetIOS

static showActionSheetWithOptions(options, callback)

options 字符串数组,button title
cancelButtonIndex
destructiveButtonIndex
title
message
tintColor
callBack 回调func，

showActionSheet = ()=> {
 ActionSheetIOS.showActionSheetWithOptions({
     options: BUTTONS,
     cancelButtonIndex: CANCEL_INDEX,
     destructiveButtonIndex: DESTRUCTIVE_INDEX,
     tintColor: 'green',
     title: 'action sheet title',
     message: 'message'
 },

 (buttonIndex) => {
     this.setState({clicked: BUTTONS[buttonIndex]});
 });
};

static showShareActionSheetWithOptions(options, failureCallback, successCallback) 分享弹出框

url
message
subject 主题
excludedActivityTypes 弹出框中不显示的活动

showShareActionSheet = ()=> {
     UIManager.takeSnapshot('window').then((uri)=> {
         ActionSheetIOS.showShareActionSheetWithOptions({
             url: uri,
             message: 'message to go with shared url',
          subject: 'a subject to go in the email heading',
             excludedActivityTypes: [
                 'com.baidu.www'
             ]
         },
         (error) => alert(error),
         (success, method) => {
             var text;
             if (success) {
                 text = 'Shared via ${method}';
             } else {
                 text = 'You didn\'t share';
             }
             this.setState({text});
         });
     }).catch((error) => alert(error));
 }

PixelRatio

相当于iOS中的[UIScreen mainScreen].scale

static get()
- PixelRatio.get() === 1
  - mdpi Android devices (160 dpi)
- PixelRatio.get() === 1.5
  - hdpi Android devices (240 dpi)
- PixelRatio.get() === 2
  - iPhone 4, 4S
  - iPhone 5, 5c, 5s
  - iPhone 6
  - xhdpi Android devices (320 dpi)
- PixelRatio.get() === 3
  - iPhone 6 plus
  - xxhdpi Android devices (480 dpi)
- PixelRatio.get() === 3.5
  - Nexus 6

static getPixelSizeForLayoutSize(layoutSize)
将布局尺寸，转化为像素尺寸。返回的是整数数值

var image = getImage({
width: PixelRatio.getPixelSizeForLayoutSize(200),
height: PixelRatio.getPixelSizeForLayoutSize(100),
});

AppState

常用于推送通知

currentState 当前状态
addEventListener(type, handler) 添加事件监听
removeEventListener(type, handler)移除事件监听

NetInfo

获取网络状态和类型，用时再查找

CameralRoll

提供相册相关的功能

static saveToCameraRoll(tag, type?) 存储图片

type: 只能是photo 或者video
? 图片保存成功之后的回调

CameraRoll.saveToCameraRoll(imgURL + img2, 'photo', (url)=>{
photos.unshift(url);
_that.setState({
    photos: photos
});
AlertIOS.alert('图片保存成功');
}, ()=> {
AlertIOS.alert('图片保存失败');
});

static getPhotos(params) 获取图片

params 具体这里

var fetchParams ={
  first: 4,
  groupTypes: 'All',
  assetType: 'Photos',
};
var imgURL = 'http://vczero.github.io/lvtu/img/';

componentDidMount() {
 var _that = this;

 CameraRoll.getPhotos(fetchParams)
 .then((data)=> {
     console.log('====' + data.edges);
     var edges = data.edges;
     var photos = [];
     for (var i in edges){
         photos.push(edges[i].node.image.uri);
     }
     _that.setState({
         photos: photos
     });
 }, ()=> {
     alert('图片获取失败');
 });
}

第三方库 react-native-camera

Vibration

控制设备震动

Geolocation

处理位置信息

iOS
- plist 添加NSLocationWhenInUseUsageDescription字段
- 使用react-native init创建的项目，默认开启定位功能
Android
- AndroidManifest.xml 添加
static getCurrentPosition(geo_success, geo_error?, geo_options?) 获取当前位置信息
- geo_options
  - enableHighAccuracy ： bool，是否高精度
  - timeout 超时时间
  - maximumAge 多久之后再次获取，即重复获取时间间隔
static watchPosition(success, error?, options?) 监听位置变换信息
static clearWatch(watchID)
static stopObserving()

componentDidMount() {
   navigator.geolocation.getCurrentPosition(
       (position) => {
           var initialPosition = JSON.stringify(position);
           this.setState({initialPosition});
       },
       (error) => alert(JSON.stringify(error)),
       {enableHighAccuracy: true, timeout: 20000, maximumAge: 1000}
   );
   this.watchID = navigator.geolocation.watchPosition((position) => {
       var lastPosition = JSON.stringify(position);
       this.setState({lastPosition});
   });
}

数据请求

fetch封装程度更好

_postRequest(url, data, callback) {
   var opt = {
       method: 'POST',
       headers: {
           'Accept': 'application/json',
           'Content-Type': 'application/json',
       },
       body: JSON.stringify(data)
   };

   fetch(url, opt)
   .then((response) => response.json())
   .then((responseJson)=>{
       console.log(responseJson);
       callback(responseJson);

   })
   .catch((error)=>{
       console.warn(error);
   });
}