Flutter 앱에서 메인 메뉴를 디자인하고 싶을 때, FlatButton을 사용하여 간단하고 효과적으로 디자인할 수 있습니다.

FlatButton 위젯 사용

FlatButton은 터치하면 반응하는 버튼을 만들어주는 Flutter 위젯입니다. 아래는 간단한 예제 코드입니다.

FlatButton(
  onPressed: () {
    // 버튼을 눌렀을 때 수행할 동작
  },
  child: Text('메뉴 1'),
)

버튼 스타일링

FlatButton은 기본적인 텍스트 버튼을 제공하며, 다양한 스타일을 적용할 수 있습니다. 예를 들어, color, textColor, splashColor 등의 속성을 이용하여 버튼의 색상과 텍스트 색상, 터치 시 효과의 색상을 지정할 수 있습니다.

FlatButton(
  onPressed: () {
    // 버튼을 눌렀을 때 수행할 동작
  },
  child: Text('메뉴 1'),
  color: Colors.blue,
  textColor: Colors.white,
  splashColor: Colors.lightBlue,
)

아이콘 추가

FlatButton에 아이콘을 추가할 수도 있습니다. icon 속성을 사용하여 아이콘을 지정할 수 있습니다.

FlatButton(
  onPressed: () {
    // 버튼을 눌렀을 때 수행할 동작
  },
  child: Row(
    children: <Widget>[
      Icon(Icons.menu),
      Text('메뉴 1'),
    ],
  ),
)

메인 메뉴를 디자인할 때 위의 방법을 활용하여 다양한 디자인 요소를 추가하여 보다 멋진 버튼을 만들 수 있습니다.

더 많은 스타일링 옵션 및 버튼 디자인 방법은 Flutter 공식 문서를 참고하시기 바랍니다.