TextField
텍스트를 입력받기 위해 사용
텍스트필드에서 값을 입력받으면 텍스트에딧팅컨트롤러 사용해야함.
텍스트필드가 많으면 여러 컨트롤러 필요함 -> 관리 어려움
TextFormField
유효성 검사 쉽게 할 수 있음
쉽게 밸리데이션 값 등을 받아올수 있음.
Form(
child: Column(
children: [
TextFormField(
key: ValueKey(4),
decoration: InputDecoration(
prefixIcon: Icon(
Icons.email,
color: Palette.iconColor,
),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(
color: Palette.textColor1,
),
borderRadius: BorderRadius.all(
Radius.circular(35),
),
),
focusedBorder: OutlineInputBorder(
borderSide: BorderSide(
color: Palette.textColor1,
),
borderRadius: BorderRadius.all(
Radius.circular(35),
),
),
hintText: '이메일',
hintStyle: TextStyle(
fontSize: 14,
color: Palette.textColor1,
),
contentPadding: EdgeInsets.all(10)),
),
SizedBox(height: 8),
Padding
padding은 위젯 내부의 여백을 말합니다. 위젯의 경계와 그 안에 포함된 콘텐츠 사이에 공간을 만드는 역할을 합니다. padding을 사용하면 위젯의 경계 안에서 콘텐츠를 일정 간격만큼 떨어뜨려 배치할 수 있습니다.
위치: 위젯 내부에 위치하는 콘텐츠와 위젯 경계 사이의 간격을 의미합니다.
사용 예: 텍스트, 이미지 등이 위젯 경계에서 떨어져 있게 하고 싶을 때 사용.
Margin
margin은 위젯 외부의 여백을 말합니다. 위젯과 다른 위젯(또는 부모 컨테이너) 사이의 간격을 설정할 때 사용됩니다. margin을 사용하면 위젯이 배치되는 공간 외부에 여백을 둘 수 있습니다.
위치: 위젯 바깥쪽과 다른 위젯 또는 부모 사이의 간격을 의미합니다.
사용 예: 위젯과 다른 위젯 사이의 간격을 만들고 싶을 때 사용.
시각적 차이점
padding은 위젯 안쪽에서의 간격을 조정하여 위젯의 콘텐츠가 안쪽으로 밀려납니다.
margin은 위젯 밖에서 간격을 만들어 다른 위젯들과의 거리를 조정합니다.