Mobile Develop

MediaQuery.propertyOf

suojae 2025. 8. 25. 16:58

공식문서 링크: https://api.flutter.dev/flutter/widgets/MediaQuery-class.html

공식 유튜브 링크: https://www.youtube.com/watch?v=xVk1kPvkgAY

 

 

문제상황

키보드가 올라와서 UI가 안보이는 상황에 대처할 때 ViewInset 값이 필요하다.

이때 final viewInsets = Mediaquery.of(context).viewInsets; 
을 통해 겹치는 부분만큼 패딩값을 주는 상황이 종종있다.

 

 

MediaQuery.propertyOf 활용

비교를 위해 자동으로 바텀에다 인셋넣어주는 기능은 껐다

이때 위 예시처럼 Mediaquery.of(context) 를 사용하게 되면 Mediaquery로 인해 가져오는 모든 값들을 불필요하게 계산된다.

예를들어 orientation(방향) 이라든지, highContrast(고대비) 이라든지 textScaler(텍스트 크기배율) 이라든지 불필요한 정보가 모두 계산되는 것이다.  

 

키보드에 안가리게 컴포넌트를 올릴때 필요한 정보는 사실상 viewInset bottom 이므로 이부분만 계산을 해줄 순 없을까?

 

그때 바로 MediaQuery 내 특정한 값만 연산을 시켜주어 값을 사용하는 propertyOf를 사용한다. 위 예시의 경우에는  MediaQuery.viewInsetsOf(context) 을 사용할 수 있겠다. 이럴경우 다른 불필요한 데이터는 계산하지않고 오직 viewInset 만 계산하게 되어 최적화를 시킬 수 있다.