1. 程式人生 > >React native 之android的圖示和啟動圖片

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()跳轉函式跳轉到主頁面,啟動頁面的核心程式碼如下:

123456789101112131415161718192021222324252627export 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頁面裡包裝導航: