我试图弄清楚如何像正常的推送通知一样用来自屏幕顶部的警报通知用户。如何从屏幕顶部提醒用户。AlertDialog不可自定义,因此我对此感到困惑。是否可以从屏幕顶部显示警报或小吃店之类的方法?
AlertDialog
Flutter使您可以借助Overlay类创建通知。 要使这些动画从顶部进入屏幕,可以将SlideTransition 与AnimationController 结合使用。 这是我创建的示例应用程序:
import 'package:flutter/material.dart'; void main() => runApp(MyApp()); class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp(home: Home()); } } class Home extends StatelessWidget { @override Widget build(BuildContext context) { return Scaffold( body: Center( child: RaisedButton.icon( icon: Icon(Icons.notifications_active), label: Text('Notify!'), onPressed: () { Navigator.of(context) .overlay .insert(OverlayEntry(builder: (BuildContext context) { return FunkyNotification(); })); }, ), ), ); } } class FunkyNotification extends StatefulWidget { @override State<StatefulWidget> createState() => FunkyNotificationState(); } class FunkyNotificationState extends State<FunkyNotification> with SingleTickerProviderStateMixin { AnimationController controller; Animation<Offset> position; @override void initState() { super.initState(); controller = AnimationController(vsync: this, duration: Duration(milliseconds: 750)); position = Tween<Offset>(begin: Offset(0.0, -4.0), end: Offset.zero) .animate( CurvedAnimation(parent: controller, curve: Curves.bounceInOut)); controller.forward(); } @override Widget build(BuildContext context) { return SafeArea( child: Material( color: Colors.transparent, child: Align( alignment: Alignment.topCenter, child: Padding( padding: EdgeInsets.only(top: 32.0), child: SlideTransition( position: position, child: Container( decoration: ShapeDecoration( color: Colors.deepPurple, shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular(16.0))), child: Padding( padding: EdgeInsets.all(10.0), child: Text( 'Notification!', style: TextStyle( color: Colors.white, fontWeight: FontWeight.bold), ), ), ), ), ), ), ), ); } }