dart 当按钮被按下时，如何显示警报对话框？

envsm3lx 于 2023-11-14 发布在其他

关注(0)|答案(4)|浏览(137)

以下是我的主页的一部分。dart这是运行良好，但在点击图标按钮什么也没发生。

...
 return Scaffold(
  appBar: AppBar(
    title: Text('Lorem Ipsum'),
    leading: IconButton(      
      icon: Icon(Icons.info),
      onPressed: () => AboutWidget(),
    ),
  ),
  body: ...

字符串
这是我的about_widget.dart文件，其中定义了我的AboutWidget。我做错了什么？

import 'package:flutter/material.dart';
class AboutWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return AlertDialog(
      title: Text('data'),
    );
  }
}

型

dart

来源：https://stackoverflow.com/questions/59423832/how-to-show-alertdialog-when-button-is-pressed

4条答案

按热度按时间

inkz8wg91#

调用showDialog函数

AppBar(
  title: Text('Lorem Ipsum'),
  leading: IconButton(
    icon: Icon(Icons.info),
    onPressed: () => showDialog(
      context: context,
      builder: (context) => AboutWidget(),
    ),
  ),
)

字符串

赞(0）回复(0）举报 2023-11-14

5w9g7ksd2#

使用Flutter原生showDialog函数显示对话框。
对于你的代码，你可以尝试这样做：

return Scaffold(
  appBar: AppBar(
    title: Text('Lorem Ipsum'),
    leading: IconButton(      
      icon: Icon(Icons.info),
      onPressed: () => showDialog(
        context: context,
        builder: (context){
          return AboutWidget();
        }
      ),
    ),
  ),
);

字符串
因此，当按钮被按下时，您应该调用showDialog方法。

赞(0）回复(0）举报 2023-11-14

whhtz7ly3#

使用一些按钮，它也接收到一个函数的 * 引用 *：

FilledButton.icon(
onPressed: () => showDialog(
    context: context,
    builder: (context) => CustomDialogAlert(
        title: '¿Desea proceder?',
        description:
            'Esta acción de BORRADO no puede ser deshecha.',
        buttonLeft: 'Cancelar',
        buttonRight: 'Aceptar',
        callbackFunction: _submitFormDelete)),
icon: const Icon(Icons.delete_outline_outlined),
label: const Text('Borrar')
), // FilledButton.icon

字符串
一个无状态的类：

import 'package:flutter/material.dart';

class CustomDialogAlert extends StatelessWidget {
  final String title;
  final String description;
  final String buttonLeft;
  final String buttonRight;
  final Function() callbackFunction;

  const CustomDialogAlert(
      {super.key,
      this.buttonLeft = 'Cancelar',
      this.buttonRight = 'Ok',
      required this.description,
      required this.title,
      required this.callbackFunction});

  @override
  Widget build(BuildContext context) {
    return AlertDialog(
      title: Text(title),
      content: Text(description),
      actions: <Widget>[
        TextButton(
          onPressed: () => Navigator.pop(context, 'Cancel'),
          child: Text(buttonLeft),
        ),
        TextButton(
          onPressed: () => callbackFunction(),
          child: Text(buttonRight),
        ),
      ],
    );
  }
}

型
结果是：

的数据