按下底部颤动时显示警报答案

【问题标题】：show Alert when pressing a bottom flutter按下底部颤动时显示警报
【发布时间】：2021-05-26 01:26:04
【问题描述】：

我正在尝试显示一个警报小部件，该小部件将在按下按钮时显示。

import 'package:flutter/material.dart';

class AlertWidget extends StatelessWidget {

const AlertWidget({Key key}) : super(key: key);

 @override
Widget build(BuildContext context) {
return Scaffold(
  appBar: AppBar(
    title: Text('Alert page'),
  ),
  body: Center(
    child: RaisedButton(
      onPressed: () => _mostrarAlerta(context),
      child: Text(
        'show Alert',
        style: TextStyle(color: Colors.white),
      ),
      color: Colors.blue,
    ),
  ),
);
void _mostrarAlerta(BuildContext context) {
showDialog(
    context: context,
    barrierDismissible: true,
    builder: (context) {
      return AlertDialog(
        shape:
            RoundedRectangleBorder(borderRadius: BorderRadius.circular(10)),
        title: Text('Title'),
        content: Column(
          mainAxisSize: MainAxisSize.min,
          children: [Text('Test')],
        ),
        actions: [
          FlatButton(
              onPressed: () {
                Navigator.of(context).pop();
              },
              child: Text('OK')),
          FlatButton(
              onPressed: () {
                Navigator.of(context).pop();
              },
              child: Text('Cancel'))
        ],
      );
    });
}

}

这是我的警报小部件的代码。

child: Row(
    children: [
      Expanded(
          child: GradientElevatedButton(
        onPressed: () {
          
          
        },
        child: Text('Create Garage'),
      ))
    ],
  ),

这是我按下按钮时的代码。我一直在实例化 AlertWidget ()，但它没有显示给我。我是 Flutter 新手。

【问题讨论】：

您在哪里将AlertWidget 添加到小部件树中？

标签： flutter dart flutter-layout flutter-test dart-pub

【解决方案1】：

将带有异步功能的 Future 添加到您的警报方法中：

代码：

Future<Widget>_mostrarAlerta(BuildContext context) async  {
return showDialog(
context: context,
barrierDismissible: true,
builder: (context) {
  return AlertDialog(
    shape:
        RoundedRectangleBorder(borderRadius: BorderRadius.circular(10)),
    title: Text('Title'),
    content: Column(
      mainAxisSize: MainAxisSize.min,
      children: [Text('Test')],
    ),
    actions: [
      FlatButton(
          onPressed: () {
            Navigator.of(context).pop();
          },
          child: Text('OK')),
      FlatButton(
          onPressed: () {
            Navigator.of(context).pop();
          },
          child: Text('Cancel'))
    ],
  );
});

}

还有你的 onPressed 按钮：

child: Row(
children: [
  Expanded(
      child: GradientElevatedButton(
    onPressed: () {
      _mostrarAlerta(context);
      
    },
    child: Text('Create Garage'),
  ))
],

【讨论】：