forms_library
A new Flutter package, send a valid json and receive a rendered form.
Getting Started
This project is a starting point for a Flutter application. The library was created to render and handle custom forms through a particular json
Library Install
Add the last version of the library to your pubspect.yaml file
dependencies: ... forms_library: ^1..
Library Structure
For the correct functioning of the library it is necessary to send it at least a valid json wich contain the fields in the following format:
[
{
"id": "", //field id unique
"idProducto": "",
"orden": "0",
"tipo": "5", //field type
"editable": "1", //1 to allow users to edit field or 0 to not allow edits
"validacion": ^[\\s\\S]+$",//regex expr to validate received data
"valorDefecto": "",
"visible": "1",
"dependeDe": "",
"claveDependencia": "",
"etiqueta": "", //name displayed on the field
"campoProtocolo": "4",
"etiquetaProtocolo": "",
"pantallaAyuda": "",
"descripcion": "",
"tamMax": "", //max lenght
"postTransaccion": "0"
},
{
"id": "",
"idProducto": "",
"orden": "1",
"tipo": "8",
"editable": "1",
"validacion": "^[\\s\\S]+$",
"valorDefecto": "",
"visible": "1",
"dependeDe": "",
"claveDependencia": "",
"etiqueta": "Nombre",
"campoProtocolo": "3",
"etiquetaProtocolo": "nombre",
"pantallaAyuda": "",
"descripcion": "",
"tamMax": "",
"postTransaccion": "0"
}
......
]
Type of fields allowed
Depends on the 'type' value sent on the json, it will render a different field.
Type 1 - Select
Allow user to select given different options


```{
"id":"",
"idProducto":"",
"orden":"6",
"tipo":"1",
"editable":"1",
"validacion":"^[\\s\\S]+$",
"valorDefecto":"",
"visible":"1",
"dependeDe":"",
"claveDependencia":"",
"etiqueta":"Tipo documento",
"campoProtocolo":"3",
"etiquetaProtocolo":"id_tipoDocumento",
"pantallaAyuda":"",
"descripcion":"",
"tamMax":"",
"postTransaccion":"0"
}
```
To send the options array you have to send the dependencies json, the id should be the same of this product id
```
{"id":"","data":[{"1":"DNI/NIF"},{"2":"NIE"},{"4":"Pasaporte"}]}
```
Type 2 - Input Numbers / Type 8 - Input Text
Different types of inputs, for numbers or any text / characters

```
{
"id":"",
"idProducto":"",
"orden":"9",
"tipo":"2",
"editable":"1",
"validacion":"^\\d{5}$",
"valorDefecto":"",
"visible":"1",
"dependeDe":"",
"claveDependencia":"",
"etiqueta":"Código postal",
"campoProtocolo":"3",
"etiquetaProtocolo":"cp",
"pantallaAyuda":"",
"descripcion":"",
"tamMax":"5",
"postTransaccion":"0"
}
```
Type 3 - Checkbox / Type 7 - Checkbox with url

```
{
"id":"",
"idProducto":"",
"orden":"30",
"tipo":"7",
"editable":"1",
"validacion":"^1$",
"valorDefecto":"http://.....",
"visible":"1",
"dependeDe":"",
"claveDependencia":"",
"etiqueta":"Acepta Condiciones",
"campoProtocolo":"3",
"etiquetaProtocolo":"aceptaCondiciones",
"pantallaAyuda":"11",
"descripcion":"",
"tamMax":"1",
"postTransaccion":"0"
}
```
Type 4 - Date
Allow to set dates - format (dd-mm-yyyy)

```
{
"id":"",
"idProducto":"",
"orden":"11",
"tipo":"4",
"editable":"1",
"validacion":"^\\d{2}\\-\\d{2}\\-\\d{4}$",
"valorDefecto":"",
"visible":"1",
"dependeDe":"",
"claveDependencia":"",
"etiqueta":"Fecha nacimiento (dd-mm-aaaa)",
"campoProtocolo":"3",
"etiquetaProtocolo":"fechaNacimiento",
"pantallaAyuda":"",
"descripcion":"",
"tamMax":"10",
"postTransaccion":"0"
}
```
Type 5 - Separator
Just one larger size tag to separate groups of fields
```
{
"id":"",
"idProducto":"",
"orden":"13",
"tipo":"5",
"editable":"1",
"validacion":"",
"valorDefecto":"",
"visible":"1",
"dependeDe":"",
"claveDependencia":"",
"etiqueta":"Datos de la tarjeta SIM",
"campoProtocolo":"4",
"etiquetaProtocolo":"",
"pantallaAyuda":"",
"descripcion":"",
"tamMax":"",
"postTransaccion":"0"
}
```
Type 6 - Product Amounts
Select a numerical amount to charge the card balance. It has a numeric type input, and some predefined figures in a horizontal list

```
{
"id":"",
"idProducto":"1",
"orden":"2",
"tipo":"6",
"editable":"1",
"validacion":"",
"valorDefecto":"0-300(1)|5,10,15,20,25,30,50", //first value -> range / second -> default amounts
"visible":"1",
"dependeDe":"",
"claveDependencia":"",
"etiqueta":"Importe",
"campoProtocolo":"2",
"etiquetaProtocolo":"",
"pantallaAyuda":"",
"descripcion":"",
"tamMax":"",
"postTransaccion":"0"
}
```
Type 16 - Select Plus
Select an image between some figures in a horizontal list. Each item have an image url and a text below

```
{
"id":"137101",
"idProducto":"1371",
"orden":"1",
"tipo":"16",
"editable":"1",
"validacion":"^[\\s\\S]+$",
"valorDefecto":"106",
"visible":"1",
"dependeDe":"",
"claveDependencia":"",
"etiqueta":"Tarifa",
"campoProtocolo":"3",
"etiquetaProtocolo":"tarifa",
"pantallaAyuda":"6",
"descripcion":"",
"tamMax":"",
"postTransaccion":"0"
}
```
Type 17 - Redirection
Allows you to directly open an external app, if it is installed, otherwise it will open in the store"
```
{
"id":"",
"idProducto":"",
"orden":"1",
"tipo":"17",
"editable":"0",
"validacion":"",
"valorDefecto":{
"comando":"app",
"parametros":{
"android":"com.app.name.prod",
"ios":"com.app.name.prod",
"CadenaApertura":""
}
},
"visible":"1",
"dependeDe":"",
"claveDependencia":"",
"etiqueta":"Amazon",
"campoProtocolo":"4",
"etiquetaProtocolo":"",
"pantallaAyuda":"",
"descripcion":"permite abrir directamente una app externa, si está instalada, en caso contrario abrirá en la store",
"tamMax":"",
"postTransaccion":"0"
}
```
Load Form
Import the library and use FormModule sending the json data to render the form.
You have to use FormModule with these parameters:
- Fields Json (wich would be the file that contains all the fields)
- Dependencies Json: Initial dependencies (fields values wich need to be consulted within an external api call)
- Data callback: to get the form data after being validated
- Dependencies Callback: to get new field values after check dependencies, and send them again to the library
```
import 'package:forms_library/form_library/di/app_module.dart';
....
//receive data in json
FormModule.getForm(
listJsonString,
initialDependenciesString,
(data) {
// return the form fields data when they have already been validated
print("DATA FORM: ${data}");
},
(List<dynamic> params,
DependencyCheckedCallback onDependencyResult) async {
final t = await ....
//return field values after check dependencies
onDependencyResult(t);
},
);
```
External Packages
The library depends on the following dependencies

For help getting started with Flutter development, view the online documentation, which offers tutorials, samples, guidance on mobile development, and a full API reference.
Libraries
- form_library/core/error/failure
- form_library/core/service/dependency_service
- form_library/core/util/debounce
- form_library/core/util/widket_key_data
- form_library/entity/dependency_entity
- form_library/entity/field_default_value_entity
- form_library/entity/field_entity
- form_library/entity/field_type
- form_library/entity/form_entity
- form_library/entry/app_module
- form_library/my_json_form_library
- form_library/presentation/bloc/fields_bloc
- form_library/presentation/controller/parse_json_form
- form_library/presentation/my_json_form_main
- form_library/presentation/views/combination/combination
- form_library/presentation/views/pages/field_page
- form_library/presentation/views/widgets/common/custom_info_bar
- form_library/presentation/views/widgets/common/platform_alert_dialog
- form_library/presentation/views/widgets/field_Event_info
- form_library/presentation/views/widgets/field_event_info
- form_library/presentation/views/widgets/field_item
- form_library/presentation/views/widgets/fields/alpha_input_widget
- form_library/presentation/views/widgets/fields/amount_widget
- form_library/presentation/views/widgets/fields/checkbox_widget
- form_library/presentation/views/widgets/fields/date_widget
- form_library/presentation/views/widgets/fields/input_widget
- form_library/presentation/views/widgets/fields/label_inputs_widget
- form_library/presentation/views/widgets/fields/multi_input_widget
- form_library/presentation/views/widgets/fields/qr_code_widget
- form_library/presentation/views/widgets/fields/redirect_widget
- form_library/presentation/views/widgets/fields/secure_input_widget
- form_library/presentation/views/widgets/fields/select_plus_widget
- form_library/presentation/views/widgets/fields/select_widget
- form_library/presentation/views/widgets/multi_field_info
- form_library/presentation/views/widgets/single_field_info
- forms_library