Home Mobile Membuat sebuah Toast Pada Flutter

Membuat sebuah Toast Pada Flutter

0

Pada kali ini kita akan memahami atau membuat sebuah Toast atau Alert pada Flutter. Toast atau Alert merupakan sebuah widget yang sangat menarik untuk membuat sebuah informasi pada pengguna. Berikut cara-cara membuat sebuah toast atau alert pada Flutter.

  • Langkah pertama buatlah sebuah project baru pada flutter
  • Selanjutnya buatlah sebuah toast pada flutter
MaterialButton(
onPressed: (){
Fluttertoast.showToast(
msg: "This is Center Short Toast",
toastLength: Toast.LENGTH_SHORT,
gravity: ToastGravity.BOTTOM_LEFT,
timeInSecForIosWeb: 1,
backgroundColor: Colors.red,
textColor: Colors.white,
fontSize: 16.0
);
},
child: Text("Toast Page", style: TextStyle(color: Colors.white),),
  • Full Source Code
import 'package:flutter/material.dart';
import 'package:fluttertoast/fluttertoast.dart';

void main() {
runApp(const MyApp());
}

class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);

@override
Widget build(BuildContext context) {
return MaterialApp(
home: ToastPage(),
debugShowCheckedModeBanner: false,
);
}
}

class ToastPage extends StatefulWidget {
const ToastPage({Key? key}) : super(key: key);

@override
State<ToastPage> createState() => _ToastPageState();
}

class _ToastPageState extends State<ToastPage> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Center(child: Text("Toast Page")),
),
body: Center(
child: Container(
color: Colors.blueAccent,
child: MaterialButton(
onPressed: (){
Fluttertoast.showToast(
msg: "This is Center Short Toast",
toastLength: Toast.LENGTH_SHORT,
gravity: ToastGravity.BOTTOM_LEFT,
timeInSecForIosWeb: 1,
backgroundColor: Colors.red,
textColor: Colors.white,
fontSize: 16.0
);
},
child: Text("Toast Page", style: TextStyle(color: Colors.white),),
),
),
),
);
}
}