[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
을 사용하여 툴팁의 배경색을 파란색으로, 텍스트 스타일을 흰색으로 변경했습니다.
결론
플러터에서 기본 툴팁을 사용하는 방법과 툴팁을 커스터마이즈하여 스타일링하는 방법을 살펴보았습니다. 이를 통해 앱의 사용자 경험을 더욱 향상시킬 수 있습니다.
더 많은 정보를 원하시면 공식 플러터 문서를 참조하세요.