study: 리네다기 | 7장 - Stack Navigator와 OS 별 정렬, useWindowDimensions

Stack Native 의 headerTitle 에는 문자열도 넣을 수 있지만
컴포넌트를 넣어줄 수도 있다

iOS 는 컴포넌트가 기본적으로 중앙에 정렬되고
Android 는 좌측 정렬을 사용한다

타이틀이 헤더 전체 영역을 사용하도록 하려면 화면 크기를 가져와서 dp 단위 크기를
직접 설정해줘야 한다

화면 크기 조회하기

import {Dimensions} from 'react-native';

const { width, height } = Dimensions.get('window');

Dimensions 에 window 나 screen 을 넣어줄 수 있음
iOS 는 window 와 screen 에 차이가 없지만
Android 는 차이가 있다
window 는 현재 앱에서 사용할 수 있는 화면 (상태 바와 소프트 메뉴 바 영역을 제외한 영역)
screen 은 전체 화면 크기를 반환함

화면 회전을 대응하거나 할 때는 Dimensions 리스너를 사용한다

import React from 'react';
import {useWindowDimensions} from 'react-native';

function MyComponent() {
  const {width, height} = useWindowDimensions();
}

useWindowDimensions Hook 을 사용하면 리스너 없이 변경된 값을 받을 수 있다