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.

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? password;

  CustomerLogin({
    this.email,
    this.password,
  });

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

Uso del Widget

Ejemplo Completo

import 'package:flutter/material.dart';

import 'models/FormFieldModel.dart';
import 'models/ValidationTypeEnum.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'),
      ),
    );
  }
}

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.

Libraries

ems_form_dynamic