There are two different ways to do snackbar in Flutter using Getx. Getx is the most convenient way to make snackbar. It provides two methods and they are very similar.
We will create a method name showCustomSnackBar() and inside this we will call snackbar methods provided by Getx.
import 'package:flutter/material.dart';
import 'package:get/get.dart';
void showCustomSnackBar(String message, {bool isError = true, String title="Errors"}) {
Get.showSnackbar(
GetBar(
message:message,
titleText: BigText(text: title, color: Colors.white),
messageText: Text(message, style: TextStyle(
color: Colors.white
),),
// colorText: Colors.white,
snackPosition: SnackPosition.TOP,
backgroundColor: Colors.redAccent
)
);
}Inside this it takes GetBar(). I have created this method showCustomSnackBar() and it takes a few arguments. And I am setting those arguments for Get.showSnackBar().
import 'package:flutter/material.dart';
import 'package:get/get.dart';
void showCustomSnackBar(String message, {bool isError = true, String title="Errors"}) {
Get.snackbar(
title,
message,
titleText: BigText(text: title, color: Colors.white),
messageText: Text(message, style: TextStyle(
color: Colors.white
),),
colorText: Colors.white,
snackPosition: SnackPosition.TOP,
backgroundColor: Colors.redAccent
);
}Get.snackbar() takes additional parameters like title and message. But you might not have to pass them to use.
You can use them from anywhere from your app. Just call showCustomSnackBar()
void _register(AuthController authController) async {
String _firstName = nameController.text.trim();
String _email = emailController.text.trim();
String _number = phoneController.text.trim();
String _password = passwordController.text.trim();
if (_firstName.isEmpty) {
showCustomSnackBar("Type in your name", title:"Name");
}else if (_email.isEmpty) {
showCustomSnackBar("Type in your Email", title:"Email");
}else if (!GetUtils.isEmail(_email)) {
showCustomSnackBar("Type in correct Email", title:"Email");
}else if (_number.isEmpty) {
showCustomSnackBar("Type in your Phone Number", title:"Phone Number");
}else if (_password.isEmpty) {
showCustomSnackBar("Type in your Password", title:"Password");
}else if (_password.length < 6) {
showCustomSnackBar("Type in equal or more than 6 characters", title:"Password");
}else {
SignUpBody signUpBody = SignUpBody(fName: _firstName,
email: _email,
phone: _number, password: _password);
authController.registration(signUpBody).then((status) async {
if (status.isSuccess) {
print("success registration");
Get.offNamed(RouteHelper.getInitialRoute());
}else {
Get.snackbar("Wrong", "Something went wrong");
}
});
}
}In the above example, I have used snackbar with a custom method and without custom method.
If you use snackbar of Getx you need to wrap your app entry point using GetMaterialApp()
Widget build(BuildContext context) {
Get.put(LocationController());
return const GetMaterialApp(
debugShowCheckedModeBanner: false,
home: MapScreen()
);
}
}
