[react-navigation]3

jines100·2020년 2월 4일
0
class Home extends React.component {
//static navigationOptios = ({navigation, navigationOptions, sceenProps}) => {
// 함수로 처리하면 navigation 을 이용해서 버튼에 커스텀 기능과 네비게이션 구현 가능
  static navigationOptios = {
    title: "dddd",
    headerStyle: {	// 스타일 적용
      backgroundColor: '#ff00ff',
    },
    headerTintColor: '#00ff00',
    headerTitleStyle: {
      backgroundColor: '#ff00ff',
    },
    header: ()=> <HeaderComponent/>, // 해더 전체 적용
    headerTitle: ()=> <HeaderTitle/>, // 해더 타이틀만 적용
    headerLeft: ()=> <HeaderLeft/>, // 해더 left만 적용
    headerRight: ()=> <HeaderRight/>, // 해더 right 만 적용
  }
}

Default navigationOptions setting

기본셋팅은 상위 stack 에서 관리한다.
const AppNavigator = createStackNavigator(
  {
    Home: HomeScreen,
    Details: DetailsScreen,
  },
  {
    initialRouteName: 'Home',
    defaultNavigationOptions: {
      headerStyle: {
        backgroundColor: '#f4511e',
      },
      headerTintColor: '#fff',
      headerTitleStyle: {
        fontWeight: 'bold',
      }
    }
  }
);
profile
Front Developer

0개의 댓글