사용자가 문자와 숫자를 입력할 수 있는 가장 기본적인 입력 컨트롤이다. 사용자 이름, 이메일주소, 전화번호, 비밀번호와 같은 일반적인 정보부터 상품 금액, 계좌번호, 가격 정보 등 상세한 정보 수집이 필요한 상황에서 범주화 할 수 없는 정보 입력을 요청해야 할 경우 주로 사용된다.
ICE4에서는 2가지 유형의 텍스트 필드를 제공한다.
라벨 UP, 라벨 SIDE
UI 구조
텍스트 필드의 기본 구조는 다음과 같다.
1 | 필드 라벨 | 입력 필드에 입력 할 정보가 무엇인지 제목 표시 |
2 | 입력 필드 | 라벨 하단에 있는 텍스트 입력 영역으로, 입력 정보를 실시간으로 출력 |
3 | 플레이스 홀더 텍스트 | 입력 받을 정보에 대한 부가적인 요청 문구로 정보가 입력되면 사라짐 |
4 | 입력 텍스트 | 사용자가 입력 필드에 작성한 텍스트 |
5 | 커서(Cursor) | 사용자에 의해 입력된 텍스트의 필드 내의 현재 입력 위치 표시 |
6 | 클리어 버튼 | 필드에 입력한 정보를 한번에 삭제 |
7 | 도움말 텍스트 | 사용자가 정보 입력 중 필드 하단에 노출되는 도움말 문구 |
8 | 툴팁 | 물음표 아이콘이 라벨 옆에 출력되며, 마우스 오버시 출력되는 안내 문구 |
9 | 아이콘 |