react native ActivityIndicator 和Platform的使用

  • 效果图 进去首先会弹出运行的环境是安卓
    在这里插入图片描述
  • ActivityIndicator 效果图
    在这里插入图片描述
import {
    
     Text, StyleSheet,Platform, View,ActivityIndicator } from 'react-native'
import React, {
    
     Component } from 'react'

export default class Nav1 extends Component {
    
    
  render() {
    
    
      //判断当前设备的环境
      if(Platform.OS=== 'android'){
    
    
        alert('安卓')
      }else if(Platform.OS==='ios'){
    
    
          alert('ios')
      }

    return (
      <View style={
    
    [styles.container]}>
          <ActivityIndicator
            color={
    
    "pink"}
            size={
    
    'large'}
          />
          <ActivityIndicator
            color={
    
    "red"}
            size={
    
    'small'}
          />
          {
    
    /* 数字指定大小只在安卓下有效 */}
          <ActivityIndicator
            color={
    
    "green"}
            size={
    
    100}
          />
      </View>
    )
  }
}

const styles = StyleSheet.create({
    
    
    container:{
    
    
        flex:1,
        justifyContent:'space-around',
    }
})

猜你喜欢

转载自blog.csdn.net/afufufufu/article/details/126544992
今日推荐