Flutter rflutter_alert alertPadding Not working

Viewed 32

I am trying to create a custom-styled alert using the RFlutter Alert Package https://pub.dev/packages/rflutter_alert

I want to apply padding the Alret content, but when I set a value to alertPadding property the paddding dose not apply.

**alertPadding: const EdgeInsets.all(8.0)**enter image description here, // <- This doesn't apply

How can I change the padding of the Alert?

noPermissionAlert() {
    var alertStyle = AlertStyle(
      alertPadding: const EdgeInsets.all(8.0), // <- This doesn't apply
      buttonAreaPadding: EdgeInsets.symmetric(vertical: 12),
      animationType: AnimationType.fromBottom,
      isCloseButton: false,
      isOverlayTapDismiss: false,
      descStyle: TextStyle(fontWeight: FontWeight.bold),
      descTextAlign: TextAlign.center,
      backgroundColor: Color.fromRGBO(2, 101, 186, 1),
      alertBorder: RoundedRectangleBorder(
        borderRadius: BorderRadius.circular(12.0),
      ),
      titleStyle: TextStyle(
        color: Colors.red,
      ),
      buttonsDirection: ButtonsDirection.column,
      alertAlignment: Alignment.center,
    );
    const TextStyle style = TextStyle(color: Colors.black);

    Alert(
      context: context!,
      style: alertStyle,
      content: Container(
        padding: const EdgeInsets.all(2.0),
        decoration: BoxDecoration(
          borderRadius: BorderRadius.circular(10.0),
        ),
        child: ClipRRect(
          borderRadius: BorderRadius.circular(12.0),
          child: Container(
              alignment: Alignment.center,
              constraints: const BoxConstraints(
                maxWidth: 250,
                // maxHeight: 100,
              ),
              color: Colors.white,
              child: Column(
                children: [
                  SizedBox(
                    height: 12,
                  ),
                  Row(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      SvgPicture.asset('assets/svg/warning.svg'),
                      SizedBox(
                        width: 6,
                      ),
                      SvgPicture.asset('assets/svg/no_internet.svg'),
                      SizedBox(
                        width: 6,
                      ),
                      SvgPicture.asset('assets/svg/surprise.svg'),
                    ],
                  ),
                  SizedBox(
                    height: 12,
                  ),
                  Text(
                    "Error Message",
                    style: TextStyle(
                        color: Colors.blue,
                        fontWeight: FontWeight.bold,
                        fontSize: 24),
                  ),
                  SizedBox(
                    height: 12,
                  ),
                  Text(
                    "Connection required to make reservations and access locks",
                    textAlign: TextAlign.center,
                    style: TextStyle(
                      fontSize: 14,
                    ),
                  ),
                  SizedBox(
                    height: 12,
                  ),
                ],
              )),
        ),
      ),
      buttons: [
        DialogButton(
          width: 100,
          height: 45,
          padding: EdgeInsets.symmetric(vertical: 12, horizontal: 24),
          child: Text(
            "Retry",
            style: TextStyle(
                color: Colors.white, fontSize: 16, fontWeight: FontWeight.bold),
          ),
          onPressed: () => Navigator.pop(context!),
          color: Colors.blue.shade400,
        ),
      ],
    ).show();
  }

The following image show the output of the above code

enter image description here

This is how to alret should look like

enter image description here

0 Answers
Related