플러터(Flutter) 앱에서 FloatingActionButton은 사용자가 주요 작업을 수행할 때 클릭할 수 있는 원형 아이콘 버튼입니다. 이 기사에서는 플러터에서 FloatingActionButton을 만들고 사용하는 방법을 알아볼 것입니다.

FloatingActionButton 추가하기

플러터 앱의 화면에 FloatingActionButton을 추가하려면 Scaffold 위젯 내에 floatingActionButton 속성을 사용하여 추가할 수 있습니다.

Scaffold(
  // 다른 속성들...
  floatingActionButton: FloatingActionButton(
    onPressed: () {
      // 클릭 이벤트 처리
    },
    child: Icon(Icons.add),
  ),
)

위 예제에서 onPressed 속성은 버튼이 클릭될 때 실행할 함수를 정의합니다. child 속성은 FloatingActionButton 내에 표시할 아이콘을 정의합니다.

FloatingActionButton 속성

FloatingActionButton에는 여러 가지 속성이 포함되어 있습니다. 몇 가지 중요한 속성은 다음과 같습니다:

• onPressed: 버튼 클릭 시 실행할 함수를 정의합니다.
• child: FloatingActionButton 내에 표시할 아이콘을 정의합니다.
• backgroundColor: FloatingActionButton의 배경색을 정의합니다.

이 외에도 tooltip, heroTag, elevation 등의 속성들이 있습니다.

결론

이제 플러터에서 FloatingActionButton을 추가하고 기본 속성을 설정하는 방법에 대해 알아보았습니다. 이를 통해 사용자가 주요 작업을 쉽게 수행할 수 있는 인터랙티브한 버튼을 추가할 수 있을 것입니다.

참고문헌:

• https://api.flutter.dev/flutter/material/FloatingActionButton-class.html