[flutter] 플러터에서 Tooltip 스타일링하기

툴팁(Tooltip)은 플러터(Flutter) 앱에서 사용자에게 추가 정보를 제공하는데 유용한 위젯입니다. 기본적으로 제공되는 툴팁은 플랫폼 디자인의 스타일을 따르지만, 때로는 앱의 디자인과 일치하도록 커스터마이즈해야 할 수도 있습니다.

기본 툴팁 사용

플러터에서 기본 툴팁을 사용하는 방법은 간단합니다. 아래는 간단한 예시 코드입니다.

Tooltip(
  message: 'This is a tooltip',
  child: Icon(Icons.info),
)

위 코드는 정보 아이콘을 클릭하면 “This is a tooltip” 메시지가 표시되는 기본 툴팁을 생성합니다.

툴팁 스타일링

툴팁을 커스터마이즈하여 앱의 디자인에 맞게 스타일링하려면 TooltipTheme을 사용할 수 있습니다. 예를 들어, 아래와 같이 TooltipTheme을 사용하여 툴팁의 색상과 텍스트 스타일을 변경할 수 있습니다.

TooltipTheme(
  data: TooltipThemeData(
    decoration: BoxDecoration(
      color: Colors.blue,
      borderRadius: BorderRadius.circular(4.0),
    ),
    textStyle: TextStyle(color: Colors.white),
  ),
  child: Tooltip(
    message: 'Customized tooltip',
    child: Icon(Icons.info),
  ),
)

위 예제에서는 TooltipTheme을 사용하여 툴팁의 배경색을 파란색으로, 텍스트 스타일을 흰색으로 변경했습니다.

결론

플러터에서 기본 툴팁을 사용하는 방법과 툴팁을 커스터마이즈하여 스타일링하는 방법을 살펴보았습니다. 이를 통해 앱의 사용자 경험을 더욱 향상시킬 수 있습니다.

더 많은 정보를 원하시면 공식 플러터 문서를 참조하세요.