이번에는 플러터 앱을 개발하면서 자주 사용되는 get 메서드와 화면 크기에 대응하는 방법에 대해 알아보겠습니다.

1. get 메서드 활용하기

플러터에서는 각종 속성이나 객체를 가져오거나 접근할 때 MediaQuery.of(context).size.width 와 같은 방식으로 접근합니다. 하지만 이런 방법은 코드의 가독성을 떨어뜨리고, 일일이 길게 작성해야하는 단점이 있습니다.

이때 get과 같은 확장(extension) 기능을 사용하면 코드를 간결하게 작성할 수 있습니다.

예시:

extension ContextSize on BuildContext {
  double get screenWidth => MediaQuery.of(this).size.width;
  double get screenHeight => MediaQuery.of(this).size.height;
}

위와 같이 ContextSize라는 이름의 확장을 만들어 screenWidth와 screenHeight라는 속성을 정의한 후, 이를 활용하면 다음과 같이 간결하게 화면 크기에 접근할 수 있습니다.

예시:

context.screenWidth
context.screenHeight

2. 화면 크기에 대응하기

화면 크기에 따라 UI를 다르게 보여주고 싶을 때, MediaQuery를 사용하여 화면 사이즈에 대응할 수 있습니다.

예시:

Container(
  width: context.screenWidth * 0.5,  // 화면 너비의 반만큼 너비 지정
  height: context.screenHeight * 0.3,  // 화면 높이의 30%만큼 높이 지정
  color: Colors.blue,
  child: Center(
    child: Text('Responsive UI'),
  ),
)

위와 같이 screenWidth와 screenHeight를 활용하여 Container의 너비와 높이를 지정함으로써 화면 크기에 반응하는 UI를 만들 수 있습니다.

간단한 예제를 통해 get 메소드와 화면 크기에 대응하는 방법을 소개했습니다. 이를 응용하여 화면 크기에 따라 적합한 UI를 제공하는 다양한 기능을 구현할 수 있습니다.

더 많은 정보는 flutter.dev에서 확인할 수 있습니다.