CustomerFormWidget

CustomerFormWidget es un widget genérico de Flutter que permite construir formularios dinámicos y manejar modelos de datos de forma flexible. Este README explica cómo configurar y usar el widget.

Características

  • Crea formularios dinámicos basados en una lista de campos.
  • Valida los campos de entrada.
  • Deserializa modelos genéricos usando funciones fromMap.
  • Notifica al componente externo cuando se han guardado los datos.
  • En el caso de select muestra el contenido con toString()

Instalación

  1. Agrega los archivos del widget y modelos relacionados en tu proyecto de Flutter.
  2. Asegúrate de tener configurada la dependencia flutter en tu archivo pubspec.yaml.

Requisitos del Modelo

El modelo genérico que uses con CustomerFormWidget debe implementar dos métodos:

  • fromMap: Crea una instancia del modelo desde un Map<String, dynamic>.

Ejemplo de Modelo

class CustomerLogin {
  String? email;
  String? createAt;
  TipoModelo? tipoModelo;

  CustomerLogin({
    this.email,
    this.createAt,
    this.tipoModelo,
  });

  factory CustomerLogin.fromMap(Map<String, dynamic> map) {
    return CustomerLogin(
      email: map['email'] as String?,
      createAt: map['createAt'] as String?,
      tipoModelo: map['tipoModelo'] == null
              ? null
              : TipoModelo.fromMap(map['tipoModelo']),
    );
  }

  @override
  String toString() {
    return 'CustomerLogin{email: $email, createAt: $createAt, tipoModelo: $tipoModelo }';
  }
}
class TipoModelo {
  String nombre;
  int id;

  TipoModelo({
    required this.nombre,
    required this.id,
  });

  factory TipoModelo.fromMap(Map<String, dynamic> map) {
    return TipoModelo(nombre: map['nombre'], id: map['id']);
  }

  @override
  String toString() {
    return nombre;
  }
}

Uso del Widget

Ejemplo Completo

import 'package:flutter/material.dart';

import 'models/form_field_model.dart';
import 'models/validation_type_enum.dart';
import 'widgets/CustomerFormWidget.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text('Customer Form Widget')),
        body: CustomerFormExample(),
      ),
    );
  }
}

class CustomerFormExample extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return CustomerFormWidget(
      key: formWidgetKey,
      padding: const EdgeInsets.symmetric(vertical: 10, horizontal: 30),
      formFieldList: formFieldList,
      model: CustomerLogin(),
      fromMap: CustomerLogin.fromMap,
      buttonSave: ElevatedButton(
        onPressed: () {
          try {
            final updatedModel = formWidgetKey.currentState!.saveForm();
            debugPrint('Form model es :: ${updatedModel.toString()}');
            formWidgetKey.currentState!.clearForm();
          } catch (e) {
            debugPrint('Error Form model es :: ${e.toString()} ');
          }
        },
        child: const Text('Login in'),
      ),
    );
  }
}

Contributions

We welcome your contributions! If you want to improve this package, feel free to open an issue or submit a pull request on GitHub.


Support the Project

If you like this project, consider buying me a coffee or supporting via PayPal:

Buy Me a Coffee

Image description


Notas

  • Validación de Campos: La validación de los campos se maneja con la propiedad validationType de los objetos FormFieldModel.
  • Extensibilidad: Puedes crear nuevos modelos y extender este widget fácilmente.

Requisitos Adicionales

  • Asegúrate de manejar correctamente los controladores (TextEditingController) de los campos de formulario para evitar pérdidas de memoria.