[안드로이드 코틀린] 7. 위젯 - 텍스트뷰/에디트텍스트,버튼/컴파운드버튼/이미지버튼

들어가기 전..

[참고] XML

엘리먼트

- root element는 하나 이상의 child element를 가짐

- 각 child element도 하나 이상의 subchild element를 가질 수 있음

<root element>
    <child element>
        <subchild element>데이터</subchild element>
    </child element>
</element>

- 데이터가 없는 엘리먼트는 empty element라고 하며, <element></element>또는 <element/>로 표현함

- 엘리먼트는 여러 개의 속성을 지정할 수 있으며 각 속성은 속성명과 속성값으로 표현

<element 속성명="속성값">

 

주석문

- xml문서의 주석문은 다음과 같이 처리함

<!-- 주석문 -->

---

위젯

 

텍스트뷰

- View 클래스 바로 다음에 위치하며 다양한 위젯이 그 하위에 존재함

 

text 속성

- 텍스트뷰에 나타나는 문자열을 표현

- “문자열” 형식으로 값을 직접 입력하거나 “@string/변수명” 형식으로 지정한 후 strings.xml 파일에 지정할 수 있음

 

textColor 속성

- 글자의 색상을 지정

- background 속성처럼 값은 #RRGGBB나 #AARRGGBB 형식을 사용함

 

textSize 속성

- 글자의 크기를 dp, px, in, mm, sp 단위로 지정

- 텍스트가 입력되는 위젯(텍스트뷰, 에디트텍스트)은 주로 sp를 사용. sp(또는 sip)는 Scale-independent Pixels의 약자로 문자열 크기를 나타내기 위해 사용하는 단위

- (위젯에 영향을 주지않고 글자만 변경되므로 sp 사용 권장)

 

typeface 속성

- 글자의 글꼴을 지정

- 값으로 sans, serif, monospace를 설정할 수 있고 디폴트는 normal

 

textStyle 속성

- 글자의 스타일을 지정

- 값으로 bold, italic, bold|italic을 설정할 수 있고 디폴트는 normal

 

singleLine 속성

- 글이 길어 줄이 넘어갈 경우 강제로 한 줄까지만 출력하고 문자열의 맨 뒤에 ‘...’를 표시

- 값으로 true와 false를 설정할 수 있고 디폴트는 false

 

maxLines 속성

- 텍스트뷰에 최대 입력 가능한 줄 수를 설정

 

minLines 속성

- 반대로 최소 줄 수를 미리 설정

 

ellipsize 속성

- 텍스트뷰의 maxLines 속성이 1이거나 문자열이 길어서 글자가 잘릴 때에 설정

 

lines 속성

- 텍스트뷰 높이 고정하기

 

maxLength

- 텍스트 전체 길이 제한하기

- maxLength는 텍스트의 전체 길이를 제한, 설정한 값만큼의 글자만 보이고 나머지는 보이지 않게 함

    <TextView
        android:layout_height="wrap_content"
        android:ellipsize="end"
        android:lines="10"
        android:maxLength="10"
        android:maxLines="1"
        android:singleLine="false"
        android:text="TextView 텍스트뷰TextView 텍스트뷰TextView 텍스트뷰TextView 텍스트뷰TextView 텍스트뷰"
        android:textColor="#0000FF"
        android:textSize="30sp"
        android:textStyle="bold|italic"
        android:typeface="serif"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

 

많이 사용되는 View 클래스 또는 TextView 클래스의 XML 속성과 메소드

 

실습 (xml 코드 생략)

package com.example.textview

import android.graphics.Color
import android.graphics.Typeface
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.widget.TextView

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        var tv1: TextView
        var tv2: TextView
        var tv3: TextView

        tv1 = findViewById(R.id.textView1)
        tv2 = findViewById(R.id.textView2)
        tv3 = findViewById(R.id.textView3)

        tv1.setText("안녕하세요?")
        tv1.setTextColor(Color.RED)
        tv2.setTextSize(30.0f)
        tv2.setTypeface(Typeface.SERIF, Typeface.BOLD_ITALIC)
        tv3.text = "가나다라마바사아자차카타파하가나다라마바사아자차카타파하가나다라마바사아자차카타파하"
        tv3.setSingleLine()
    }
}

 

 

---

에디트텍스트, 버튼

- 사용자에게서 어떤 값을 입력받기 위한 가장 기본적인 위젯

- View와 TextView 클래스를 상속받음 ⇒ 거의 비슷하게 사용 가능

<TextView
	android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="텍스트뷰" />
    
<Button
	android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="버튼" />

[참고]

TextView https://developer.android.com/reference/kotlin/android/widget/TextView

EditText https://developer.android.com/reference/kotlin/android/widget/EditTextrs

Button https://developer.android.com/reference/kotlin/android/widget/Button

 

에디트텍스트

- 값을 입력받은 후 해당 값을 Kotlin 코드에서 가져와 사용하는 용도로 많이 쓰임

- 일반적인 에디트텍스트의 XML 코드

<EditText
    android:id="@+id/edittext1" />

 

hint 속성

- 클릭하면 사라지는 미리보기를 작성할 수 있음

 

inputType 속성

- inputType 속성에 입력되는 옵션에 따라 키보드의 모양이 바뀜

    - [number] : 숫자 형식

    - [numberPassword] : 숫자로만 구성된 비밀번호 입력

    - [phone] : 전화번호 형식

    - [date] : 날짜 형식

    - [textUri] : URI 형식의 문자 입력 

    - [textEmailAdress] : email 주소 형식의 문자 입력 

    - [textPassword]: 비밀번호 입력

    - [textVisiblePassword] : 비밀번호를 문자열 그대로 표시하기

 

버튼을 클릭했을 때 동작하는 Kotlin 코드를 세 단계로 작성

- 에디트텍스트 변수를 선언하고 이 변수에 해당 id 값을 넣은 후에 접근함

1. 에디트텍스트 변수 선언

    - var myEdit : EditText 

2. 변수에 에디트텍스트 위젯 대입

    - myEdit = findViewById(R.id.edittext)

3. 에디트텍스트에 입력된 값 가져오기 → 주로 버튼 클릭 이벤트 람다식 안에 넣음

    - var myStr : String = myEdit.getText().toString()

 

버튼

- 일반적인 버튼의 XML 코드

<Button
    android:id="@+id/button1"
    android:text="확인" />

 

버튼을 클릭했을 때 동작하는 Kotlin 코드를 세 단계로 작성

1. 버튼 변수 선언

    - var mybutton : Button

2. 변수에 버튼 위젯 대입

    - mybutton = findViewById(R.id.button1)

3. 버튼을 클릭할 때 동작하는 람다식 정의

    - mybutton.setOnClickListener { // 동작 내용을 이 부분에 }

→ 세 단계는 대부분의 위젯(라디오버튼, 이미지버튼, 체크박스, 토글버튼 등)에서 거의 동일하게 사용됨

 

실습1

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">

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

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="전화번호" />

        <EditText
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="000-0000-0000"
            android:inputType="phone" />

    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="right">

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="입력" />

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="취소" />

    </LinearLayout>

</LinearLayout>

 

 

실습2 - 초간단 계산기 앱 만들기

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <EditText
        android:id="@+id/Edit1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="10dp"
        android:hint="숫자1"/>

    <EditText
        android:id="@+id/Edit2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="10dp"
        android:hint="숫자2"/>

    <Button
        android:id="@+id/BtnAdd"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="10dp"
        android:text="더하기"/>

    <Button
        android:id="@+id/BtnSub"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="10dp"
        android:text="빼기"/>

    <Button
        android:id="@+id/BtnMul"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="10dp"
        android:text="곲하기"/>

    <Button
        android:id="@+id/BtnDiv"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="10dp"
        android:text="나누기"/>

    <TextView
        android:id="@+id/TextResult"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="10dp"
        android:textColor="#ff0000"
        android:textSize="30sp"
        android:text="계산 결과 : "/>

</LinearLayout>

 

package com.example.simplecalapp

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.widget.Button
import android.widget.EditText
import android.widget.TextView

class MainActivity : AppCompatActivity() {

    lateinit var edit1 : EditText
    lateinit var edit2 : EditText
    lateinit var btnAdd : Button
    lateinit var btnSub : Button
    lateinit var btnMul : Button
    lateinit var btnDiv : Button
    lateinit var textResult : TextView

    lateinit var num1 : String
    lateinit var num2 : String
    var result : Int? = null

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        title = "초간단 계산기"

        edit1 = findViewById(R.id.Edit1)
        edit2 = findViewById(R.id.Edit2)
        btnAdd = findViewById(R.id.BtnAdd)
        btnSub = findViewById(R.id.BtnSub)
        btnMul = findViewById(R.id.BtnMul)
        btnDiv = findViewById(R.id.BtnDiv)
        textResult = findViewById(R.id.TextResult)

        btnAdd.setOnTouchListener { v, event ->
            num1 = edit1.text.toString()
            num2 = edit2.text.toString()

            result = Integer.parseInt(num1) + Integer.parseInt(num2)
            textResult.text = "결과 계산 : " + result.toString()
            false
        }

        btnSub.setOnTouchListener { v, event ->
            num1 = edit1.text.toString()
            num2 = edit2.text.toString()

            result = Integer.parseInt(num1) - Integer.parseInt(num2)
            textResult.text = "결과 계산 : " + result.toString()
            false
        }

        btnMul.setOnTouchListener { v, event ->
            num1 = edit1.text.toString()
            num2 = edit2.text.toString()

            result = Integer.parseInt(num1) * Integer.parseInt(num2)
            textResult.text = "결과 계산 : " + result.toString()
            false
        }

        btnDiv.setOnTouchListener { v, event ->
            num1 = edit1.text.toString()
            num2 = edit2.text.toString()

            result = Integer.parseInt(num1) / Integer.parseInt(num2)
            textResult.text = "결과 계산 : " + result.toString()
            false
        }
    }
}

 

 

---

컴파운드버튼

CompoundButton 클래스 

- Button 클래스의 하위 클래스로 체크박스, 라디오버튼, 스위치, 토글버튼의 상위 클래스

- 이 네 가지는 공통적으로 체크 또는 언체크 상태가 될 수 있음 

    - 실제로 비슷한 형태를 띠지만 용도는 조금씩 다름

 

체크박스

- 체크박스는 클릭할 때마다 상태가 체크, 언체크로 바뀜

- 여러 개의 체크박스가 있어도 서로 독립적으로 동작한다는 특징이 있어 여러 개를 동시에 체크할 수 있음

 

체크와 언체크가 바뀌었을 때 Kotlin 코드의 처리 절차

1. 체크박스 변수 선언

    - var mycheck : CheckBox

2. 변수에 체크박스 위젯 대입

    - mycheck = findViewById(R.id.android) 

3. 체크박스가 변경될 때 동작하는 람다식 정의

    - mycheck.setOnCheckedChangeListener { compoundButton, b -> // 동작 내용을 이 부분에 코딩 }

 

실습 

[참고] 토스트

- 화면 하단부에 메시지를 잠시동안 보여주는 방식

- Toast.makeText(Context context, String message, int duration).show()

package com.example.checkbox

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.widget.CheckBox
import android.widget.CompoundButton
import android.widget.Toast

class MainActivity : AppCompatActivity() {

    lateinit var checkApple : CheckBox
    lateinit var checkOrange : CheckBox
    lateinit var checkBanana : CheckBox

    var listener = CompoundButton.OnCheckedChangeListener { buttonView, isChecked ->
        if(isChecked){
            when(buttonView.id)
            {
                R.id.checkApple -> Toast.makeText(applicationContext,"사과", Toast.LENGTH_SHORT).show()
                R.id.checkOrange -> Toast.makeText(applicationContext, "오렌지", Toast.LENGTH_SHORT).show()
                R.id.checkBanana -> Toast.makeText(applicationContext, "바나나", Toast.LENGTH_SHORT).show()
            }
        }
    }

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        checkApple = findViewById(R.id.checkApple)
        checkOrange = findViewById(R.id.checkOrange)
        checkBanana = findViewById(R.id.checkBanana)

        checkApple.setOnCheckedChangeListener(listener)
        checkOrange.setOnCheckedChangeListener(listener)
        checkBanana.setOnCheckedChangeListener(listener)

//        checkApple.setOnCheckedChangeListener { buttonView, isChecked ->
//            if(isChecked) {
//                Toast.makeText(applicationContext, "사과", Toast.LENGTH_SHORT).show()
//            }
//        }
//
//        checkOrange.setOnCheckedChangeListener { buttonView, isChecked ->
//            if(isChecked) {
//                Toast.makeText(applicationContext, "오렌지", Toast.LENGTH_SHORT).show()
//            }
//        }
//
//        checkBanana.setOnCheckedChangeListener { buttonView, isChecked ->
//            if(isChecked) {
//                Toast.makeText(applicationContext, "바나나", Toast.LENGTH_SHORT).show()
//            }
//        }
    }
}

 

 

스위치, 토글버튼

- 스위치와 토글버튼은 모양만 조금 다를 뿐 용도는 거의 동일함

- 스위치의 주 용도는 온/오프 상태 표시

    - XML 속성이나 관련 메소드는 모두 체크박스와 동일하게 사용 가능

    - checked 속성은 true와 false에 따라서 색상과 글자가 다르게 표현

 

라디오버튼, 라디오그룹

라디오버튼

- XML 속성이나 메소드가 체크박스와 거의 동일하지만 용도가 다름

- 여러 개 중 하나만 선택해야 하는 경우에 사용

    » 그러나 라디오버튼만 여러 개 나열하면 클릭하는 것마다 모두 중복 선택되므로 라디오그룹과 함께 사용해야 함

    » 각 라디오버튼의 id 속성이 꼭 있어야 함

        » id 속성이 없으면 해당 라디오버튼이 계속 선택된 것으로 지정되어 해제되지 않음

 

라디오그룹

- ViewGroup-LinearLayout의 하위 클래스로 존재함

- TextView 하위의 위젯들과는 성격이 조금 다름

- 라디오그룹에서 가끔 사용되는 메소드인 clearCheck()

    » 해당 라디오그룹 안에 체크된 것을 모두 해제함

 

실습

 

package com.example.radiogroup

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.widget.RadioButton
import android.widget.RadioGroup
import android.widget.Toast

class MainActivity : AppCompatActivity() {

    lateinit var radioGroup : RadioGroup
    lateinit var radioApple : RadioButton
    lateinit var radioOrange : RadioButton
    lateinit var radioBanana : RadioButton

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        radioGroup = findViewById(R.id.radioGroup)
        radioApple = findViewById(R.id.radioApple)
        radioOrange = findViewById(R.id.radioOrange)
        radioBanana = findViewById(R.id.radioBanana)

        radioGroup.setOnCheckedChangeListener { group, checkedId ->
            when(checkedId) {
                R.id.radioApple -> Toast.makeText(applicationContext, "사과", Toast.LENGTH_SHORT).show()
                R.id.radioOrange -> Toast.makeText(applicationContext, "오렌지", Toast.LENGTH_SHORT).show()
                R.id.radioBanana -> Toast.makeText(applicationContext, "바나나", Toast.LENGTH_SHORT).show()
            }
        }
    }
}

 

 

---

이미지버튼

이미지뷰

- 그림을 출력하는 위젯 

- 그림을 넣거나 화면을 화려하게 구성할 때 사용함

    - 이미지뷰에 보여줄 그림 파일은 일반적으로 프로젝트의 [res]-[drawable] 폴더에 있어야 함

    - 접근은 XML에서 “@drawable/그림 아이디” 형식으로 함

 

이미지뷰와 이미지버튼의 XML 속성

- src

    - 이미지의 경로를 나타냄

- maxHeight/maxWidth

    - 이미지의 크기를 지정함

- scaleType

    - 이미지의 확대/축소 방식을 지정 

    - scaleType의 속성: matrix, fitXY, fitStart, fitEnd, center 등 지정한 값에 따라 이미지를 확대/축소하는 방식이 결정됨

        - matrix: 실제 이미지를 좌측 상단부터 이미지버튼의 크기만큼 보여줌

        - fitXY: 상하좌우를 크기를 늘려서 맞춰서 보여줌

        - fitStart: 좌측 상단 부터 시작해 이미지 비율에 맞게 조정해서 위젯 안에 넣어줌

        - fitEnd: 우측 하단부터 시작해 이미지 비율에 맞게 조정해서 위젯 안에 넣어줌

        - cemter: 실제 이미지 사이즈 그대로 정중앙에 위치 시킴(위젯보다 이미지 클 경우 잘려 보일 수 있음)

 

이미지뷰와 이미지버튼의 XML 속성

- 사용하려는 그림 파일이 [res]-[drawable] 폴더에 있어야 함

- 파일 포맷

    - png, jpg, gif를 지원하지만 png나 jpg를 권장함

- [res]-[mipmap]

    - 같은 이름의 앱 아이콘 이미지(ic_launcher.png)가 디폴트로 들어 있음

    - 각각은 같은 이미지이지만 해상도가 mdpi(48×48), hdpi(72×72), xhdpi(96×96), xxhdpi(144×144), xxxhdpi(192× 192) 등으로 다름

    - XML 파일에서는 @mipmap/ic_launcher로, Kotlin 코드에서는 R.mipmap.ic_launcher로 사용됨

    - 이 앱 아이콘인 ic_launcher를 화면에 출력하면 안드로이드 운영체제가 현재 안드로이드폰의 해상도에 적절한 이미지를 알아서 선택함

 

예제

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal">
        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/q10" />

        <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/q10" />
    </LinearLayout>

    <ImageView
        android:layout_width="300dp"
        android:layout_height="80dp"
        android:background="#ffff00"
        android:src="@drawable/q10"
        android:scaleType="fitCenter" />

    <ImageView
        android:layout_width="300dp"
        android:layout_height="80dp"
        android:background="#ffff00"
        android:src="@drawable/q10"
        android:scaleType="fitXY" />

    <ImageView
        android:layout_width="300dp"
        android:layout_height="80dp"
        android:background="#ffff00"
        android:src="@drawable/q10"
        android:scaleType="fitStart" />

    <ImageView
        android:layout_width="300dp"
        android:layout_height="80dp"
        android:background="#ffff00"
        android:src="@drawable/q10"
        android:scaleType="fitEnd" />

    <ImageView
        android:layout_width="300dp"
        android:layout_height="80dp"
        android:background="#ffff00"
        android:src="@drawable/q10"
        android:scaleType="center" />

    <ImageView
        android:layout_width="300dp"
        android:layout_height="80dp"
        android:background="#ffff00"
        android:src="@drawable/q10"
        android:scaleType="matrix" />

</LinearLayout>

 

 

---

실습 - 반려동물 사진 보기 앱 만들기

액션바(Action bar)가 보이지 않는 경우 업네비게이션 실습 결과를 볼 수 없기때문에 themes.xml의 속성 중 <style name = "Base.Theme.ProjectBMICalculator" parent="Theme.Material3.Light.NoActionBar">의 NoActionBar를 지워줍니다. 

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:padding="20dp"
    tools:context=".MainActivity">

    <TextView
        android:id="@+id/Text1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="선택을 시작하시겠습니까?"
        android:textSize="20sp" />

    <CheckBox
        android:id="@+id/ChkAgree"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="시작함" />

    <TextView
        android:id="@+id/Text2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="좋아하는 반려동물은?"
        android:textSize="20sp"
        android:visibility="invisible" />

    <RadioGroup
        android:id="@+id/Rgroup1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:visibility="invisible">

        <RadioButton
            android:id="@+id/RdoDog"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="강아지" />

        <RadioButton
            android:id="@+id/RdoCat"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="고양이" />

        <RadioButton
            android:id="@+id/RdoRabbit"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="토끼" />

    </RadioGroup>

    <Button
        android:id="@+id/BtnOk"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="선택완료"
        android:visibility="invisible" />

    <ImageView
        android:id="@+id/ImgPet"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:visibility="invisible" />

</LinearLayout>

 

package com.example.petimageapp

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.widget.Button
import android.widget.CheckBox
import android.widget.ImageView
import android.widget.RadioButton
import android.widget.RadioGroup
import android.widget.TextView
import android.widget.Toast

class MainActivity : AppCompatActivity() {

    lateinit var text1 : TextView
    lateinit var text2 : TextView
    lateinit var chkAgree : CheckBox
    lateinit var rGroup1 : RadioGroup
    lateinit var rdoDog : RadioButton
    lateinit var rdoCat : RadioButton
    lateinit var rdoRabbit : RadioButton
    lateinit var btnOk : Button
    lateinit var imgPet : ImageView

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        title = "반려동물 사진 보기"

        text1 = findViewById(R.id.Text1)
        chkAgree = findViewById(R.id.ChkAgree)

        text2 = findViewById(R.id.Text2)
        rGroup1 = findViewById(R.id.Rgroup1)
        rdoDog = findViewById(R.id.RdoDog)
        rdoCat = findViewById(R.id.RdoCat)
        rdoRabbit = findViewById(R.id.RdoRabbit)

        btnOk = findViewById(R.id.BtnOk)
        imgPet = findViewById(R.id.ImgPet)

        chkAgree.setOnCheckedChangeListener { buttonView, isChecked ->
            if(chkAgree.isChecked == true) {
                text2.visibility = android.view.View.VISIBLE
                rGroup1.visibility = android.view.View.VISIBLE
                btnOk.visibility = android.view.View.VISIBLE
                imgPet.visibility = android.view.View.VISIBLE
            }
            else {
                text2.visibility = android.view.View.INVISIBLE
                rGroup1.visibility = android.view.View.INVISIBLE
                btnOk.visibility = android.view.View.INVISIBLE
                imgPet.visibility = android.view.View.INVISIBLE
            }
        }

        btnOk.setOnClickListener {
            when(rGroup1.checkedRadioButtonId) {
                R.id.RdoDog -> imgPet.setImageResource(R.drawable.dog)
                R.id.RdoCat -> imgPet.setImageResource(R.drawable.cat)
                R.id.RdoRabbit -> imgPet.setImageResource(R.drawable.rabbit)
                else -> Toast.makeText(applicationContext, "동물 먼저 선택하세요", Toast.LENGTH_SHORT).show()
            }
        }
    }
}