본문 바로가기

책 요약하기/코틀린을 활용한 안드로이드 프로그래밍

#6. 고급 위젯 다루기 2021-02-03

- 요약 -

1. 아날로그시계와 디지털시계는 화면에 시간을 표시하는 위젯으로서 시계를 표현하는 용도로 쓰인다. 크루노미터는 시간을 측정하는 타이머형식의 위젯입니다.

2. 타임피커(TimePicker)는 시간을, 데이트피커(Datepicker)와 캘린더뷰(CalendarView)는 날짜를 표시하고 조절합니다.

3. 캘린더뷰(CalendarView)의 연도는 1900부터 시작하고 월은 0부터 시작합니다.

4. 자동완성텍스트뷰와 멀티자동완성텍스트뷰는 사용자가 단어의 일부만 입력해도 자동으로 완성되는 에디트텍스트입니다.

5. 프로그레스바는 작업의 진행 상태를 바 또는 원 형태로 제공하고 주로 스레드와 함께 사용한다. 시크바는 프로그레스바와 대부분 비슷하며 사용자가 터치로 임의 조절이 가능하다. 레이팅바는 진행 상태가 별 모양으로 표시되는 위젯으로 서적, 음악, 영화 등에 대한 선호도를 나타낼 때 주로 사용합니다.

6. 스크롤뷰는 위젯이나 레이아웃이 화면에 넘칠 때 스크롤 효과를 낼 수 있다. 스크롤뷰에는 단 하나의 위젯만 넣을 수 있습니다.

7. 슬라이딩드로어는 서랍처럼 열어서 위젯을 보여주거나 닫아서 감춥니다.

8. 뷰플리퍼는 안에 여러 개의 위젯을 배치하고 필요에 따라 화면을 왼쪽 또는 오르쪽으로 밀어서 위젯을 하나씩 보여준다. Kotlin 코드와 함께 구현해야 한다.

9. 탭호스트는 여러 탭을 두고 각 탭을 클릭할 때마다 해당 화면이 나오도록 설정하는 뷰 컨테이너로, Kotlin 코드와 함께 구성된다. 허니콤부터 지원되는 액션바는 탭호스트와 동일한 화면을 만들기 위해 고안된 것으로, 롤리팝부터는 툴바 위젯으로도 구성할 수 있다.

10. 웹뷰는 사용자가 웹브라우저 기능을 앱 안에 직접 포함할 수 있는 위젯이다.

11. 부모 클래스의 메소드를 자동으로 오버라이딩하려면 클래스 안에 커서를 두고 Android Studio 메뉴의 [Code]-[Override Methods]를 선택합니다.

12. 프로젝트의 전반적인 환경 설정이나 퍼미션 등은 모두 AndroidManifest.xml에 지정한다. 인터넷을 허용하는 퍼미션은 다음과 같습니다.

<uses-permission android:name="android.permission.INTERNET" />

android:usesCleartextTraffic="true"

- 연습문제 -

1. 시간 및 날짜와 관련된 위젯을 모두 열거하시오.

Widget Name Content
android.widget.AnalogClock 화면에 시간을 표시하는 위젯으로서 아날로그 시계에 해당합니다.
android.widget.DigitalClock 화면에 시간을 표시하는 위젯으로서 디지털 시계에 해당합니다.
android.widget.Chronometer 타이머 형식의 위젯이며 일반적으로 시간을 측정할 때 많이 사용합니다.
android.widget.TimePicker 시간을 표시하고 조절하는 위젯입니다.
android.widget.DatePicker 날짜를 표시하고 조절하는 위젯입니다.
android.widget.CalenderView 날짜를 표시하고 조절하는 위젯입니다.

 

2. 크로노미터의 초기화, 시작, 중지에 사용하는 세 가지 메소드는 무엇인가?

Method Name Content
start() 타이머 시작
stop() 타이머 정지
reset() 타이머 초기화

 

3. 진행 상태를 표시하는 세 가지 위젯의 차이점을 간단히 설명하시오.

Widget Name Content
android.widget.ProgressBar 작업의 진행 상태를 바, 원 형태로 제공한다.
android.widget.SeekBar 프로그레스바의 하위 클래스로 프로그레스바와 비슷하며 사용자 터치로 임의 조정 가능합니다.
android.widget.RatingBar 별 모양으로 진행 상태를 표시합니다.

 

4. 위젯이 많아서 화면에 넘칠 때, ( 1 )에 넣으면 세로 스크롤 효과를 낼 수 있고 ( 2 )에 넣으면 가로 스크롤 효과를 낼 수 있다.

( 1 ) - ScrollView

( 2 ) - HorizontalScrollView

( ★ 스크롤 뷰는 반드시 단 하나의 위젯만 넣을 수 있다. )

 

5. 슬라이딩드로어를 만드는 다음 XML 코드를 완성하시오.

<SlidingDrawer
	android:content="@+id/mycontent"
    android:handle="@+id/myhandle">
    <Button
    	android:id= ( 1 )
        android:text="서랍 손잡이"/>
       
    <LinearLayout
    	android:id= ( 2 )>
        <TextView android:text="여기는 서랍 안입니다."/>
    </LinearLayout>
</SlidingDrawer>
       

( 1 ) - myhandle

( 2 ) - mycontent

 

6. 다음과 같이 슬라이딩드로어 안에 슬라이딩드로어가 들어가도록 프로젝트를 작성하시오.

 

[activity_main.xml]

1차 서랍을 만듭니다.
SlidingDrawer안에 리니어 레이아웃 하나와 슬라이딩 드로워(2차 서랍) 하나를 추가합니다.

 

새로 생성한 슬라이딩드로어(2차 서랍)안에 버튼과 리니어 레이아웃을 추가하고 마지막으로 추가한 리니어 레이아웃안에 텍스트뷰를 넣습니다.

 

7. [예제 6-21]에서 완성한 액션바를 변경하여 동물 선택 앱을 작성하시오. 단, 탭에 이미지가 나오게하고, [예제 6-20]의 11 ~ 16행 대신에 XML 파일을 인플레이트해서 사용한다.

4개의 프래그먼트 저장 배열 및 탭 변수
액션바 생성
탭 클릭 시 프래그먼트 생성 및 배열로 저장
문제의 코드

해당 코드는 액션바(탭)생성 및 탭 클릭 시 생성된 프래그먼트와 해당 프래그먼트에서 각각의 이미지를 보여주는 코드입니다. 

문제에서는 11 ~ 16행 코드 대신 XML파일을 인플레이트해서 사용하라고 했습니다.

var myView = inflater.inflate(R.layout.activity_main, null) 부분이 activity_main.xml파일을 인플레이트 한 것이고

아래 if 문들은 해당 탭 클릭 시 tabName에 해당하는 프레그먼트를 보여주는 부분입니다.

문제는 myView.setBackgroundResource(R.drawable.dog)처럼 drawable에 있는 이미지를 myView로 불러와서 return한다면 XML파일을 굳이 인플레이트 할 필요가 없다고 생각했습니다.

제 실력이 모자라서 ㅠㅠ  하단의 activity_main.xml 파일 처럼 프레임 레이아웃에 각각의 이미지뷰를 visible, invisible 하는 방식으로 이미지를 보여주게끔 하고 싶었는데 그 부분을 못하겠네요.... omg..

혹시 해결법 아신다면 댓글에 남겨주시면 정말로 감사하겠습니다!!!

 

 

[activity_main.xml]

 

이상 마치겠습니다. :))