Calling widget from another widget with onPressed event in flutter to open alertDialog

Question

I'm building a generalised flutter widget based on the flutter alertDialog, I want to have this as a separate widget which can be called with onPressed method in other widgets.

Currently the alertDialog opens with the onPressed method which is part of the current widget within ElevatedButton widget. I want to get rid of this ElevatedButton as the button to open alertDialog is part of other widget.

Class AppAlertDialog extends StatelessWidget {
  const AppAlertDialog({
    required this.buttonName,
    required this.title,
    required this.content,
    required this.secondaryButtonName,
    required this.primaryButtonName,
    Key? key,
  }) : super(key: key);

  final String buttonName;
  final String title;
  final String content;
  final String secondaryButtonName;
  final String primaryButtonName;

  @override
  Widget build(BuildContext context) {
    return ElevatedButton(
      onPressed: () => _showAlertDialog(context),
      child: Text(buttonName),
    );

   //Get rid of this ElevatedButton and call the _showAlertDialog method to open the 
   //alertDialog from other onPressed methods in other files

  }

  _showAlertDialog(BuildContext context) {
    final titleTextStyle = Theme.of(context).textTheme.headline5!;
    const buttonPadding = EdgeInsets.all(20);

    showDialog(
      context: context,
      builder: (BuildContext context) => AlertDialog(
        title: Text(
          title,
          style: titleTextStyle,
        ),
        content: Text(content),
        contentPadding: const EdgeInsets.fromLTRB(24, 24, 24, 24),
        actions: <Widget>[
          ElevatedButton(
            onPressed: () => Navigator.pop(context),
            style: ElevatedButton.styleFrom(
              padding: buttonPadding,
              primary: SharedColorsButton.secondaryButtonBgColor,
              onPrimary: SharedColorsButton.secondaryButtonFgColor,
              side: const BorderSide(
                color: SharedColorsInputDecoration.borderColor,
              ),
            ),
            child: Text(secondaryButtonName),
          ),
          ElevatedButton(
            style: ElevatedButton.styleFrom(
              padding: buttonPadding,
            ),
            onPressed: () => Navigator.pop(context),
            child: Text(primaryButtonName),
          ),
        ],
        actionsPadding: const EdgeInsets.fromLTRB(24, 16, 24, 16),
      ),
    );
  }
}

You should implement your own `showAlertDialog` global function, You can incorporate your own `Dialog` widget but I suggest you look at the very many Dialog packages available on `pub.dev` if the built-in one is not to your liking. — Roslan Amir, Nov 18 '21 at 05:20

Hasib Akon · Answer 1 · 2021-11-18T05:09:30.770

Please see the example.

showDialog(
    context: context,
    builder: (context) {
      return StatefulBuilder(
        builder: (context, setState) {
          return AlertDialog(
            insetPadding: EdgeInsets.symmetric(horizontal: 8, vertical: 24),
            title: Text("New request"),
            content: Container(
              height: double.maxFinite,
              width: double.maxFinite,
              child: StreamBuilder(
                  stream: FirebaseFirestore.instance
                      .collection('requests')
                      .where('accepted', isEqualTo: 0)
                      .snapshots(),
                  builder: (context, snapshot) {
                    print("Second ride data ==> ${snapshot.hasData}");
                    if (snapshot.hasData) {
                      final requests = snapshot.data.docs;
                      if (User.homeModel == null) {
                        return Container(width: 0, height: 0);
                      }
                      if (User.homeModel.vehicleDetails == null) {
                        return Container(width: 0, height: 0);
                      }

                      List<RequestCard> allTrains = [];
                      for (var doc in requests) {
                        print(
                            "Second ride data ==> ID ${doc['request_id']}");

                        if (Home.removeRequests.contains(doc['request_id']))
                          continue;

                        //seats compare
                        int seatCapacity =
                            User.homeModel.vehicleDetails.passengerCapacity;
                        print('seatCapacity => $seatCapacity');
                        var seatRequest = doc['seats'];
                        print('seatRequest => $seatRequest');

                        //baby_seats compare
                        var babySeatsCapacity =
                            User.homeModel.vehicleDetails.children;
                        print('babySeatsCapacity => $babySeatsCapacity');
                        var babySeatsRequest = doc['baby_seats'];
                        print('babySeatsRequest => $babySeatsRequest');

                        //WheelChair compare
                        var hasWheelChair =
                            User.homeModel.vehicleDetails.wheelchair == '1'
                                ? true
                                : false;
                        print('hasWheelChair => $hasWheelChair');
                        var needWheelChair = doc['wheelchair'];
                        print('needWheelChair => $needWheelChair');

                        //compare vehicles with requests
                        if (seatRequest <= seatCapacity &&
                            babySeatsRequest <= babySeatsCapacity &&
                            (needWheelChair == hasWheelChair ||
                                hasWheelChair == true)) {
                          print('Vehicle Condition Satisfy');
                          final _rideReq = RideRequest(
                              userName: doc['user_name'],
                              currentLocation: doc['pick_up_location'],
                              destination: doc['drop_off_location'],
                              fare: doc['bid_amount'],
                              desLatitude: doc['drop_off_lat'].toString(),
                              desLongitude: doc['drop_off_long'].toString(),
                              distance: doc['distance'],
                              image: doc['user_image'],
                              latitude: doc['pick_up_lat'].toString(),
                              longitude: doc['pick_up_long'].toString(),
                              phone: doc['phone'],
                              pickUpPoint: doc['pick_up_location'],
                              userId: doc['user_id'],
                              requestId: doc['request_id']);
                          final requestCard = RequestCard(
                            onAcceptFunction: onAcceptRequest,
                            onRejectFunction: onRejectRequest,
                            rideRequest: _rideReq,
                          );
                          allTrains.add(requestCard);
                        }
                      }

                      if (allTrains.length > 0) {
                        return ListView(
                          children: allTrains,
                        );
                      } else {
                        Future.delayed(Duration.zero)
                            .then((value) => Navigator.pop(context));
                      }
                    }
                    return Container(width: 0, height: 0);
                  }),
            ),
            actions: <Widget>[
              FlatButton(
                onPressed: () {
                  HomeBottomNavigationBar._isNewRequestOpenDialog = false;

                  Navigator.pop(context, true);
                },
                child: Text("Close"),
              ),
              FlatButton(
                onPressed: () {
                  changeTabs(0);

                  HomeBottomNavigationBar._isNewRequestOpenDialog = false;

                  Navigator.pop(context, true);
                },
                child: Text("Go to Home"),
              ),
            ],
          );
        },
      );
    },
  )

Calling widget from another widget with onPressed event in flutter to open alertDialog

1 Answers1