Flutter
flutter - Toast Message
바차
2021. 7. 20. 03:11
반응형
[Toast Message]
-> 토스트 메시지는 따로 외부 메서드를 import 하는 과정을 거쳐야 한다.
-> pubspec 파일에서
-> 해당 위치에 fluttertoast: ^3.1.3 을 붙여넣는다.
-> pubspec 파일은 들여쓰기에 상당히 예민하므로 주의해서 붙여 넣는다.
[error 수정]
Error: safety, because the following dependencies don't support null safety:
-> 라는 에러가 생겼는데 setting 에서 "Flutter run additional args"을 검색 한 후 --no-sound-null-safety 을 추가해주었더니 해결되었다.
[오류 참고한 사이트]
Cannot run with sound null safety because dependencies don't support null safety
I have followed "Enabling null safety" on dart.dev and also migrated my whole Flutter app to null safety. Now, I am trying to run it using flutter run, however, it will not start because ...
stackoverflow.com
[최종 코드]
import 'package:flutter/material.dart';
import 'package:fluttertoast/fluttertoast.dart';
void main(List<String> args) {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
title: 'Snack Bar',
theme: ThemeData(primarySwatch: Colors.blue),
home: MyPage(),
);
}
}
class MyPage extends StatelessWidget {
const MyPage({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Toast Message'),
centerTitle: true,
),
body: Center(
child: ElevatedButton(
child: Text('Toast'),
onPressed: () {
flutterToast();
},
style: ButtonStyle(
backgroundColor: MaterialStateProperty.all(
Colors.red), //ElevatedButton 에서 버튼 색 바꾸기
),
),
),
);
}
}
void flutterToast() {
// 토스트 메시지를 출력하기 위한 함수 생성
Fluttertoast.showToast(
msg: 'Flutter 토스트 메시지', // 토스트 메시지 내용
gravity: ToastGravity.BOTTOM,
backgroundColor: Colors.redAccent, // 배경색 빨강색
fontSize: 20.0,
textColor: Colors.white, // 폰트 하얀색
toastLength: Toast.LENGTH_SHORT // 토스트 메시지 지속시간 짧게
);
}
[결과 화면]
-> 버튼을 클릭했을 때 토스트 메시지 출력
- 해당 자료는 유튜버 코딩쉐프 님의 영상 학습 정리입니다.
300x250