[Flutter] Widgets - FormBuilder 4

이번 카테고리는 form 관련 위젯인 FormBuilder 에 대해서 알아보겠습니다.

입력받은 정보를 다른 페이지에 전달하는 방법에 대해서 알아보겠습니다.

개발환경 : 윈도우11, 안드로이드 스튜디오, flutter 3.0.1

소스코드 위치 - Release 06_data_transfer · mike-bskim/flutter_form_builder_test · GitHub

Release 06_data_transfer · mike-bskim/flutter_form_builder_test

 

 

 

화면은 아래와 같습니다.

 

 

 

main.dart 수정 - 데이터를 정리하여 다음 페이지로 전달.

 

// final inputValues = _fbKey.currentState!.value;
Map<String, dynamic> tempValues = form.value;
debugPrint('form.value: [$tempValues]');
debugPrint('regionName: [${_typeAheadController.text}]');

Map<String, dynamic> inputValues;
inputValues = {}..addAll(tempValues);
//FormBuilderTypeAhead 가 단종되어 TypeAheadFormField 패키지 사용으로 데이터 병합이 필요함
inputValues['regionName'] = _typeAheadController.text.toString();
debugPrint('inputValues: [$inputValues]');

Navigator.pushReplacement(
  context,
  MaterialPageRoute(builder: (context) {
    return Result(values: inputValues);
  }),
);

 

result.dart 신규추가

 

import 'package:flutter/material.dart';
import 'main.dart';

class Result extends StatelessWidget {
  final Map<String, dynamic> values;

  const Result({Key? key, required this.values}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Result'),
        actions: <Widget>[
          IconButton(
            icon: const Icon(Icons.add),
            onPressed: () {
              Navigator.pushReplacement(
                context,
                MaterialPageRoute(builder: (context) {
                  return const MyHomePage();
                }),
              );
            },
          )
        ],
      ),
      body: ListView.builder(
        itemCount: values.length,
        itemBuilder: (BuildContext context, int index) {
          String key = values.keys.elementAt(index);

          return Card(
            child: ListTile(
              title: Text('$key: ${values[key]}'),
              subtitle: Text('Data Type: ${values[key].runtimeType}'),
            ),
          );
        },
      ),
    );
  }
}

 

 

 

 

 

[참고자료] 헤비프랜

- https://www.youtube.com/watch?v=M_0CE-IgurY&list=PLGJ958IePUyBL7BP-UU7-4AvCNw0DBy_s&index=2&t=935s