kauemurakami / getx_pattern

Design pattern designed to standardize your projects with GetX on Flutter.
https://kauemurakami.github.io/getx_pattern
1k stars 235 forks source link

Where do the dialogs go? #20

Closed kevin4dhd closed 3 years ago

kevin4dhd commented 3 years ago

I want to create dialogs as forms, does it go in the "modules" folder? or where would they go

kauemurakami commented 3 years ago

@kevin4dhd Let's contextualize the scenario. Assuming you have a registration dialog in a registration module. in the module you have the possibility to create components in the widgets folder of this module. You can place the dialog on one component by calling the form from another component. I usually use a textformfield, button, in global widgets, so you can use that component inside any module without depending on another module. An example :

class CustomTextFormField extends StatelessWidget {
  final Function(String value) onSaved;
  final Function(String value) onChanged;
  final Function(String value) validator;
  final bool emailCheck;
  final String text;
  final Widget sufixIcon;
  final Widget prefixIcon;
  final TextInputAction action;
  final TextInputType type;
  final bool obscure;
  final TextEditingController controller;
  final TextDirection direction;
  final int max;
  final int maxLines;
  final String initialValue;
  final String hintText;
  final formatter;
  final Color color;
  final bool enable;

  CustomTextFormField(
      {this.maxLines = 1,
      this.enable = true,
      this.formatter = const <TextInputFormatter>[],
      this.initialValue,
      this.emailCheck,
      this.text,
      this.onChanged,
      this.onSaved,
      this.validator,
      this.sufixIcon,
      this.action,
      this.color,
      this.type,
      this.obscure = false,
      this.controller,
      this.direction = TextDirection.ltr,
      this.max,
      this.prefixIcon,
      this.hintText});

  @override
  Widget build(BuildContext context) {
    return TextFormField(
      enabled: this.enable,
      inputFormatters: this.formatter,
      maxLines: this.maxLines,
      initialValue: this.initialValue,
      maxLength: this.max,
      textDirection: this.direction,
      controller: this.controller,
      obscureText: this.obscure,
      style: TextStyle(fontSize: 16),
      keyboardType: this.type,
      cursorColor: customPrimary,
      decoration: InputDecoration(
          hintText: this.hintText,
          hintStyle: TextStyle(color: this.color),
          //contentPadding: EdgeInsets.only(top: 5),
          border: UnderlineInputBorder(
              borderSide: BorderSide(color: customPrimary)),
          labelText: this.text,
          suffixIcon: this.sufixIcon,
          prefixIcon: this.prefixIcon),
      onChanged: (value) => this.onChanged(value),
      onSaved: (value) => this.onSaved(value),
      validator: (value) => this.validator(value),
      textInputAction: this.action,
    );
  }
}

Could be used in : ...

  /app
    /widgets
       - custom_tff.dart
    /modules
      /registration
        /widgets
          - dialog.dart
        - controller.dart
        - repository.dart
        - page.dart
      /another
        /widgets
          - another_widget_using_custom_tff.dart
        - controller.dart
        - repository.dart
        - page.dart

Where your text form field can be used in several modules as stated, or you can add it exclusively as part of that module ...

  /app
    /widgets
    /modules
      /registration
        /widgets
          - custom_tff.dart
          - dialog.dart
        - controller.dart
        - repository.dart
        - page.dart

And call it with Get.dialog (MyDialog ())

kevin4dhd commented 3 years ago

Thanks 👏