Simple Form Builder
满足您所有需求的完整表单生成器
维护者: Tanmoy Karmakar 贡献者: Shayon Sarkar
规格
该库允许您通过包含多种字段类型的 JSON 文件创建完整的表单:text、checkbox、multiselect、datetime、date、time 和 file upload。此包还提供其他备注选项。
它已100% 用 Dart 编写。❤️
安装
将以下内容添加到您的 pubspec.yaml 文件中
dependencies:
simple_form_builder: ^0.0.18
简单用法
要集成 Simple Form Builder,您只需遵循给定的 JSON schema 并将其传递给 formBuilder widget
JSON Schema
// The complete sample is provided in the global folder that can be used as a reference
{
"status": 1,
"data": [
{
"questions": [
{
"question_id": String,
"fields": ["abvoe 40km/h", "below 40km/h", "0km/h"],
"_id": "60dc6a3dc9fe14577c30d271",
"title": "Please provide the speed of vehicle?",
"description": "please select one option given below",
"remark": true,
"type": "multiple",
"is_mandatory": true
}
]
}
]
}
Widget 实现
import 'package:flutter/material.dart';
import 'package:simple_form_builder/formbuilder.dart';
import 'package:simple_form_builder/global/constant.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'FormBuilder Example',
home: Scaffold(
appBar: AppBar(
title: Text('Material App Bar'),
),
body: SingleChildScrollView(
child: Column(
children: [
FormBuilder(
initialData: sampleData,
index: 0,
showIndex:true,
// showPrefix
//radioIcon
//checklistIcon
onSubmit: (val) {
print(val);
},
),
],
),
),
),
);
}
}
自定义用法
有几个选项可以提供更多控制
| 属性 | 描述 |
|---|---|
initialData |
这是生成表单所需的 map。示例 JSON 格式在 constant.dart 文件中提供 |
index |
如果数据包含多个表单,则传递表单的索引将显示该特定表单的问题 |
onSubmit |
当按下提交按钮时,此函数将接收 map 值并将其传递给给定的函数 |
showPrefix |
此切换将启用或禁用问题前的 prefix 图标 |
onUpload |
这包含用户上传的文件(字符串格式) |
showIndex |
用于指定是否显示编号 |


