플러터 앱을 개발하다 보면, 화면에 속성이나 상태에 따라 다양한 위젯들이 표시되거나 숨겨져야 할 때가 있습니다. 날씨 정보를 표시하는 화면에서 사용 가능한 방법 중 하나는 사용자가 다양한 도시의 날씨를 차례로 확인할 수 있는 기능입니다. 이번 블로그에서는 Visibility 설정을 이용하여 날씨 정보를 관리하는 방법에 대해 다뤄보겠습니다.

1. Visibility 설정

Visibility 위젯은 자식 위젯이 화면에 나타나거나 사라지도록 할 수 있는 기능을 제공합니다. Visibility 위젯은 visible, invisible, gone 세 가지 모드를 가지고 있어서, 자식 위젯을 보이게 하거나 숨길 수 있습니다.

Visibility(
  visible: true,  // true면 보이고, false면 보이지 않음
  child: Text('날씨 정보'),
)

위의 예시에서 visible 속성을 true로 설정하면, Text 위젯이 화면에 나타납니다. 반면에 visible을 false로 설정하면 Text 위젯이 화면에서 사라집니다.

2. 날씨 정보 관리하기

날씨 정보를 화면에 표시하고, 사용자가 다른 도시의 날씨를 확인할 수 있는 기능을 구현하려면 Visibility 위젯을 활용하여 각 도시의 날씨 정보를 관리할 수 있습니다.

bool seoulWeatherVisible = true;
bool busanWeatherVisible = false;

Column(
  children: [
    Visibility(
      visible: seoulWeatherVisible,
      child: Text('서울의 날씨 정보'),
    ),
    Visibility(
      visible: busanWeatherVisible,
      child: Text('부산의 날씨 정보'),
    ),
  ],
)

위의 예시에서 seoulWeatherVisible와 busanWeatherVisible 변수를 통해 서울과 부산의 날씨 정보를 관리합니다. 이를 통해 사용자가 도시를 변경하는 등의 액션에 따라 각 도시의 날씨 정보를 표시하고 숨길 수 있습니다.

결론

플러터의 Visibility 설정을 활용하여 날씨 정보를 동적으로 관리하는 방법에 대해 알아보았습니다. Visibility를 활용하면 화면에 표시되는 위젯을 동적으로 제어할 수 있어서, 다양한 상황에 맞게 유연하게 화면을 구성할 수 있습니다.

플러터 공식 문서에서 Visibility 위젯에 대해 더 자세히 알아볼 수 있으니, 관심 있는 분들은 확인해 보시기를 추천드립니다.

Flutter Visibility 위젯 공식 문서