flutter/widget

TextFormField

coens 2022. 5. 19. 09:51

- textfield에서 controller들을 관리하는게 번거로우니 쓰자.
- StatefulWidget에서 Form 위젯안에 넣음.
- Form위젯에 global 키를 지정하고 후에 validation에서 이 키로 form에 접근

if (_formKey.currentState!.validate()) {
  _formKey.currentState!.save();
}

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: MyHome(),
    );
  }
}

class MyHome extends StatefulWidget {
  @override
  State<MyHome> createState() => _MyHomeState();
}

class _MyHomeState extends State<MyHome> {
  final _formKey = GlobalKey<FormState>();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Form(
          key: _formKey,
          child: Column(
            children: [
              TextFormField(
                autovalidateMode: AutovalidateMode.onUserInteraction,
                key: ValueKey(1),
                validator: (val) {
                  if (val!.isEmpty) {
                    return "빈값이면 안됨";
                  } else {
                    return null;
                  }
                },
                onSaved: (val) {
                  print("저장됨!");
                },
              ),
              ElevatedButton(
                child: Text("저장"),
                onPressed: () {
                  if (_formKey.currentState!.validate()) {
                    _formKey.currentState!.save();
                  }
                },
              )
            ],
          ),
        ),
      ),
    );
  }
}

'flutter > widget' 카테고리의 다른 글

아이콘 만들어 주는 사이트  (0) 2023.09.08
Snackbar 케이스 정리  (0) 2022.05.15
FutureBuilder  (0) 2022.05.14