[flutter] RaisedButton 위젯의 속성과 사용법

07 Dec 2023

flutter

Flutter에서 RaisedButton은 눌리거나 클릭되었을 때 특정 작업을 수행할 수 있는 버튼 위젯입니다. 이번 글에서는 RaisedButton의 다양한 속성과 사용법에 대해 알아보겠습니다.

속성

RaisedButton의 주요 속성은 다음과 같습니다:

child: RaisedButton 내에 표시될 위젯 또는 텍스트를 지정합니다.
onPressed: RaisedButton이 눌렸을 때 호출될 콜백 함수를 정의합니다.
color: RaisedButton의 배경색을 설정합니다.
textColor: RaisedButton 내의 텍스트 색상을 설정합니다.
shape: RaisedButton의 모양을 지정합니다.
elevation: RaisedButton의 고도를 설정하여 그림자 효과를 줄 수 있습니다.

사용법

RaisedButton을 사용하는 예제 코드는 다음과 같습니다:

RaisedButton(
  child: Text("Click Me"),
  onPressed: () {
    // 버튼이 클릭되었을 때 실행될 코드
    print("Button clicked");
  },
  color: Colors.blue,
  textColor: Colors.white,
  shape: RoundedRectangleBorder(
    borderRadius: BorderRadius.circular(8.0)
  ),
  elevation: 4.0,
)

위 예제에서는 “Click Me”라는 텍스트가 포함된 RaisedButton을 생성하고, onPressed 콜백 함수에서는 버튼이 클릭되었을 때 “Button clicked”라는 메시지를 출력합니다. RaisedButton의 배경색은 파란색으로, 텍스트 색상은 흰색으로 설정되었습니다. 또한, RaisedButton의 모양은 8.0의 borderRadius를 가진 RoundedRectangleBorder으로 지정되었으며, elevation을 4.0으로 설정하여 그림자 효과를 줍니다.

참고 자료

다음은 Flutter RaisedButton 위젯과 관련된 참고 자료입니다:

RaisedButton 위젯을 사용하여 동적인 화면 구성 및 사용자와의 상호작용을 간편하게 구현할 수 있습니다. 위 예제를 참고하여 다양한 버튼 스타일 및 동작을 구현해 보세요!