'2017/06/14'에 해당되는 글 1건

  1. 2017.06.14 React-Native Navigator

react-native-router-flux 

Install  $npm i react-native-router-flux --save

https://github.com/aksonov/react-native-router-flux


기본 Navigator는 원하는 기능이 아직 지원하지 않는다. 

그래서 선택한 Navigator 사용하기도 편하다는 장점이 있다. 


단점 : 

ActionBar의 사이즈 아래에 Content를 만들어야 한다. MarginTop android: 53, IOS : 64


예)

import React, {Component} from 'react';
import {
  AppRegistry,
  Platform,
} from 'react-native';

import {  Router, Scene } from 'react-native-router-flux';

import SplashScreen from './src/SplashScreen';
import HomeScreen from './src/HomeScreen';

class Index extends Component {

  render() {
    return(
      
        
          

            
          
      
    );
  }
}

AppRegistry.registerComponent('TestProject', () => Index);

SplashScreen에서 Navigator를 안보이도록 hideNavBar={true}

이동되는 HomeScreen을 Navigator의 처음으로 설정 type="replace"


SplashScreen에서 Home화면으로 이동 시 

import React, {Component} from 'react';
import {
  View,
  Text,
  StyleSheet,
} from 'react-native';

import { Actions } from 'react-native-router-flux'; // New code

class SplashScreen extends Component {

  render() {
    return(
        
          Actions.home()}>
              This is Splash Screen!!!
          
        
    );
  }
}


기타 자세한 내용은 https://github.com/aksonov/react-native-router-flux

Posted by 천류성
이전버튼 1 이전버튼

블로그 이미지
.....
천류성

태그목록

공지사항

Yesterday0
Today1
Total15,757

달력

 « |  » 2017.06
        1 2 3
4 5 6 7 8 9 10
11 12 13 14 15 16 17
18 19 20 21 22 23 24
25 26 27 28 29 30  

최근에 달린 댓글

최근에 받은 트랙백

글 보관함