프론트/React Native, React

[리액트네이티브] react-native Dimension 화면 비율 맞추기

연지양갱 2023. 6. 26. 22:30
728x90
반응형
SMALL

핸드폰 마다 길이 값이 다르게 생겼기 때문에

width나 height를 각 픽셀 값으로 주면

실행했을때

조금 깨지거나 이상한 부분에 들어갈 수 있다

그래서

%로 많이 사용하는데

나는

Dimension을 사용한다

css에서

사용하는 부분은

 

    container: {
        flex: 1,
        backgroundColor: '#fff',
        width:Dimensions.get('window').width,
        height:Dimensions.get('window').height,
    },

이렇게 많이 사용한다

Dimensions . get 에는

window와 screen이 있다ㅏ

  • window : 현재 앱에서 사용할 수 있는 영역의 크기를 가져온다.
  • screen : 전체 화면의 크기를 가져온다.

https://devbksheen.tistory.com/entry/React-Native-%ED%99%94%EB%A9%B4-%ED%81%AC%EA%B8%B0-%EC%A1%B0%ED%9A%8C%ED%95%98%EA%B8%B0

 

React Native 화면 크기 조회하기

리액트 네이티브에서 화면 크기를 dp 단위로 가져오는 방법은 두 가지가 있다. 1. Dimensions.get import {Dimentsions} from 'react-native'; const { width, height } from Dimensions.get('window'); Dimensions.get에는 두 가지 문

devbksheen.tistory.com

 

반응형