Android Palette Component 총정리 1편 : Text, Buttons

JIYOON·2021년 7월 9일
1

Android

목록 보기
3/9
post-thumbnail

📣 목표 : 안드로이드의 레이아웃에 사용되는 팔레트 컴포넌트들을 알아보자!

다음 컴포넌트들은 안드로이드 공기계에 연결하거나 가상 머신을 통해 하나씩 추가하면서 경험해보는 편이 이해하기 쉽다.



1️⃣ Text

01. TextView

화면에 텍스트를 표시한다.


02. Plain Text

터치 시 화면에 표준적인 텍스트 키보드를 표시한다.
유저는 해당 컴포넌트에 텍스트를 입력할 수 있다.


03. Password

터치 시 화면에 표준적인 텍스트 키보드를 표시하나, 개인정보 보호를 위해 입력한 텍스트를 나타내지 않는다.
비밀번호를 입력할 때 사용된다.


04. Password (Numeric)

터치 시 화면에 숫자 키보드를 표시한다. 개인정보 보호를 위해 입력한 텍스트를 나타내지 않는다.
화면에는 다음과 같이 나타난다.
비밀번호를 입력할 때 사용된다.

아래부터 표시되는 형식은 위와 같으나 키보드에 표시되는 자판과 종류가 바뀐다.


05. E-mail

터치 시 스페이스바의 왼쪽에 "@"가 추가된 텍스트 키보드를 표시한다.
이메일을 입력할 때 사용된다.


06. Phone

터치 시 화면에 숫자 키보드를 표시한다.
전화번호 형식을 입력하기 쉽도록 "-" 등이 표시된다.
전화번호를 입력할 때 사용된다.


07. Postal Address

터치 시 화면에 텍스트 키보드를 표시한다.
주소를 입력할 때 사용된다.


08. Multiline Text

터치 시 화면에 텍스트 키보드를 표시한다.
키보드에 '다음' 대신 '엔터'로 표시된다.
여러 줄 의 텍스트를 입력할 때 사용된다.


09. Time

터치 시 화면에 숫자 키보드를 표시한다.
시간을 입력할 때 사용된다.


10. Date

터치 시 화면에 숫자 키보드를 표시한다.
날짜를 입력할 때 사용된다.


11. Number

터치 시 화면에 숫자 키보드를 표시한다.
숫자를 입력할 때 사용된다.
'-', '+', '.', ',' 등의 부호가 입력되지 않는다.


12. Number (Signed)

터치 시 화면에 숫자 키보드를 표시한다.
숫자를 입력할 때 사용된다.
음수나 양수를 나타내기 위해 '-', '+' 부호를 입력할 수 있으며 '.', ',' 부호는 입력할 수 없다.


13. Number (Decimal)

터치 시 화면에 숫자 키보드를 표시한다.
숫자를 입력할 때 사용된다.
소수점을 나타내기 위해 '.' 부호는 사용할 수 있으며 '-', '+', ','는 입력할 수 없다.


14. AutoCompleteTextView

터치 시 화면에 텍스트 키보드를 표시한다.
사용자가 텍스트를 입력하는 동안 자동 완성 제안 목록을 키보드 상단에 표시하여 사용자가 목록을 선택할 수 있다.
한 개의 단어만을 자동으로 완성시킨다.


15. MutilAutoCompleteTextView

터치 시 화면에 텍스트 키보드를 표시한다.
사용자가 텍스트를 입력하는 동안 자동 완성 제안 목록을 키보드 상단에 표시하여 사용자가 목록을 선택할 수 있다.
콤마(,)로 구분하여 여러 개의 단어를 자동으로 완성시킨다.

❗️ 추가 조사 필요 : 화면에 띄워놓고 여러 가지로 시도해봤는데 솔직히 AutoCompleteTextView와 MutilAutoCompleteTextView의 차이를 모르겠다...


16. CheckedTextView

체크박스를 제공하는 확장 TextViewMainActivity에서 setOnClickListner을 통해 체크 박스의 체크와 해제 속성을 부여 할 수 있다.


17. TextlnputLayout

화면의 텍스트를 입력하는 부분이 layout 속성을 지니며 layout과 같은 속성을 설정할 수 있다.





2️⃣ Buttons

01. Button

사용자가 터치하여 작업을 수행 할 수있는 사용자 인터페이스 요소이다.
MainActivity(혹은 연결된 자바 클래스 파일)에서 setOnClickListener로 버튼을 누르면 어떤 작업을 할 것인지 설정할 수 있다.


02. ImageButton

사용자가 터치 할 수있는 이미지가 들어간 버튼을 표시한다.


03. ChipGroup

다수의 Chip을 관리할 수 있는 컴포넌트


04. Chip

카테고리, 요소, 타입 등을 표현 할 때 사용하는 텍스트가 들어간 타원형의 버튼을 표시한다.
필터링 설정이나 작은 텍스트를 보여주는 데 유용하다.

이미지 예시는 다음과 같다.


(이미지 출처 : 언제나중수 )


05. CheckBox

선택 및 선택 해제할 수 있는 체크박스를 표시한다.
하나의 그룹 내에서 여러 개의 항목을 동시에 선택하기 위해 사용한다.


06. RadioGroup

여러 개의 RadioButton을 관리한다.


07. RadioButton

원형으로 된 체크박스를 표시한다.
하나의 그룹 내에서 하나만 선택할 수 있으며, 하나를 선택하게 되면 그룹 내의 다른 선택지들은 자동으로 선택이 해제된다.


08. ToggleButton

두가지 상태중에 하나로 토글되어지도록 만든 버튼을 표시한다.
android:textOff 속성을 이용해 Toggle이 off인 상태일 때 Button에 나타날 text를 설정할 수 있다.
android:textOn 속성을 이용해 Toggle이 on인 상태일 때 Button에 나타날 text를 설정할 수 있다.
MainActivity(혹은 연결된 자바 클래스 파일)에서 setOnCheckedChangeListerner를 설정하여 토글 시 반영될 변화를 설정할 수 있다.


09. Switch

왼쪽에 텍스트가 있는 스위치를 생성한다.
탭하거나 드래그하여 두 가지 옵션 중에 선택할 수 있다.


10. FloatingActionButton


(이미지 출처 : 숲 속의 작은 이야기)

위와 같이 특수 동작 기능을 넣을 수 있는 화면의 최상위에 고정된 원형의 UI 버튼을 생성한다.





✅ Reference

팔레트(palette) 전부 정리 by yesiamnahee

0개의 댓글