[24-04-01]TIL Flutter Udemy

Firebase에 이메일/비밀번호 설정하는 법.

Card
MainAxisSize.min
Form
TextFormField
InputDecoration
KeyboardType(TextInputType.emailAddress)
autocorrect
textCapitalization: TextCapitalization.none
obscureText:true

파일을 만들고 main에서 import하는 법.
main에서 첫 화면을 구성하는법(다른 파일 화면)

_isLogin boolean을 만들고
_isLogin ? 'Login' : 'Signup'
으로 버튼값 나타낼 수 있음.

setState(() {
	_isLogin = !_isLogin;
});

으로 간단하게 bool값 변경 가능.
_isLogin true면 false,
false면 true로 변경됨.

ElevatedButton과 TextButton의 차이점

-ElevatedButton : 물리적인 높이를 가지며 그림자 효과를 제공함. 버튼이 돌출되어 보이는 효과가 있어, 사용자의 주의를 끌기에 적합함.
-TextButton : 배경이 없고, 텍스트만으로 구성된 버튼임. 간결하고 심플한 디자인이 특징이며, 클릭 시 잉크 스플래시 효과가 나타남.

ElevatedButton style설정법.

final _form = GlobalKey<FormState>();

var _enteredEmail = '';
var _enteredPassword = '';
  
void _submit() {
    final isValid = _form.currentState!.validate();
    if (isValid) {
      _form.currentState!.save();
      print(_enteredEmail);
      print(_enteredPassword);
   }
 }

Card(
                margin: const EdgeInsets.all(20),
                child: SingleChildScrollView(
                  child: Padding(
                    padding: const EdgeInsets.all(16),
                    child: Form(
                      key: _form, // 키 값 저장 위해 추가된 코드⭐️
                      child: Column(
                        mainAxisSize: MainAxisSize.min,
                        children: [
                          TextFormField(
                            decoration: const InputDecoration(
                              labelText: 'Email Address',
                            ),
                            keyboardType: TextInputType.emailAddress,
                            autocorrect: false,
                            textCapitalization: TextCapitalization.none,
                            validator: (value) {
                              if (value == null ||
                                  value.trim().isEmpty ||
                                  !value.contains('@')) {
                                return 'Please enter a valid email address.';
                              }

                              return null;
                            }, // 유효성 검사 하는 방법
                            onSaved: (value) {
                              _enteredEmail = value!;
                            }, // 데이터 저장하는 법
                          ),
                          TextFormField(
                            decoration: const InputDecoration(
                              labelText: 'Password',
                            ),
                            obscureText: true,
                            validator: (value) {
                              if (value == null || value.trim().length < 6) {
                                return 'Password must be at least 6 characters long.';
                              }
                              return null;
                            }, // 유효성 검사
                            onSaved: (value) {
                              _enteredPassword = value!;
                            }, // 데이터 저장
                          ),
                          const SizedBox(height: 12),
                          ElevatedButton(
                            onPressed: _submit, // submit 함수로 저장하기.
                            style: ElevatedButton.styleFrom(
                              backgroundColor: Theme.of(context)
                                  .colorScheme
                                  .primaryContainer,
                            ),
                            child: Text(_isLogin ? 'Login' : 'Signup'),
                          ),
                          TextButton(
                            onPressed: () {
                              setState(() {
                                _isLogin = !_isLogin;
                              });
                            },
                            child: Text(_isLogin
                                ? 'Create an account'
                                : 'I already have an account.'),
                          ),
                        ],
                      ),
                    ),
                  ),
                ),
              ),