Notice
Recent Posts
Recent Comments
Link
«   2024/05   »
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31
Tags
more
Archives
Today
Total
관리 메뉴

Yunster's 개인 공부 공간

7. 안드로이드 뷰 컨테이너 살펴보기 본문

안드로이드-나의 첫 안드로이드

7. 안드로이드 뷰 컨테이너 살펴보기

yunster 2019. 3. 14. 10:58

1. 뷰 컨테이너 종류

- 뷰 컨테이너(ViewContainer)는 다양한 뷰들을 포함할 수 있는 위젯을 부르는 용어이다.

- 레이아웃은 위젯들을 다양하게 배치할 수 있게 해주는 반면, 뷰 컨테이너는 정해진 형태에서 여러 위젯들을 보여준다.

- 가장 많이 사용하는 뷰는 5가지 종류가 있다.


 ScrollView

 HorizontalScrollView

 RadioGroup

 CardView

 RecyclerView


2. ScrollView

- 스크롤뷰는 스크롤할 수 없는 뷰를 스크롤 가능하게 해주는 컨테이너이다.

- 예를 들어 이미지뷰의 이미지가 화면의 최대 높이보다 클 경우 사용자는 화면 전체를 볼 수 없는데, 스크롤뷰로 감싸주면 스크롤 하면서 전체를 볼 수 있다.

- 단, 스크롤뷰는 한 개의 뷰만을 포함할 수 있으므로 여러 개의 위젯을 넣고 싶으면 레이아웃으로 감싸줘야 한다.

- 아래는 스크롤 뷰의 샘플 코드이다.

<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent" android:layout_height="match_parent">

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">

<TextView
android:layout_width="match_parent"
android:layout_height="300dp"
android:gravity="center"
android:background="#FF0000"
android:text="RED" />

<TextView
android:layout_width="match_parent"
android:layout_height="300dp"
android:gravity="center"
android:background="#00FF00"
android:text="GREEN" />

<TextView
android:layout_width="match_parent"
android:layout_height="300dp"
android:gravity="center"
android:background="#0000FF"
android:text="BLUE" />
</LinearLayout>
</ScrollView>


3. HorizontalScrollView

- 수평 스크롤뷰는 수평 방향으로 스크롤할 수 있다는 것을 제외하고는 스크롤뷰와 거의 비슷하다.

- 아래는 수평 스크롤뷰의 샘플 코드이다.

<HorizontalScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent" android:layout_height="match_parent">

<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">

<TextView
android:layout_width="300dp"
android:layout_height="match_parent"
android:gravity="center"
android:background="#FF0000"
android:text="RED" />

<TextView
android:layout_width="300dp"
android:layout_height="match_parent"
android:gravity="center"
android:background="#00FF00"
android:text="GREEN" />

<TextView
android:layout_width="300dp"
android:layout_height="match_parent"
android:gravity="center"
android:background="#0000FF"
android:text="BLUE" />
</LinearLayout>
</HorizontalScrollView>


4. RadioGroup

- 라디오그룹은 여러 개의 라디오버튼을 묶어서 사용자가 그 중 하나만 선택할 수 있도록 해주는 컨테이너이다.

- 라디오 그룹 내의 라디오 버튼은 반드시 하나만 선택할 수 있고, 다중 선택은 불가능하다.

- 아래는 라디오그룹의 샘플 코드이다.

<RadioGroup
android:layout_width="wrap_content"
android:layout_height="wrap_content" >

<RadioButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Option 1" />

<RadioButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Option 2" />

<RadioButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Option 3" />

<RadioButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Option 4" />
</RadioGroup>


5. CardView

- 카드뷰는 내용을 카드 형태로 표현할 수 있는 뷰 컨테이너이다.

- 안드로이드 5.0(API 21)부터 도입되었다. 5.0 미만 버전에서 카드뷰를 사용하기 위해서는 다음과 지원 라이브러리를 추가해야 한다(혹은 액티비티 디자인 부분에서 Container에서 카드뷰를 찾아서 다운로드 버튼을 클릭해도 된다).

- implementation 'com.android.support:cardview-v7:27.1.1'

- 일반적으로 리사이클러뷰의 아이템을 표시하는 용도로 많이 사용된다.

- 아래는 카드뷰의 샘플 코드이다.

<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_margin="10dp"
card_view:cardBackgroundColor="@color/colorPrimary"
card_view:cardCornerRadius="8dp"
card_view:cardElevation="8dp"
card_view:contentPadding="10dp">

<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@android:color/darker_gray"
android:gravity="center"
android:text="TEXT" />
</android.support.v7.widget.CardView>

- 속성


 xmlns:card_view

 카드뷰의 속성을 사용하기 위해 선언하는 xml 네임스페이스이다.

 card_view:cardBackgroundColor

 카드뷰의 배경 색상을 지정한다.

 card_view:cardCornerRadius

 카드 모서리의 반지름을 지정한다.

 card_view:cardElevation

 카드 그림자를 표시한다.

 card_view:contentPadding

 내부 내용을 보여주기 위한 패딩이다.


6. RecyclerView

- 리사이클러뷰는 이미지나 텍스트를 리스트화해서 스크롤하면서 볼 수 있게 해주는 컨테이너이다.

- 기존에 사용하던 ListView나 GridView에 성능 문제가 있었고, 커스터마이징도 불편했기 때문에 새로 도입되었다. 리사이클러뷰를 사용하면 다양한 형태의 뷰를 쉽게 구성할 수 있다.

- 안드로이드 5.0(API 21)부터 도입되었다. 5.0 미만 버전에서 리사이클러뷰를 사용하기 위해서는 다음과 지원 라이브러리를 추가해야 한다(혹은 액티비티 디자인 부분에서 Container에서 리사이클러뷰를 찾아서 다운로드 버튼을 클릭해도 된다).

- implementation 'com.android.support:recyclerview-v7:27.1.1'

- 리사이클러뷰를 이해하려면 아래와 같은 구조를 이해해야 합니다.



1) LayoutManager

- 리사이클러뷰의 형태를 결정하는 레이아웃 관리자를 말한다. 

- LinearLayoutManager, GridLayoutManager, StaggeredGridLayoutManager가 있다. 만약 다른 형태를 원한다면 직접 만들어서 사용해야 한다.


 LinearLayoutManager

 리니어 레이아웃과 동일한 형태를 가진다.

 옵션에 따라 vertical/horizontal 형태를 바꿀 수 있다.

 GridLayoutManager

 그리드뷰와 유사한 형태를 가진다.

 격자 형태를 가지며, 한 줄에 몇 개의 아이템을 배치할 지를 지정할 수 있다.

 StaggeredGridLayoutManager

 Staggered는 '엇갈린', '비틀거리는'이란 뜻이다.

 아이템을 엇박자로 배치한다.

 배치되는 이미지의 높이가 서로 다른 경우에 자주 쓰인다.


2) Adapter

- 데이터셋과 레이아웃 매니저를 연동해주는 역할을 한다.

- 데이터셋의 데이터를 레이아웃에 어떻게 배치할지를 결정하는 클래스이다.

3) DataSet

- 레이아웃에 보여줄 데이터를 의미한다.

- 데이터는 인터넷에 접속해서 가지고 온 데이터일 수도 있고, 안드로이드 기기에 저장되어 있는 이미지가 될 수도 있다.

- 어떤 데이터든 집합 형태로 저장되어 있어야 한다. 집합 형태는 ArrayList나 Vector 또는 배열 등을 의미한다.



[출처] 한동호, '나의 첫 안드로이드 : 처음 시작하는 개발자를 위한', 한빛미디어, 2018

Comments