zoukankan      html  css  js  c++  java
  • React native 之android的图标和启动图片

    哎哎呀呀,上篇说到了react native的IOS的图标和启动图片的设置,其实最主要的是尺寸!相应的尺寸设定好了以后就不会报错了!

    ok~这篇说的是React native的android的图标和启动页面!!!!!

    1.图标:

    其实android的图标设置很简单,一般情况下只需要替换就可以了(当然你也可以不去替换,在资源管理的R.java里面设置也可以,这里不建议)

    注意的是在res的文件下的图片的命名不能出现改变,还有就是他每个尺寸也应该按照规定设定!!!

    2.启动页:

    在react-native的android中的启动图和IOS不相同点在于,android没有默认的启动图,(在IOS里面有,详情见上篇文章),那就需要我们用js自己编写程序去实现这张启动页:

    思路:在android.js里面给入口组件包装导航-----在启动页中设置定时器,在页面渲染结束后的2s后执行repalce()跳转函数跳转到主页面,启动页面的核心代码如下:

    export default class Lang extends Component {
      render(){
        return(
              <View style={styles.container}>
              <Image source={require('./img/lang.png')} style={styles.ig}/>
              </View>
    
        )
      }
      //在UI初始化渲染结束后,系统自动调用此函数。主要是用于定时器、网络请求
      componentDidMount(){
        //设置定时器,相隔2s后切换到主页面
        setTimeout(
          ()=>{
            //页面的切换,用到无缝切换函数replace
          // console.log('aa')
          //ok !既然我们需要跳转~那么问题来了~我们需要给组件包装一个导航器。注意:一个APP只有一个导航器,即使导航里面的组件页面又存在导航,系统的diff算法只会认定后面的导航,也就是还是一个导航
          //我们在andorod.js 目录里面给lang 组件包装一个导航器,然后就可以使用下面的函数啦~
          this.props.navigator.replace(
            {
              component:Nav,   //切换到具体的板块
            }
          )
        },1000
        );
      }
    } 

    在android页面里包装导航:

  • 相关阅读:
    按钮UIButton内图片和文字位置的设置(两种方式)
    关于Xcode上的Other linker flags基本介绍
    GCD定时器
    线程间的通信(3种方式)
    scrollView中内部控件的悬停
    十七:字符串文件的读写
    十六:NSString的创建以及相关细节
    十五:NSValue
    react生命周期遇到的问题
    笔记----深入浅出《React和Redux》第四章
  • 原文地址:https://www.cnblogs.com/allenxieyusheng/p/5804023.html
Copyright © 2011-2022 走看看