#4. 기본 위젯 익히기 2021-01-28

- 요약 - 

1. 위젯은 넓은 의미로 View 클래스 하위의 모든 클래스를 지칭하고, 좁은 의미로 버튼, 텍스트뷰, 체크박스, 라디오박스 등 눈에 보이는 요소를 지칭합니다. 그리고 위젯을 지정 하여 놓을 수 있는 틀을 레이아웃이라고 합니다.

2. 해당 쳅터에서 사용한 위젯의 View클래스 계층도는 다음과 같습니다.

(화살표는 상속 관계를 뜻하며 -> 아래방향으로 위방향의 클래스를 상속한다는 의미입니다. 또한 빨간색 상자 TextView는 같은 클래스이며 이 클래스를 EditText와 Button클래스가 상속한다는 의미입니다. 그리고 CompoundButton은 Button클래스를 상속하며 각각 widget 요소들(체크박스, 토글버튼, 스위치, 라디오박스)은 CompoundButton을 상속합니다.)

3. View 클래스의 주요한 XML 속성으로는 id, layout_width, layout_height, background, padding, layout_margin, visibility, enable, clickable, rotation 등이 있습니다.

4. 텍스트뷰의 주요한 XML 속성으로는 text, textColor, textSize, typeface, textStyle, singleLine 등이 있습니다.

5. XML 속성은 Kotlin 코드로 설정할 수 있다. 예를 들어 background 속성은 setBackgroundColor() 메소드에서 설정할 수 있습니다.

6. 버튼은 Object -> View -> TextView -> Button의 상속 관계를 갖는다. 그러므로 View와 TextView의 XML 속성 및 메소드를 대부분 동일하게 사용할 수 있습니다.

7. 버튼의 Kotlin 코드는 다음의 세 단계를 거쳐 작성합니다.

1. 버튼 변수 선언 => var testBtn : Button
2. 변수에 버튼 위젯 대입 => testBtn = findViewById<Button>(R.id.Btn1)
3. 버튼을 클릭할 때 동작하는 람다식 정의 => testBtn.setOnClickListener { // 동작 코드 작성 }

8. EditText의 입력값을 가져오는 코드는 다음과 같습니다..

var myStr : String = myEdit.text.toString()

9. 이미지뷰와 이미지버튼의 XML 속성으로는 이미지의 경로를 나타내는 src, 이미지의 크기를 지정하는 macHeight/maxWidth, 이미지의 확대/축소 방식을 지정하는 scaleType 등이 있습니다.

10. 컴파운드버튼(CompoundButton)의 하위 클래스는 체크박스(CheckBox), 라디오버튼(RadioButton), 스위치(Switch), 토글버튼(ToggleButton)입니다.

11. 체크박스의 Kotlin코드는 다음의 세 단계를 거쳐 작성합니다.

1. 체크박스 변수 선언 => var myCheck : CheckBox
2. 변수에 체크박스 위젯 대입 => myCheck = findViewMyId(R.id.ChkBox)
3. 체크박스가 변경될 때 동작하는 람다식 정의 => myCheck.setOnCheckedChangeListener { compoundButton, b -> //동작 내용 작성 }

12. 라디오버튼은 보통 라디오그룹 안에 여러 개를 포함하여 사용합니다.

13. 이미지를 사용하려면 그림 파일을 [res]-[drawable]폴더에 미리 복사해놓아야 합니다.

 

- 연습문제 -

1. 레이아웃의 종류를 나열하고 계층도를 그리시오.

레이아웃 종류 : (LinearLayout, GridLayout, FrameLayout, RelativeLayout, TableLayout)

ViewGroup <- (LinearLayout, RelativeLayout, FrameLayout, GridLayout, AdapterView, ToolBar)

    LinearLayout <- (TableLayout, RadioGroup)

    FrameLayout <- TabHost

    AdapterView <- (AbsListView, AbsSpinner)

        AbsListView <- (ListView, GridView)

       AbsSpinner <- (Gallary, Spinner)

 

2. layout_width, layout_height 속성값으로 match_parent를 사용하려면 안드로이드 버전이 얼마 이상이어야 하는가?

답 : Android 2.2 이상이어야 한다. Android 2.1이하 버전에서 사용 시 fill_parent를 사용해야 한다.

 

3. 텍스트뷰의 XML속성 및 각 속성과 관련된 메소드를 표로 정리하시오. (책에서 사용된 속성 및 메소드)

TextView XML 속성	속성과 관련된 메소드
textColor	setTextColor()
textSize	setTextSize()
textStyle	setTextStyle()
typeface	setTypeface
text	setText
singleLine	setSingleLine()

(더많은 XML속성 및 메소드 참조 : developer.android.com/reference/kotlin/android/widget/TextView)

 

4. 버튼에 클릭과 터치 외에 어떤 이벤트가 가능한지 2개 이상을 조사하고, 요약의 7번처럼 사용법의 예를 제시하시오.

1. 버튼 변수 선언 => var testBtn : Button
2. 변수에 버튼 위젯 대입 => testBtn = findViewById<Button>(R.id.Btn1)
3. 버튼을 클릭할 때 동작하는 람다식 정의 => testBtn.setOnClickListener { // 동작 코드 작성 }
4.  

 

5. 안드로이드에서 색상을 지정하는 속성값은 #RRGGBB로 설정한다. 이에 대응하는 android.graphics.Color 클래스의 상수 필드를 조사하시오. (예를 들어 0xffff0000은 RED에 대응된다.)

COLOR	constant field	COLOR	constant field
BLACK	0xff000000	GREEN	0xff00ff00
BLUE	0xff0000ff	LTGRAY	0xffcccccc
CYAN	0xff00ffff	MAGENTA	0xffff00ff
DKGRAY	0xff444444	RED	0xffff0000
GRAY	0xff888888	TRANSPARENT	0x00000000
WHITE	0xffffffff	YELLOW	0xffffff00

 

6. 다음 그림은 리니어레이아웃에 버튼 2개가 들어 있는 상태이다. 그림과 같이 여백을 설정하기 위해 리니어레이아웃과 버튼 1에 각각 1개씩의 XML 속성 및 값을 설정하시오.

 

7. 체크박스를 선택할 때마다 버튼의 속성이 설정되도록 프로젝트를 작성하시오.

<activity_main.xml 파일>

<MainActivity.kt 파일>

전역변수 선언(체크박스 3개, 버튼 1개)

체크박스 및 버튼 위젯 대입

체크박스 on/off 전환시 각각 이벤트 발생

 

8. 에디트텍스트의 키가 눌릴 때마다 바뀐 글자가 토스트 메시지로 나오도록 프로젝트를 작성하시오.

<activity_main.xml 파일>

EditText widget 생성

<MainActivity.kt 파일>

setOnKeyListener() 이벤트리스너 사용

(setOnKeyListener() 참고 : developer.android.com/reference/android/view/View.OnKeyListener)

 

9. 버튼에도 이미지를 넣을 수 있다. 다음과 같이 버튼을 클릭하면 이미지가 10도씩 회전하도록 프로젝트를 작성하시오.

<activity_main.xml 파일>

<MainActivity.kt 파일>

 

이상 마치겠습니다!