TextButton

박동규·2023년 11월 22일
0

Widgets

목록 보기
11/18

TextButton은 Flutter에서 사용되는 기본적인 버튼 위젯 중 하나로, 주로 텍스트를 표시하는 버튼을 만드는 데 사용됩니다. 간단하고 스타일링하기 쉬워, 다양한 UI 요소에 적용될 수 있습니다.

주요 특징

  1. 간단한 텍스트 기반의 버튼: 텍스트를 중심으로 하는 간단한 버튼을 만들 때 사용됩니다.
  2. 스타일링 유연성: 텍스트 스타일, 배경색, 패딩 등을 사용자 정의할 수 있어 다양한 디자인 요구사항에 맞출 수 있습니다.
  3. 머티리얼 디자인 규칙 준수: Flutter의 Material 디자인 철학을 따릅니다.
  4. 온프레스(onPressed) 콜백: 버튼이 탭될 때 실행될 함수를 지정할 수 있습니다. 이를 통해 버튼 클릭 시 특정 액션을 수행할 수 있습니다.

사용 예시

TextButton(
  onPressed: () {
    // 버튼 클릭 시 수행할 동작
  },
  child: Text('Click Me'), // 버튼 내부에 표시될 텍스트
  style: TextButton.styleFrom(
    primary: Colors.white, // 텍스트 색상
    backgroundColor: Colors.blue, // 배경 색상
    padding: EdgeInsets.all(16), // 내부 패딩
  ),
)

이 예시에서 TextButton 위젯은 "Click Me"라는 텍스트를 포함하고 있으며, 클릭 시 정의된 함수를 호출합니다. styleFrom 메서드를 사용하여 버튼의 스타일을 사용자 정의할 수 있습니다.

사용 시 고려 사항

  • 활성화/비활성화 상태onPressed 콜백이 null이면 버튼이 비활성화 상태가 되며, 사용자 입력을 받지 않습니다.
  • 접근성: 텍스트 버튼을 사용할 때는 접근성을 고려하여, 버튼의 목적을 명확히 하는 텍스트를 사용하는 것이 중요합니다.

TextButton은 텍스트 중심의 간단한 인터랙션을 위한 버튼이 필요할 때 유용하게 사용됩니다.

하지만 TextButton은 Material적 느낌이 강하기 때문에 GestureDetector을 사용한 Custom UI를 사용하기를 권장한다.

profile
내가 원하는 것을 만들자

0개의 댓글