Question

以下是我的homepage.dart的一部分，该文件运行良好，但是单击IconButton时没有任何反应。

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

这是我的AboutWidget所在的about_widget.dart文件。我在做什么错了？

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

Answer 1

您必须调用showDialog函数

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

Answer 2

使用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 方法

有关 showDialog 的更多信息，请访问https://api.flutter.dev/flutter/material/showDialog.html

希望我的回答有帮助！

Answer 3

按下按钮时，您正在调用AboutWidget（）。它是一个无状态的小部件。因此，需要将其构建在应用程序的构建方法中。在按钮上单击，将不会显示对话框。而是使用showDialog方法，并在内部使用警报对话框在屏幕上显示该对话框。

按下按钮时如何显示警报对话框？

3 个答案: