Flutter笔记：Widgets Easier组件库（13）- 使用底部弹窗

import 'package:flutter/material.dart';
 
void main() => runApp(MyApp());
 
class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: HomePage(),
    );
  }
}
 
class HomePage extends StatefulWidget {
  @override
  _HomePageState createState() => _HomePageState();
}
 
class _HomePageState extends State<HomePage> {
  GlobalKey<ScaffoldState> scaffoldKey = GlobalKey();
 
  void showSnackBar() {
    final snackBar = SnackBar(content: Text('这是一个SnackBar'));
    scaffoldKey.currentState.showSnackBar(snackBar);
  }
 
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      key: scaffoldKey,
      appBar: AppBar(
        title: Text('底部弹窗示例'),
      ),
      body: Center(
        child: RaisedButton(
          child: Text('显示底部弹窗'),
          onPressed: showSnackBar,
        ),
      ),
    );
  }
}

这段代码展示了如何在Flutter应用中创建一个带有BottomSheet的弹窗。通过使用showModalBottomSheet函数，我们可以创建一个从底部弹出的模态面板，并且可以根据需要进行自定义。这个例子中，我们在一个RaisedButton上设置了点击事件，当按钮被点击时，会触发显示底部弹窗的动作。