Flutter中如何创建带渐变背景的自定义Snackbar?
自定义渐变背景Snackbar实现方案(Flutter + Firebase场景)
我正在用Flutter开发一款应用,后端采用Firebase。近期需要用Snackbar向用户展示认证相关提示信息,例如user-not-found、password or email is wrong。默认Snackbar虽能正常工作,但我希望它更美观,因此实现了带渐变背景的自定义Snackbar,以下是具体实现方法:
import 'package:flutter/material.dart'; class CustomGradientSnackbar { final String text; final Gradient gradient; final Color textColor; CustomGradientSnackbar({ required this.text, required this.gradient, required this.textColor, }); void show(BuildContext context) { OverlayState? overlayState = Overlay.of(context); OverlayEntry overlayEntry; overlayEntry = OverlayEntry( builder: (BuildContext context) => Positioned( bottom: 0, left: 0, right: 0, child: Material( elevation: 6.0, child: Container( padding: const EdgeInsets.symmetric(horizontal: 16.0, vertical: 10.0), decoration: BoxDecoration( gradient: gradient, ), child: Text( text, style: TextStyle( color: textColor, fontWeight: FontWeight.bold, ), ), ), ), ), ); overlayState.insert(overlayEntry); Future.delayed(const Duration(seconds: 2)).then((_) { overlayEntry.remove(); }); } }
效果展示

如果有人知晓更优的自定义渐变背景Snackbar实现方式,欢迎分享。
内容的提问来源于stack exchange,提问作者Sunnat Amirov
相关产品推荐
相关产品推荐

