[译]React Native 开源仿照 Android 平台的 Toast 组件 (react-native-sk-toast)

项目介绍

该Sk-Toast组件仅仅视频iOS平台，该是仿照Android平台Toast组件效果

刚创建的React Native技术交流2群(496601483)欢迎各位大牛,React Native技术爱好者加入交流!

配置安装

1.命令行运行npm install react-native-sk-toast@latest --save

2.在XCode中,选择导航项目右击点击Libraries ➜ Add Files to [当前项目]

3.切换到node_modules目录 ➜ 选择react-native-sk-toast ➜ ios and add ReactNativeToast.xcodeproj

4.添加 libReactNativeToast.a (from 'Products' under ReactNativeToast.xcodeproj)到项目Build Phases ➜ Link Binary With Libraries phase

查看图片

5.下面进行写代码

'use strict';

var React = require('react-native');
var {
  AppRegistry,
  View,
  Text,
  TouchableOpacity,
  StyleSheet
} = React;
var Toast = require('react-native-sk-toast');
var Screen = require('Dimensions').get('window');

var nostalgia = React.createClass({
  topToast: function(){
    Toast.top('top toast');
  },
  centerToast: function(){
    Toast.center('center toast');
  },
  bottomToast: function(){
    Toast.bottom('bottom toast');
  },
  render: function(){
    return (
      
        
            top
        
        
            center
        
        
            bottom
        
      
    )
  }
});

var styles = StyleSheet.create({
  container:{
    flex:1,
    alignItems: 'center',
    justifyContent: 'space-around'
  },
  button: {
    width: 70,
    height: 30,
    justifyContent: 'center',
    backgroundColor: 'yellow',
    borderColor: 'blue',
    borderWidth: 3,
    borderRadius: 5,
  },
  txt: {
    textAlign: 'center'
  }
});

运行截图

查看图片