[flutter] Textfield에 border속성 주기

Textfield의 기본 속성을 적용하여 출력하면 다음과 같이 출력된다.

아래의 비밀번호와 같이 border속성을 주려면 textfield내부에 속성을 추가시켜주면 된다.

 

return TextField(
      controller: _emailController,
      style: TextStyle(fontFamily: 'Source_Sans_Pro'),
      decoration: InputDecoration( //border속성을 주기위한 decoration
          enabledBorder: OutlineInputBorder(
            borderSide: BorderSide(
              width: 1, color: Color(0xffD6D6D6) //넓이와 색상 설정
            )
          ),
          contentPadding: EdgeInsets.symmetric(vertical: 10, horizontal: 10),
 
          hintText: "이메일 주소",
          hintStyle: TextStyle(color: Color(0xff878787))),
    );