[GetX] getX 사용해서 snackbar 구현

snackbar는 앱에서 수행했거나 앞으로 수행할 작업을 사용자에게 알려주는 UI 요소이다. 일시적으로 화면 하단에 나타난다.

getX 사용하기

1. 종속성 추가

flutter파일에 pubspec.yaml파일이 존재한다. 여기에 들어가서 dev_dependencies탭에 아래의 명령어를 추가해준다.

get: ^4.6.5

그러면 종속성이 알아서 추가된다. 가끔가다가 추가가 안되는 경우가 존재하는데, 이럴 경우에는

flutter pub get

반응형

명령어를 쳐서 종속성을 설치해준다.

2. import 하기

import 'package:get/get.dart';

getX를 사용하고자 하는 파일에 상위에 import를 하여 패키지를 가져온다.

3. GetMaterialApp로 사용하기

이를 바로 사용하려면 안되고 materialApp으로 되어 있는 곳으로 가서 GetMaterialApp으로 교체해야 한다. 이 작업까지 마치게 되면 getX기능을 사용할 수 있다.

snackbar 구현하기

Get.snackbar(
  title,
  "Display the message here",
  colorText: Colors.white,
  backgroundColor: Colors.lightBlue,
  icon: const Icon(Icons.add_alert),
);

• title: 사용자에게 제목을 표시하는 데 사용된다.
• message: 제목 아래에 메시지를 표시할 때 사용된다.
• duration: 스낵바를 스크린에 보여주는 것을 지연시키고 싶다면 이 설정을 쓰면 된다. 기본값은 3초이다.
• backgroundColor: 배경색을 줄 때 사용된다.
• titleText: 제목을 표시할 때 설정된다.
• messageText: 위에 설명한 것처럼 제목 아래 메시지가 표시될 때 설정되는 텍스트이다.

🔗 참고

https://medium.com/dhiwise/snackbar-using-getx-in-flutter-e680fefa5dc4