How to create when click image then show material dialog box on flutter?-CodePudding

this is my output,

I tried to code a popup dialog box when clicked the mic button. But when I clicked it, it doesn't worked. And dialog box code has in another dart file. I hope that's not an issue for this.

mic image code

 Center(
                            child: Padding(
                              padding: const EdgeInsets.only(top: 1),
                              child: IconButton(
                                iconSize: 45,
                                icon: Ink.image(
                                  image: const AssetImage('assets/mic.png'),
                                ),
                                onPressed: () {
                                  // do something when the button is pressed

                                  Recorder12(context);
                                },
                              ),
                            ),
                          ),

dialog box code it has in another page

import 'package:flutter/cupertino.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:material_dialogs/material_dialogs.dart';
import 'package:material_dialogs/widgets/buttons/icon_button.dart';
import 'package:material_dialogs/widgets/buttons/icon_outline_button.dart';

Widget Recorder12(BuildContext context) {
  return MaterialButton(
    color: Colors.grey[300],
    minWidth: 300,
    onPressed: () => Dialogs.materialDialog(
        msg: 'Are you sure ? you can\'t undo this',
        title: "Delete",
        color: Colors.white,
        context: context,
        dialogWidth: kIsWeb ? 0.3 : null,
        onClose: (value) => print("returned value is '$value'"),
        actions: [
          IconsOutlineButton(
            onPressed: () {
              Navigator.of(context).pop(['Test', 'List']);
            },
            text: 'Cancel',
            iconData: Icons.cancel_outlined,
            textStyle: TextStyle(color: Colors.grey),
            iconColor: Colors.grey,
          ),
          IconsButton(
            onPressed: () {},
            text: "Delete",
            iconData: Icons.delete,
            color: Colors.red,
            textStyle: TextStyle(color: Colors.white),
            iconColor: Colors.white,
          ),
        ]),
    child: Text("Show Material Dialog"),
  );
}

dependencies material_dialogs: ^1.1.3

CodePudding user response：

In your Recorder12 class remove MaterialButton, you put button in button and change your Recorder12 to return void:

Void Recorder12(BuildContext context) {
  Dialogs.materialDialog(
        msg: 'Are you sure ? you can\'t undo this',
        title: "Delete",
        color: Colors.white,
        context: context,
        dialogWidth: kIsWeb ? 0.3 : null,
        onClose: (value) => print("returned value is '$value'"),
        actions: [
          IconsOutlineButton(
            onPressed: () {
              Navigator.of(context).pop(['Test', 'List']);
            },
            text: 'Cancel',
            iconData: Icons.cancel_outlined,
            textStyle: TextStyle(color: Colors.grey),
            iconColor: Colors.grey,
          ),
          IconsButton(
            onPressed: () {},
            text: "Delete",
            iconData: Icons.delete,
            color: Colors.red,
            textStyle: TextStyle(color: Colors.white),
            iconColor: Colors.white,
          ),
        ]);
}