Stargazer

[Android] 안드로이드 스튜디오 팔레트 정리 본문

프로그래밍/Android

[Android] 안드로이드 스튜디오 팔레트 정리

COM2IT 2021. 7. 1. 22:56
반응형

안드로이드 스튜디오 내에 팔레트(Palette)로 액티비티의 화면을 구성할 수 있다.

각 카테고리별 컴포넌트를 조사해봤다.

 

카테고리 컴포넌트 설명 예시
Common TextView 화면에 텍스트를 표시하는 기능 앱 소개 타이틀
Button 사용자가 탭하거나 클릭하여 작업을 수행 할 수있는 사용자 인터페이스 요소 페이지 이동 버튼
imageView View 의 속성을 상속받아 공간 안에 사진을 넣음 배달 앱 음식 리뷰 사진
RecyclerView 스크롤이 가능한 컨테이너에 여러 개의 뷰를 담아서 보여주는 뷰 그룹으로 ListView가 더 진보하고 유연해진 버전 유튜브 추천 동영상 목록 무한정 스크롤
FragmentContainerView Fragment를 위해 특별히 설계된 레이아웃
FrameLayout을 확장하여 프래그먼트 트랜잭션을 안정적으로 처리 할 수 ​​있고, 프래그먼트 동작을 조정할 수있는 추가 기능도 있다.
frame layout 확장
ScrollView 수직(위아래)로 스크롤하는 기능
하나의 위젯만 가능
화면이 넘치도록 목록이 많을때
Switch 텍스트 오른쪽에 스위치 생성
스위치는 두 가지 옵션 중에서 선택할 수있는 두 상태 토글 스위치 위젯. 드래그하여 선택한 옵션을 선택하거나 간단히 탭하여 마치 확인란 인 것처럼 토글
on/off 스위치
Text TextView 화면에 텍스트를 표시하는 기능 앱 소개 타이틀
Plain Text 표준 텍스트 키보드를 표시하는 textview 입력 칸 
Password 표준 텍스트 키보드를 표시하고 개인 정보 보호를 위해 입력 한 텍스트를 숨김  패스워드 입력칸
Password(Numeric) 숫자 키보드를 표시하고 개인 정보 보호를 위해 입력 한 텍스트를 숨김  숫자 패스워드 
E-mail 스페이스 바 왼쪽에 "@" 문자를 추가하여 표준 텍스트 키보드를 표시  이메일 입력
Phone 사용자가 전화번호 형식의 텍스트(xxx-xxxx)를 입력하기 쉽게 숫자 키보드가 올라오고 '-'가 위치  전화번호 입력
Postal Address 사용자가 우편번호 형식의 텍스트를 입력하기 쉽게 키보드 맨 윗줄에 길게 탭했을 때 숫자가 입력됨  우편번호
Multiline Text 새 줄을 추가하기 위해 Enter 키를 추가하여 표준 텍스트 키보드를 표시   멀티 라인
Time 사용자가 시간 형식의 텍스트(예) 12:20)를 입력하기 쉽게 ":" 문자를 추가하여 숫자 키보드를 표시   숫자 키보드에 ':' 추가
Date 사용자가 날짜 형식의 텍스트(예) 2020/09/23)를 입력하기 쉽게 "/"문자를 추가하여 숫자 키보드를 표시   숫자 키보드에 '/' 추가
Number
기본 숫자 키보드를 표시합니다.  '-', ',' '.' 등의 부호가 입력되지 않음   일반 숫자
NumberNumber(Signed) 기본 숫자 키보드를 표시 , 시작시 + 또는-문자를 허용(양수,음수) 
숫자를 입력하는 도중에는 '-'를 입력할 수 없고, 이 외에 ','와 '.'를 쓸 수 없음 
 부호 있는 숫자
Number(Decimal) 기본 숫자 키보드를 표시, 소수점('.')을 허용합니다. '-'와 ','는 사용할 수 없음   소수점 양수 숫자
AutoCompleteTextView 사용자가 입력하는 동안 자동 완성 제안을 표시하는 편집 가능한 텍스트보기. 
제안 목록이 드롭 다운 메뉴에 표시되어 사용자가 편집 상자의 내용을 바꿀 항목을 선택 
 자동완성 지원 하는 텍스트
MutilAutoCompleteTextView 확장 가능한 편집 가능한 텍스트보기로, AutoCompleteTextView사용자가 전체 내용 대신 입력하는 텍스트의 하위 문자열에 대한 완성 제안을 표시    멀티 라인으로 자동완성
CheckedTextView 체크박스를 제공하는 확장 TextViewMainActivity에서 setOnClickListner을 통해 체크 박스의 체크와 해제 속성을 부여 할 수 있음   선택 가능한 텍스트
TextlnputLayout 텍스트를 입력하는 곳이 Layout의 속성을 가짐 
Layout의 속성을 설정하듯이 속성을 설정할 수 있음
 유동적인 텍스트(ex. 글자수 세기)
Buttons Button 사용자가 탭하거나 클릭하여 작업을 수행 할 수있는 사용자 인터페이스 요소
MainActivity에서 setOnClickListener로 버튼을 누르면 어떤 작업을 할 것인지 설정할 수 있음
 버튼
ImageButton 사용자가 누르거나 클릭 할 수있는 이미지 버튼을 표시
 
 이미지 버튼
Chip 워드 혹은 카테고리, 요소, 타입 등을 표현 할 때 종종 타원형의 background에 그 텍스트를 표현하는 버튼  다양한 스타일의 버튼
ChipGroup 다수의 chip을 관리할 수 있는 컴포넌트   그룹화
CheckBox 선택 또는 선택 해제 할 수 있는 체크박스 유형의 상태 버튼  다중 선택
RadioButton 원형으로 된 체크박스 라디오 버튼
RadioGroup 라디오 그룹을 사용하면 세트에서 하나의 옵션을 선택.
사용자가 사용 가능한 모든 옵션을 나란히 볼 필요가 있다고 생각되면 상호 배타적인 옵션 세트에 라디오 그룹을 사용
설문조사(매우 불만족 ~ 매우 만족) 등 다중 1택
ToggleButton 토글 버튼을 사용하면 두 상태 사이에서 설정을 변경, 누르기 전 후 버튼 안의 텍스트 변경
 
 Tab 키
Switch 텍스트 오른쪽에 스위치 생성
스위치는 두 가지 옵션 중에서 선택할 수있는 2 상태 토글 스위치 위젯. 드래그하여 선택한 옵션을 선택하거나 간단히 탭하여 마치 확인란 인 것처럼 토글
 on/off 스위치
FloatingActionButton UI 위에 원형의 떠 있는 듯한 버튼, 버튼을 활용하여 특수 동작 기능 넣을 수 있음  떠있는 버튼
Widgets View 액티비티 내에서 공간을 설정  특정 컴포넌트 삽입
imageView View 의 속성을 상속받아 공간 안에 사진을 넣음  이미지 삽입
WebView View 의 속성을 상속받아 특정한 url과 연결된 뷰를 넣음
각 OS별 내장된 웹 브라우저를 뷰형태로 앱에서 표현
 웹브라우저 뷰
VideoView View를 상속받고 액티비티에 동영상을 넣음 비디오 삽입
CalendarView View를 상속받아 캘린더를 넣음
탭, 클릭 이벤트로 날짜를 선택 할 수 있으며 원하는 날짜로 달력을 스크롤 하고 찾는 기능
 달력 삽입
ProgressBar 진행상황을 알려주는 원형의 컴포넌트  로딩바(원형)
ProgressBar(horizontal) 수평의 작업 진행률을 나타내는 사용자 인터페이스 요소
왼쪽 끝에서 부터 오른쪽으로 채워짐
 로딩바
SeekBar 드래그 가능한 썸을 추가하는 ProgressBar의 확장 위젯.
연속적인 실선 위를 움직이며 왼쪽 또는 오른쪽으로 끌거나 화살표 키를 사용하여 현재 진행률 수준을 설정 
 음량, 밝기 등 아날로그 식 조정
SeekBar(Discrete) 불연속적으로 놓여있는 점 위를 움직이며 조절하는 컴포넌트  채널 등 조절
RatingBar SeekBar 및 ProgressBar의 확장으로 별표로 등급 혹은 만족도 등을 표시  별점
SearchView 사용자가 검색어 입력 후 search provider 에게 검색을 요청할 수 있는 UI 를 제공
검색어 추천 리스트나 검색 결과 리스트를 보여주고 사용자는 해당 리스트에서 원하는 item 을 선택할 수 있다
 검색 창
TextureView TextureView를 사용하여 비디오나 openGL 같은 콘텐츠 스트림을 표시 할 수 있습니다   실시간 카메라 화면
SurfaceView 뷰 계층 구조에 포함 된 형식과 크기의 제어가 가능한 전용 드로잉 표면을 제공 사진 보정 등 이미지 편집
Horizontal Divider 수평으로 나눔  수평 구분
Vertical Divider 수직으로 나눔  수직 구분
Layouts ConstraintLayout 연결선을 통해 그 안에 추가된 뷰들의 위치를 결정  제약 레이아웃
LinearLayout(horizontal) 단일 열에 수평적으로 다른 view들을 정렬할 수 있는 layout  가로로 나열
LinearLayout(vertical) 단일 행에 수직적으로 다른 view들을 정렬할 수 있는 layout  세로로 나열
FrameLayout 여러 view들중 한 개의 view를 화면에 나타내기 위해 그 view가 차지할 구역을 가려버리기 위해 사용하는 layout  겹쳐서 
TableLayout view를 격자 형태로 배치 표 형식
TableRow TableLayout에 하위 뷰 표의 행을 의미
Space 공간 배치를 위한 위젯 배치를 도와주는 요소
Containers Spinner 여러개의 값 중 1개를 선택하기 위해 사용하는 안드로이드 에서 제공해주는 기본 위젯  날짜 선택 등 리스트 선택
RecyclerView 스크롤이 가능한 컨테이너에 여러 개의 뷰를 담아서 보여주는 뷰 그룹으로 ListView가 더 진보하고 유연해진 버전 유튜브 추천 동영상 목록 무한정 스크롤
ScrollView 수직(위아래)로 스크롤하는 기능
하나의 위젯만 가능
 스크롤 뷰
HorizontalScrollView 수평(좌우)으로 스크롤하는 기능  좌우 스크롤
NestedScrollView 한 화면에 여러개의 스크롤을 사용할 때   여러 스크롤 동시에 할때
ViewPager2 RecyclerView를 기반
ViewPager에서는 좌우 스크롤링만 가능, 상하 스크롤링기능을 추가
 목록을 보여줄 때
CardView CardView는 FrameLayout 클래스를 확장
둥근 모서리, 배경과 그림자가 추가된 FrameLayout
 카드 형식의 뷰
AppBarLayout LinearLayout 머티리얼 디자인 앱 바 개념의 많은 기능, 즉 스크롤링 제스처를 구현 하는 카테고리  커스텀 메뉴 바
BottomAppBar   .NET Framework를 "cradles" 시키는 모양의 배경을 지원하는 툴바의 확장  아래 쪽에 위치하는 앱바
NavigatationView 애플리케이션의 표준 탐색 메뉴, 메뉴 내용은 메뉴 리소스 파일로 채울 수 있음  네비게이션
BottomNavigationView NavigatationView 하단 위치  하단 네비게이션
Toolbar  응용 프로그램 콘텐츠 내에서 사용하기위한 표준 도구 모음  도구 모음
TabLayout  탭을 표시하기위한 가로 레이아웃을 제공  탭 표시 레이아웃
TabItem TabLayout 레이아웃 내에서 탭 항목을 선언 할 수있는 특수한 '보기'
TabLayout에 추가되지 않으며 탭 항목의 텍스트, 아이콘 및 사용자 정의 레이아웃을 설정할 수 있음
 각 탭 항목
ViewStub  런타임에 레이아웃 리소스를 느리게 확장하는 데 사용할 수 있는 크기가 0 인 보이지 않는 보기 런타임에서 늦은 전개를 원할 때 사용
<include> 레이아웃에 재사용 가능한 구성요소를 추가  구성요소를 재사용 할때
<fragment>  FramentActivity 내의 어떤 동작 또는 사용자 인터페이스의 일부, 액티비티의 모듈식 섹션
여러 개의 프래그먼트를 하나의 액티비티에 결합하여 창이 여러 개인 UI를 빌드할 수 있으며, 하나의 프래그먼트를 여러 액티비티에서 재사용할 수 있음
자체적인 수명 주기를 가지고, 자체 입력 이벤트를 수신하고, 액티비티 실행 중에 추가 및 삭제가 가능
 액티비티 기능 분할
NavHostFragment  자체 포함 된 navigation이 발생할 수 있도록 레이아웃 내에 영역을 제공  
<view> 다른 View들을 포함하고 있거나 포함할 수 있는 View를 말하며, 일반적으로 ViewGroup을 상속하면서 Layout이 아닌 클래스를 지칭  
<requestFocus> 해당 뷰 focus  
Helpers Group 일련의 위젯의 가시성을 제어한다  
Barrier(Horizontal) 여러가지 참조한 위젯 들 중 가장 끝의 위젯을 기반해 가상의 가이드라인을 만든다.  가이드라인(유동)
Barrier(Vertical) 여러가지 참조한 위젯 들 중 가장 끝의 위젯을 기반해 가상의 가이드라인을 만든다. 가이드라인(유동)
Flow 체인과 비슷하게 참조된 위젯을 배치한다.  
Guideline(Horizontal) 레이아웃 용도로만 사용되는 배치 도움 가이드라인(고정) 가이드라인(고정)
Guideline(Vertical) 레이아웃 용도로만 사용되는 배치 도움 가이드라인(고정) 가이드라인(고정)
Layer 참조된 뷰의 가시성과 고도 제어  
ImageFilterView 이미지들을 표시, 결합, 필터링 할 수 있다.
다양한 일반적인 필터링 연산을 다루는 ImageVIew의 하위 클래스
 
ImageFilterButton 이미지들을 표시, 결합, 필터링 할 수 있다
다양한 일반적인 필터링 연산을 다루는 AppCompatImageButton의 하위 클래스
 
MockView 프로토타이핑 레이아웃에 유용한 뷰  
Google AdView View배너 광고를 표시API 광고 표시
MapView Google지도 서비스에서 얻은 데이터와 함께지도를 표시하는 API 맵 표시
Legacy GridLayout 사각형의 grid(격자 무늬를 생각하면 쉽다)안에 children을 위치시키는 layout 격자 구성으로 분리
ListView 사용자가 정의한 데이터 목록을 아이템 단위로 구성하여 화면에 출력하는 ViewGroup의 한 종류 목록 표시
TabHost 여러 탭을 두고 각 탭을 클릭할 때마다
해당 화면이 나오도록 설정하는 뷰 컨테이너
 탭 누를때마다 바뀌는 화면
RelativeLayout children간에 혹은 parent와의 상대적인 위치에 따라 표시될 영역을 결정하도록 만드는 layout 상대적인 위치
GridView 여러 개의 행과 열로 아이템을 배치 격자 구성

RecyclerView vs ListView(or GridView)

RecyclerView =  ListView + GridView

따라서 성능은 RecyclerView가 더 좋음

 

RecyclerView vs ScrollView

RecyclerView는 여러가지 요소를 포함하여 스크롤 가능하지만,

ScrollView는 하나의 요소에 대해서만 스크롤할 수 있게 한다. (큰차이는 없다...)

(다만, 겹쳐 사용핼때는 이중스크롤이 되므로, 이를 알아서 해결해 주는 NestedScrollView 를 사용해 주면 된다)

 

textureView vs SurfaceView

TextureView : 카메라를 이용한 무언가의 기능을 만들어 낼 때 사용. ex) 스트리밍 서비스, 실시간 얼굴 인식

SurfaceView : 이미지 프로세싱과 관련된 기능을 만들어 낼 때 사용. ex) 사진 보정

 

Barrier vs Guideline

베리어는 UI 크기 따라 변하는데 반해 가이드 라인은 지정한 위치에 고정된다.

 

ps. helpers 항목은 최근에 나왔는지 검색해도 안나오는 것들이 몇몇 있어서 생략했다...

 

반응형
Comments