[View]: Widget, layout
Android/Android UI

[View]: Widget, layout

728x90
반응형

매일 써왓던 기초적인 안드로이드 UI이지만

코틀린기반 안드로이드를 배우는김에 

(조금은 지루하더라도)
전체적으로 다시 정리해보기로했습니다. 

^^

 

Views

= Widget(View) + Layout(Viewgroup)

안드로이드에서 눈에 보이는 모든 요소를 View라고 부르고, 개발자가 배치하는 모든 View 들은 Class로 제공되는데 모두 View라는 클래스를 상속받고 있습니다. ViewView 클래스는 모든 UI 요소들의 부모 클래스로써 WidgetLayout으로 나뉩니다.

View(android.view.View) 클래스는 화면의 사각형 영역에 있는 콘텐츠나 화면 레이아웃을 담당합니다. 즉 화면영역에 오브젝트들을 배치하고, 위치를 재고, 그리고, 포커싱을 바꾸고, 스크롤을 하는 등의 일을 합니다. 

 

Widget

=View

문자열 입력, 문자열 출력 등 어떤 기능을 가지고 있고 사용자와 상호 작용을 하는 View들을 통칭해서 Widget이라고 부릅니다.

View 클래스는 위젯(화면에 어떤 것을 그리는 모든 행위를 하는 클래스들의 집합)의 기본 클래스이며, 이 위젯에 해당하는 클래스들로는 Text, EditText, InputMethod , MovementMethod, Button, RadioButton, Checkbox, and ScrollView. 등이 있습니다. 

 

 

Layout

=Viewgroup =Container

Viewgroup(android.view.Viewgroup) 은 화면의 Layout 이다. 즉 각각의 View 들을 합쳐서 전체 구조를 그리고 화면의 전체 Layout 을 그려려냅니다.다른 View 들을 포함 하고(Container) 내부의 View를 통합 관리하고(View Group) 내부 View들이 배치되는 모양을 결정(Layout) 합니다. 이 Layout에 해당하는 클래스로는 Linearlayout, ConstantLayout 등이 있습니다.

 

Activity의

Viewgroup Tree

그림에서 보듯이 Viewgroup 이 다수의 View 를 포함하고 있고 Viewgrpup 도 포함하고 있는 것을 볼 수 있습니다. 예를 들면 RadioButton 컴포넌트를 여러 개 둔 하나의 Viewgroup 을 만들 수 있는 것이죠. 이렇게 구성된 Tree 구조물을 화면에 표현하기 위해서 Activity 클래스의 setContentView() 메서드를 호출합니다. 여기서, Activity 가 시스템으로부터 화면을 그려라, 또는 포커싱을 하라는 등의 노티를 받게 되면 트리의 최상위 root node로로 드로잉(Draw()) 요청을 하게 된다.이 Root node는는 요청을 받게 되면 하위 child node까지까지 모두 드로잉 하라는 명령을 전달하게 됩니다. 

 

LayoutParams: How a Child Specifies Its Position and Size

모든 Viewgroup 은 ViewGroup.LayoutParams를 상속받은 nested class를 사용하고, 이 서브클래스는 하위 클래스의 크기, 위치, 프로퍼티 등을 정의합니다. 모든 Viewgroup 은 width와 height를 가지고 있으며 다수의 Viewgroup 은 border, margin 값을 가지고도 있습니다.

LayoutParams

 

안드로이드 화면 만들기

안드로이드의 기본 클래스는 Activity(android.app.Activity) 클래스인데, Activity 클래스는 아주 많은 것을 할 수 있지만 지 혼자서는 화면에 아무 짓도 하지 못합니다. 이 Activity 클래스에 화면 기능을 하기 위해서는 View, Viewgroups와 항상 같이 작업을 해줘야 합니다.

안드로이드는 화면에 layout 을 배치하고 그 안에 다른 layout이나 widget을 배치하여 화면의 모양을 만들고 이렇게 만들어진 화면은 모두 객체로 생성되므로 개발자는 이 객체들을 이용해 코드에서 필요한 작업을 할 수 있습니다.

 

 

이제부터 안드로이드 화면을 구성하는 Layout과  Widget에 대하여 자세히 알아보겠습니다.

 


Layout


안드로이드는 view를 배치할 때 좌표가 아닌 배치되는 모양을 결정하여 화면을 구성합니다.

개발자가 배치되는 모양을 결정하고 View들을 배치하면, 안드로이드 OS가 단말기에 적합한 좌표를 계산하고 View들을 배치하게 됩니다.

 

안드로이드는 화면을 구성하기 위해 layout 을 먼저 배치하고 그 위에 다른 View 들을 배치하게 됩니다. 이때 layout 을 Parent라고 부르고 배치되는 View 들을 Child라고 부릅니다. 모든 View 들은 단 하나의 Parent를 가질 수 있으며 모든 layout 은 다수의 Child를 가질 수 있습니다.

 

 

LinearLayout

LinearLayout 은 좌에서 우, 위에서 아래 방향으로 View 들을 배치할 수 있는 layout이다.

 

  • 방향성을 가지고 view를 배치하는 layout이다.
  • 가로 혹은 세로 방향으로 배치할 수 있으며 한 칸에 하나의 view 만 배치할 수 있다.
  • 안드로이드에서 가장 많이 사용하는 layout으로 여러 LinearLayout을 조합하여 다양한 모양을 만들 수 있다.

LinearLayout의 주요 속성

  • orientation : 배치되는 모양을 결정한다.
  • weight : LinearLayout 안에 배치되는 View 들의 비율을 설정한다.

FrameLayout

FrameLayout 은 중첩해서 view를 배치할 수 있는 Layout이다. TableLayoutTableLayout

 

  • 내부에 배치된 View들이 같은 자리에 계속 배치되는 layout이다.
  • 화면을 구성하기보단 탭 등과 같은 기능을 만들 때 사용하는 경우가 많다.

FrameLayout의 주요 속성

  • 주요 속성은 없다.
  • FrameLayout에 배치되는 view는 모두 좌측 상단에 배치된다.
  • margin 속성이나 layout_gravity 속성을 이용해 배치되는 위치를 결정하여 사용한다.

TableLayout

TableLayout은 표의 형태로 view 를 배치 할 수 있는 layout 이다.

  • 표를 작성하는 방법으로 view 를 배치하는 layout 이다.
  • HTML의 table 태그와 유사하다.

구조

  • TableLayout 안에 TableRow를 배치한다.
  • TableRow는 줄 하나를 의미한다.
  • TableRow에 view 를 배치하면 배치한 view 의 개수 만큼 칸이 생겨난다.

TableLayout의 주요 속성

  • stretchColumns : TableRow 안의 view 들이 가로로 늘어날 비율을 설정한다.
  • shrinkColumns : TableRow 안의 view 들이 화면에 보일 수 있도록 줄어들게 한다.

TableRow의 주요 속성

  • layout_column : view 가 배치될 위치를 설정한다.
  • layout_span : view 가 배치될 칸의 개수를 설정한다.

RelativeLayout

RelativeLayout은 Parent 나 다른 view 와의 관계를 설정하여 배치한다.

  • Parent나 다른 view 와의 관계를 설정하여 배치하는 layout 이다.
  • Relative Layout 에는 특별한 속성이 없지만 배치되는 view 들의 속성을 이용해 배치를 결정하게 된다.

 

RelativeLayout에 배치되는 View들의 주요 속성

 

  • layout_centerHorizontal : 세로 방향의 중앙에 정렬한다.
  • layout_centerVertical : 가로 방향의 중앙에 정렬된다.
  • layout_centerInParent : 가로 세로 모두 중앙에 정렬된다.
  • layout_alignTop : 자신의 상단 부분을 지정된 view 의 상단 부분에 일치 시킨다.
  • layout_alignBottom : 자신의 하단 부분을 지정된 view 의 하단 부분에 일치 시킨다.
  • layout_alignLeft : 자신의 좌측 부분을 지정된 view 의 좌측에 일치 시킨다.
  • layout_alignRight : 자신의 우측 부분을 지정된 view 의 우측에 일치 시킨다.
  • layout_alignBaseline : 자신의 Baseline 부분과 지정된 view 의 Baseline을 일치시킨다.
  • layout_above : 지정된 view 상단에 배치한다.
  • layout_below : 지정된 view 하단에 배치한다.
  • layout_toRightOf : 지정된 view 우측에 배치한다.
  • layout_toLeftOf : 지정된 view 좌측에 배치한다.

ConstraintLayout

RelativeLayout 을 개선한 layout 으로 RelativeLayout 보다 유연하게 화면을 구성할 수 있다.

 

제약조건

  • ConstraintLayout 은 RelativeLayout 처럼 부모와의 관계나 다른 View와의 관계를 설정하게 된다.
  • 제약 조건은 다음과 같이 두 가지를 사용할 수 있다.
  • 실선 제약 조건 : 지정된 기준으로부터 얼마큼 떨어진 위치에 있는지 좌표를 설정한다.
  • 스프링 제약 조건 : 지정된 기준으로부터 얼마큼 떨어진 위치에 있는지 비율을 설정한다. 
  • ConstraintLayout은 부모나 다른 View 와의 관계를 설정하여 위치를 결정하는 Layout 이다.
  • 제약 조건에는 좌표를 설정하는 실선 제약 조건과 비율을 설정하는 스프링 제약 조건이 있다.

Space

  • Space는 화면 구성 시 여백이 필요할 때 사용하는 View 이다.
  • Space는 Layout은 아니지만 Layout을 이용해 화면을 구성할 때 보조 수단으로 사용하는 View 이다.
  • 화면을 구성할 때 여백이 필요할 경우 사용한다.

GridLayout

GridLayout는 Grid 형태로 View를 배치하는 Layout 이다.

 

  • Grid를 설정하여 View를 배치하는 Layout이다.
  • TableLayout을 보완하기 위해 제공되는 Layout이다.

 

GridLayout의 주요 속성

  • rowCount : 그리드 레이아웃의 줄의 개수
  • columnCount : 그리드 레이아웃의 칸의 개수

GridLayout에 배치되는 View의 주요속성

  • layout_column : View가 배치될 칸이 위치 (0 부터 시작)
  • layout_row : View가 배치될 줄의 위치 (0부터 시작)
  • layout_columnSpan : View가 차지할 칸의 수
  • layout_rowSpan : View가 차지할 줄의 수
  • layout_columnWeight : 남은 공간을 차지할 가로 비율
  • layout_columnHeight : 남은 공간을 차지할 세로 비율

Include Other Layout

  • Include Other Layout을 사용하면 다른 layout 파일로 부터 생성된 화면을 삽입할 수 있다.
  • Layout 에서 다른 Layout 을 포함시킬 수 있는 개념이다.
  • 다수의 화면을 구성할 때 중복되는 부분이 있을 경우 사용한다.

Include Other Layout  주요 속성

  • layout : 삽입할 화면의 데이터를 정의한 layout 파일

Widget


Widget의 기본 개념

  • 어떠한 기능을 갖고 사용자와 상호작용 하는 View 들을 Widget이라고 부른다.
  • Widget은 Layout 위에 배치되어 화면에 나타나고 코드를 통해 Widget 통제하여 사용자와 소통을 하는 수단이 된다.

위젯의 사용 패턴

  • 먼저 Layout에 사용하고자 하는 Widget을 배치한다.
  • 이 때, Activity가 실행되면 화면이 구성되고 화면에 배치된 모든 View들은 객체로 생성된다.
  • 객체로 생성된 View 중에 필요한 Widget들의 주소 값을 얻어와 코드로 이들을 통제하게 된다.
  • 필요하다면 이벤트에 대한 코드를 구성하여 사용한다.

TextView

  • TextView는 화면에 문자열을 표시 할 수 있는 View 이다.
  • 사용자에게 전달하고자 하는 문자열을 표시하는 View 이다.
View 객체의 주소값 가져오기
코드에서 View를 제어하기 위해서는 View 객체의 주소 값을 얻어와야 한다.
자바로 개발할 때는 개발자가 View 객체의 주소 값을 직접 얻어와야 하지만 Kotlin의 경우 id와 같은 이름의 변수가 자동으로 선언되고 View 의 주소 값도 담겨있게 된다.

TextView의 주요 속성

  • text : TextView를 통해 보여 줄 문자열
  • lines : 표시하고자 하는 문자열의 라인 수
  • textColor : 표시되는 문자열의 색상
  • textSize : 표시되는 문자열의 크기
  • textAppearance : 표시되는 문자열의 형식

TextView의 주요 프로퍼티

  • text : TextView를 통해 보여주는 문자열을 관리한다.

TextView의 주요 메서드

  • setBackgroundColor : 배경 색상을 지정한다.
  • setTextColor : 글자 색상을 지정한다.
  • append : 문자열을 추가한다.

Button

Button은 사용자가 클릭하면 작성된 코드를 처리하는 View 이다.

문자열을 표시하는 Button과 이미지를 표시하는 ImageButton을 제공한다.

  • 사용자가 클릭하면 개발자가 만든 코드를 동작시켜 주는 View이다.
  • Button은 문자열을 표시하는 Button과 이미지를 표시하는 ImageButton이 있다.

 

Button의 주요 속성

  • text : Button의 문자열을 설정한다.
  • srcCompat : ImageButton의 이미지를 설정한다.

Button의 이벤트

  • OnClick : 사용자가 Buttton을 Click하면 발생하는 이벤트이다.

TextView의 주요 프로퍼티

  • text : TextView를 통해 보여주는 문자열을 관리한다(OnClickListener).
Kotlin 기반 안드로이드에서의 이벤트 처리
  • Kotlin 기반 안드로이드에서 이벤트처리는 자바 기반 프로젝트와 동일하다.
  • 이벤트와 관련된 Listener 클래스를 구현하고 객체를 생성한 다음 메서드를 통해 View에 설정하면 된다.
  • 추가적으로 이벤트와 관련된 메서드 대부분은 고차 함수로도 제공이 되는데 이를 이용하면 편하게 작성할 수 있다.
  • 여러 View에 대한 처리를 동시에 할 경우에는 Listener를 추천하고 각각 따로 처리할 때는 고차 함수 방식을 추천한다.

EditText

  • EditText는 사용자에게 문자열 값을 입력 받을 수 있는 View 이다.

EditText의 주요 속성

  • text : EditText에 표시할 문자열을 설정한다.
  • hint : 입력된 값이 없을 경우 표시할 안내 문구를 설정한다.
  • inputType : 입력 값에 대해 설정한다. 표시되는 형식, 나타나는 키보드 등에 영향을 준다.
  • imeOptions : 나타나는 키보드의 Enter 키 모양을 설정한다.

EditText의 주요 프로퍼티

  • text : 사용자가 입력한 문자열 값

EditText의 이벤트

  • TextWatcher : 사용자가 입력한 내용을 실시간으로 감시한다.
  • EditorAction : 키보드의 Enter 키를 눌렀을 때 발생하는 이벤트

TextInputLayout

TextInputLayout은 EditTextd에 몇 가지 기능을 추가한 입력 요소이다.

  • EditText를 보완한 View이다.
  • EditText의 속성, 이벤트, 프로퍼티 등을 그대로 사용하며 몇 가지 요소가 추가되었다.

TextInputLayout 의 주요 속성

  • hint : 입력한 내용이 없으면 보여줄 안내 메시지이다. EditText와 다르게 문자열을 입력하면 상단 부분으로 올라간다.
  • counterEnabled : 입력한 글자의 수가 나타난다.
  • counterMaxLength : 지정한 글자수를 넘으면 붉은 색으로 표시해준다.

TextInputLayout 의 주요 프로퍼티

  • editText : TextInputLayout이 가지고 있는 EditText 객체의 주소 값
  • error : 오류로 표시할 메시지를 설정한다.

ImageView

ImageView는 사용자에게 이미지를 보여주기 위한 뷰이다.

 

ImageView의 주요 속성

  • srcCompat : 보여줄 이미지를 지정한다. 안드로이드 4 버전까지는 src 였는데 백터 방식의 이미지(SVG, PSD 등)을 처리할 수 있는 기능을 추가혀여 srcCompat로 변경하였다.

ImageView의 주요 메서드

  • setImageResource : res 폴더에 있는 이미지를 설정한다.
  • setImageBitmap : Bitmap 객체로 만들어진 이미지를 설정한다.
  • setImageDrawable : Drawable 객체로 만들어진 이미지를 설정한다.

Drawable vs Mipmap

  • 안드로이드에서 이미지를 넣은 폴더는 drawable 폴더이다
  • 안드로이드 버전이 변경되면서 mipmap 이라는 폴더를 제공하는데 이 폴더의 이미지는 비트맵이 아닌 벡터 방식으로 이미지를 그리게 된다.
  • mipmap 폴더의 이미지는 런처 아이콘용 이미지를 넣는 폴더로 사용한다.

ToggleButton

ToggleButton은 ON/OFF 상태를 설정할 수 있는 View 이다.

  • 환경설정 같은 화면에서 애플리케이션의 기능을ON/OFF 하는 기능을 제공하고자 할 때 사용한다.
  • 지금은 더 보기 좋은 View들이 생겨 많이 사용하지는 않는다.

ToggleButton의 주요 속성

  • textOn : ON 상태일 때 표시할 문자열을 설정한다.
  • textOff : OFF 상태일 때 표시할 문자열을 설정한다.

ToggleButon의 주요 프로퍼티

  • isChecked : ON/OFF 상태 여부 값을. ON 이면 true, OFF 면 false.

ToggleButon의 주요 메서드

  • toggle : 현재의 토글 상태를 반전시킨다.

ToggleButton의 주요 이벤트

  • click : Toggle 버튼을 클릭하면 발생하는 이벤트

CheckBox

  • CheckBox는 사용자에게 항목을 제공하고 항목 중에 다중으로 선택이 가능하도록 제공되는 View 이다.
  • 선택할 수 있는 항목 들을 제공하고 체크를 통해 선택할 수 있도록 하는 View
  • 다수의 CheckBox를 동시에 선택할 수 있다.

CheckBox의 주요 프로퍼티

  • isChecked : 체크 박스의 현제 체크 값

CheckBox의 주요 메서드

  • toggle : 현재 체크 상태를 반전시킨다.

CheckBox의 주요 이벤트

  • checkedChange : 체크 상태가 변경되는 사건

RadioButton

RadioButton은 같은 그룹 안에서 하나만 선택할 수 있도록 제공되는 View 이다.

RadioButton 의 주요 속성

  • text : RadioButton에 표시되는 문자열을 설정한다.
  • checked : 체크 상태를 설정한다. RadioButton은 그룹 내에서 반드시 하나는 선택되어 있는 상태로 제공되는 목적으로 사용하는 View 이므로 반드시 하나는 체크해야 한다.

RadioButton 의 주요 프로퍼티

  • isChecked : RadioButton 체크 상태 값. 체크 상태 설정 시 같은 그룹 내의 RadioButton은 모두 체크가 해제된 상태가 된다.

RadioGroup 의 주요 프로퍼티

  • checkedRadioButtonId : 그룹 내에서 선택되어 있는 RadioButton의 id

RadioGroup의 주요 이벤트

  • checkedChange : 그룹 내의 RadioButton의 체크 상태가 변경되었을 때

Switch

Switch 는 ON/OFF 상태를 설정할 수 있도록 제공되는 View 이다.

Switch의 주요 속성

  • text : Switch 좌측에 표시되는 문자열을 설정한다.
  • thumb : 버튼 부분의 이미지를 설정한다.
  • track : 트랙 부분의 이미지를 설정한다.
  • textOn : on 상태일 때 표시되는 문자열을 설정한다.
  • textOff : off 상태일 때 표시되는 문자열을 설정한다.
  • showText : textOn, textOff에 설정한 문자열을 보여줄 것인가를 설정한다.
  • checked : ON/OFF 상태를 설정한다.

Switch 의 주요 프로퍼티

  • isChecked : Switch의 ON/OFF 상태 값. 

Switch 의 주요 이벤트

  • checkedChange : Switch의 ON/OFF 상태가 변경되었을 때.

CheckedTextView

checkedTextView는 checkbox나 radioButton을 직접 구현할 수 있도록 제공하는 View 이다.

  • CheckBox, RadioButton 을 커스터마이징 할 수 있도록 제공되는 View 이다.

CheckedTextView의 주요 속성

  • checkMark : 체크 상태를 표시하는 아이콘을 설정한다.
  • checked : 체크 상태를 설정한다.
  • clickable : 클릭이 가능한지 설정한다. CheckedTextView는 CheckBox나 RadioButton이 가지고 있는 기능이 구현되어 있지 않다. 이 때문에 개발자가 기능을 모두 구현해줘야 하는데 clickable에 true를 설정해야 이벤트에 반응할 수 있고 이를 통해 리스너를 구현하여 기능을 구현해줘야 한다.

checkMark 방향

  • checkedTextView는 checkMark를 설정하면 우측에 표시된다.
  • checkMark 속성이 아닌 다음 속성을 이용하면 원하는 방향에 표시할 수 있다.
  • drawableTop : 상단
  • drawableBottom : 하단
  • drawableLeft : 좌측
  • drawableRigt : 우측

checkedTextView의 주요 프로퍼티

  • isChecked : 체크 상태

checkMark 주요 이벤트

  • click : 클릭했을 때 발생한다. checkedTextView는 이 이벤트를 반드시 설정해야 한다. checkedTextView는 checkbox나 radioButton이 가지고 있는 기능을 click 이벤트 발생 시 개발자가 모두 처리해줘야 한다.

Chip

Chip 은 버튼, ChecBox, RadioButton 대신 사용할 수 있도록 제공되는 UI 요소이다.

ChipGroup을 통해 RadioButton 처럼 구성할 수 있다.

Chip의 주요 속성

  • Theme : 테마를 설정한다. 반드시 설정해야 한다.
  • Style : Chip 의 스타일을 설정한다.
  • Checkable : 체크 가능 여부를 설정한다. 
  • Text : Chip에 표시할 문자열을 설정한다.
  • chipIcon : Chip에 표시할 아이콘을 설정한다.
  • chipIconVisiable : Chip 아이콘을 보여줄 것인가를 설정한다.
  • checkedIcon : 선택되었을 때의 아이콘을 설정한다.
  • checkedIconVisiable : 선택되었을 때의 아이콘을 보여줄 것인가를 설정한다.

Chip의 주요 프로퍼티

  • isChecked : 체크 상태 값을 관리한다.

Chip의 주요 이벤트

  • checkedChange : 체크 상태가 변경되었을 때
  • CloseIconClick : 닫기 버튼을 눌렀을 때

ChipGroup의 주요 속성

  • singleSelection : 내부의 Chip 중 하나만 선택되게 할 것인가를 설정
  • checkedChip : 최초에 선택되어 있을 Chip을 설정한다.

ChipGroup의 주요 프로퍼티

  • checkedChipId : 그룹 내에서 선택되어 있는 Chip의 id 값

ChipGroup의 주요 이벤트

  • CheckedChange : ChipGroup 내부의 Chip의 체크 상태가 변경되었을 때

ProgressBar

  • ProgressBar는 현재 진행 중이라는 것을 표시하거나 진행 상황을 표시하는 View 이다.
  • 오래 걸리는 작업이 있을 경우 작업 중임을 표시하는 View

ProgressBar의 주요 속성

  • style : ProgressBar의 모양을 설정한다.
  • max : 최대 값
  • progress : 현재 값

ProgressBar의 주요 프로퍼티

 

  • progress : 현재 값을 관리한다.

ProgressBar의 주요 메서드

  • incrementProgressBy : 지정한 값 만큼 증가 혹은 감소시킨다.

SeekBar

SeekBar 는 ProgressBar와 유사하지만 사용자가 직접 값을 설정할 수 있다.

ProgressBar와 매우 유사하지만 사용자가 값을 직접지정할 수 있는 기능을 갖추고 있다.

SeekBar의 주요 속성

  • style : SeekBar의 모양을 설정한다.
  • max : 최대 값
  • progress : 현재 값

SeekBar의 주요 프로퍼티

  • progress : 현재 값을 관리한다.

SeekBar의 주요 메서드

  • incrementProgressBy : 지정한 값 만큼 증가 혹은 감소시킨다.

SeekBar의 주요 이벤트

  • SeekBarChange : SeekBar의 상태가 변경되었을 때

RatringBar

RatingBar는 별 점을 설정할 수 있도록 제공되는 View 이다.

별 점을 조절할 수 있는 View이다.

RatingBar의 주요 속성

  • numStars : 별의 개수를 설정한다.
  • stepSize : 별 점이 조절되는 양을 설정한다.
  • rating : 현재 별 점을 설정한다.
  • isIndicator : 별 점을 사용자가 조절 할 수 있는지 설정한다. true를 설정하면 사용자는 별 점을 조절 할 수 없다.
  • style : 스타일을 설정한다.
  • progressDrawable : 별의 이미지를 설정한다.

RatingBar Customizing

  • 별이 있을 때 이미지와 없을 때의 이미지를 준비한다.
  • drawable 폴더에 xml 파일을 만들어 다음과 같이 작성한다.
<layer-list xmls:android="http://schemas.android.com/apk/res/android">
  <item
    android:id="andird:id/background"
    android:drawable="@drawable/star_off"/>
  <item
    android:id="andird:id/secondaryProgress"
    android:drawable="@drawable/star_off"/>
  <item
    android:id="andird:id/progress"
    android:drawable="@drawable/star"/>
</layer-list>

RatingBar 의 주요 프로퍼티

  • rating : 별 점을 관리한다.

RatingBar의 주요 이벤트

  • RatingBarChange : 별 점이 변경되었을 때

 

 

ScrollView

ScrollView는 상하 혹은 좌우로 스크롤 할 수 있도록 제공되는 View 이다.

ScrollView는 배치되어 있는 View가 화면을 벗어 날 경우 스크롤을 할 수 있도록 제공되는 View 이다.

ScrollView는 위 아래로 스크롤이 가능하며 HorizontalScrollView는 좌 우로 스크롤이 가능하다.

ScrollView와 HorizontalScrollView를 조합하면 상하 좌우 스크롤이 가능하다.

 

ScrollView의 주요 프로퍼티

  • scrollY : ScrollView에서 현재 스크롤 된 Y 좌표
  • scrollX : HorizontalView에서 현재 스크롤 된 X 좌표

ScrollView의 주요 메서드

  • scrollTo : 지정된 위치로 스크롤 한다. ScrollView에서는 Y 좌표를, HorizontalScrollView에서는 Y 좌표를 설정한다.

ScrollView의 주요 이벤트

  • ScrollChange : 스크롤되었을 때

 

CardView

CardView 는 View를 그룹으로 묶어 관리하며 공중에 떠있는 듯한 모습을 보여줄 수 있는 View 이다.

  • 화면에 배치되는 View 들을 그룹으로 묶어 관리할 수 있는 View 이다.
  • CardView 자체에 그림자를 두어 약간 공중에 떠있는 듯한 모습을 보여줄 수 있다.

CardView의 주요 속성

  • contentPadding : CardView 내부의 여백을 설정한다.
  • cardCornerRadius : CardView 모서리 부분의 둥근 정도를 설정한다.
  • cardElevation : CardView가 공중에 떠있는 정도를 설정한다.

 

 

 

 

 

 

 

 

참고

대부분의 내용은 인프런 윤재성 강사님의 코틀린기반 강의 part 1을 보고 작성했습니다.

mnd777.egloos.com/1047906

 

 

 

 

 

 
728x90
반응형

'Android > Android UI' 카테고리의 다른 글

[Appbar] - Toolbar  (0) 2021.12.31
View를 만드는 가장 기본적인 방법, LayoutInflater  (0) 2021.12.20
android custom ui  (0) 2021.08.24
[Android AdapterView] : ListView, RecyclerView  (0) 2021.04.29