I have the following code:

import 'package:flutter/material.dart';
import 'package:spiran_app/constants/constants.dart';
import 'package:spiran_app/widgets/form_textfield_widget.dart';
import 'package:spiran_app/widgets/subscreen_appbar_widget.dart';

import 'dialog_widget.dart';

class SignUpDialogWidget extends StatefulWidget {
  @override
  _SignUpDialogWidgetState createState() => _SignUpDialogWidgetState();
}

class _SignUpDialogWidgetState extends State<SignUpDialogWidget> {
  final GlobalKey<FormState> _formKey = GlobalKey<FormState>();

  TextEditingController _emailController = TextEditingController();
  TextEditingController _passwordController = TextEditingController();
  TextEditingController _confirmPasswordController = TextEditingController();

  @override
  Widget build(BuildContext context) {
    final ThemeData themeData = Theme.of(context);
    return Container(
      margin: Constants.constContainerMargin,
      decoration: BoxDecoration(
        borderRadius:
            BorderRadius.circular(Constants.constContainerBorderRadius),
        boxShadow: [
          BoxShadow(color: Colors.black, blurRadius: 50.0, spreadRadius: 20.0),
        ],
      ),
      child: ClipRRect(
        borderRadius:
            BorderRadius.circular(Constants.constContainerBorderRadius),
        child: Scaffold(
          appBar: SubscreenAppBarWidget(
            theme: Theme.of(context),
            title: "Sign Up",
            leadingWidget: IconButton(
              icon: Icon(Icons.close),
              onPressed: () => Navigator.pop(context),
            ),
          ),
          body: Form(
            autovalidateMode: AutovalidateMode.onUserInteraction,
            key: _formKey,
            child: Padding(
              padding: const EdgeInsets.all(8.0),
              child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: <Widget>[
                  FormTextFieldWidget(
                    theme: themeData,
                    textEditingController: this._emailController,
                    icon: Icons.alternate_email,
                    textFieldHintText: "Email",
                    validationRegex: RegExp(
                        r"^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-][email protected][a-zA-Z0-9](?:[a-zA-Z0-9-]{0,253}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,253}[a-zA-Z0-9])?)*$"),
                    validationErrorMessage:
                        "Please enter a valid email address",
                  ),
                  FormTextFieldWidget(
                    theme: themeData,
                    textEditingController: this._passwordController,
                    icon: Icons.lock,
                    isPassword: true,
                    textFieldHintText: "Password",
                    validationRegex: RegExp(
                        r"^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-][email protected][a-zA-Z0-9](?:[a-zA-Z0-9-]{0,253}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,253}[a-zA-Z0-9])?)*$"),
                    validationErrorMessage: "Please enter a valid password",
                  ),
                  FormTextFieldWidget(
                    theme: themeData,
                    textEditingController: this._confirmPasswordController,
                    icon: Icons.lock,
                    textFieldHintText: "Confirm Password",
                    isPassword: true,
                    validationRegex: RegExp(
                        r"^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-][email protected][a-zA-Z0-9](?:[a-zA-Z0-9-]{0,253}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,253}[a-zA-Z0-9])?)*$"),
                    validationErrorMessage: "Passwords do not match",
                  ),
                  Align(
                    alignment: Alignment.center,
                    child: ElevatedButton(
                      style: ButtonStyle(
                          shape: MaterialStateProperty.all(
                            RoundedRectangleBorder(
                              borderRadius: BorderRadius.circular(
                                Constants.constContainerBorderRadius,
                              ),
                            ),
                          ),
                          backgroundColor: MaterialStateProperty.all(
                              themeData.primaryColor)),
                      child: Text(
                        "Sign Up",
                        style: TextStyle(
                          color: themeData.accentColor,
                        ),
                      ),
                      onPressed: () {
                        if (!_formKey.currentState!.validate()) {
                          showDialog(
                            context: context,
                            builder: (ctx) => DialogWidget(
                              titleText: "Input error",
                              contentText:
                                  "One or some of your inputs have an error. Please correct them first",
                            ),
                          );
                          return;
                        }
                        //TODO sign up
                      },
                    ),
                  )
                ],
              ),
            ),
          ),
        ),
      ),
    );
  }
}

and the result I get is this:

Extra Spaces

As you can see, there is an extra space on top and bottom (the rectangles) of this screen. The widget causing this is the Scaffold widget I have. How can I remove the extra space so that my widget takes the space it needs and not more?


Solution 1: s.am.i

I didn't get the question very well but i think you can use Material() widget instead of scaffold