[Android] IntelliJ #5 Spinner, DatePicker, TimePicker

현지·2022년 2월 7일
0

Spinner

  • 선택된 아이템을 textView에 출력한다.

res > layout > item_spinner.xml 파일을 추가한다.

  • textView로만 구성할 예정이기 때문에 textView만 추가한다.
<?xml version="1.0" encoding="utf-8"?>

<TextView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/tvItemSpinner"
android:layout_width="match_parent"
android:layout_height="45dp"
android:paddingTop="10dp"
android:paddingStart="30dp"
android:textColor="@android:color/white"
android:textSize="15sp"
android:paddingLeft="30dp"/>

activity_main.xml

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

    <Spinner
            android:layout_width="385dp"
            android:layout_height="81dp"
            android:id="@+id/spinner"
            android:layout_centerHorizontal="true"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintHorizontal_bias="0.502"
            app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintVertical_bias="0.54"/>
    <TextView
            android:layout_width="385dp"
            android:layout_height="81dp"
            android:text="Hello World!"
            android:textSize="30sp"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintTop_toTopOf="parent" app:layout_constraintVertical_bias="0.42"
            android:id="@+id/textView" app:layout_constraintHorizontal_bias="0.502"/>

</androidx.constraintlayout.widget.ConstraintLayout>

✅ MainActivity
#1. 직접 배열을 만들어서 adapter에 넣어준다.

package com.example.sample14

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.view.View
import android.widget.*

class MainActivity : AppCompatActivity() {

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

        setupspinnerFruit()
        setupSpinnerHandler()
    }

    //spinner에 값을 설정하는 함수
    fun setupspinnerFruit(){

        //#1 가장 많이 사용하는 방법
        val fruit = arrayOf("과일선택", "사과", "배", "바나나", "포도")

        //어뎁터에 배열과 xml을 적용한다
        val adapater = ArrayAdapter(this, R.layout.item_spinner, fruit)

        //spinner에 적용
        val spinner = findViewById<Spinner>(R.id.spinner)
        spinner.adapter = adapater
    }

    //선택시 결과를 출력해 주는 함수
    fun setupSpinnerHandler(){
        val spinner = findViewById<Spinner>(R.id.spinner)
        val textView = findViewById<TextView>(R.id.textView)

        spinner.onItemSelectedListener = object :AdapterView.OnItemSelectedListener{
            override fun onItemSelected(p0: AdapterView<*>?, view: View?, idx: Int, id: Long) {
                textView.text = "선택됨: $idx ${spinner.getItemAtPosition(idx)}"
            }

            override fun onNothingSelected(p0: AdapterView<*>?) {

            }
        }
    }
}

#2. res > values > array.xml을 추가한다.
=> 외부에서 값을 받아와서 사용할 수 없고 정해진 값만 사용할 수 있다.

package com.example.sample14

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.view.View
import android.widget.*

class MainActivity : AppCompatActivity() {

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

        setupspinnerFruit()
        setupSpinnerHandler()
    }

    //spinner에 값을 설정하는 함수
    fun setupspinnerFruit(){

        //#2 values > array 에 추가, 외부에서 값을 가져와서 사용할 수 없음
        val fruit = resources.getStringArray(R.array.fruit)

        //어뎁터에 배열과 xml을 적용한다
        val adapater = ArrayAdapter(this, R.layout.item_spinner, fruit)

        //spinner에 적용
        val spinner = findViewById<Spinner>(R.id.spinner)
        spinner.adapter = adapater
    }

    //선택시 결과를 출력해 주는 함수
    fun setupSpinnerHandler(){
        val spinner = findViewById<Spinner>(R.id.spinner)
        val textView = findViewById<TextView>(R.id.textView)

        spinner.onItemSelectedListener = object :AdapterView.OnItemSelectedListener{
            override fun onItemSelected(p0: AdapterView<*>?, view: View?, idx: Int, id: Long) {
                textView.text = "선택됨: $idx ${spinner.getItemAtPosition(idx)}"
            }

            override fun onNothingSelected(p0: AdapterView<*>?) {

            }
        }
    }
}
  • res > values > array.xml에 adapter에 넣을 값 생성
    (#2번인 경우에만 해당한다.)
<?xml version="1.0" encoding="utf-8"?>
<resources>
    <string-array name="fruit">
        <item>과일 선택</item>
        <item></item>
        <item>파인애플</item>
        <item>오렌지</item>
        <item>망고</item>
    </string-array>
</resources>

#3. binding by lazy 사용하기

package com.example.sample15

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.view.View
import android.widget.AdapterView
import android.widget.ArrayAdapter
import com.example.sample15.databinding.ActivityMainBinding

class MainActivity : AppCompatActivity() {

    val binding by lazy {ActivityMainBinding.inflate(layoutInflater)}

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(binding.root)

        var data = listOf("선택하세요", "1월", "2월", "3월", "4월", "5월", "6월")

        var adapter = ArrayAdapter<String>(this,R.layout.item_spinner, data)
        binding.spinner.adapter = adapter

        binding.spinner.onItemSelectedListener = object :AdapterView.OnItemSelectedListener{
            override fun onItemSelected(p0: AdapterView<*>?, p1: View?, idx: Int, p3: Long) {
                binding.result.text = data.get(idx)
            }
            override fun onNothingSelected(p0: AdapterView<*>?) {

            }
        }
    }
}
  • binding사용하려면 app > build.gradle에 추가하기
    buildFeatures{
        viewBinding true
    }

DatePicker

  • 날짜 불러오기 버튼을 누르면 달력에 선택된 날짜를 가져온다.

✅ activity_main.xml

  • android:datePickerMode는 spinner와 calendar두 종류가 있다.
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:context=".MainActivity">

    <TextView
            android:layout_width="371dp"
            android:layout_height="61dp"
            android:text="Hello World!"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintVertical_bias="0.115" app:layout_constraintHorizontal_bias="0.502"
            android:id="@+id/textView"/>
    <Button
            android:text="날짜 읽어오기"
            android:layout_width="174dp"
            android:layout_height="57dp" android:id="@+id/button"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintVertical_bias="0.225"/>

    <!--android:datePickerMode="spinner"-->
    <DatePicker
            android:id="@+id/datePicker"
            android:layout_width="320dp"
            android:layout_height="430dp"
            android:calendarViewShown="false"
            android:datePickerMode="calendar"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintVertical_bias="0.681"/>

</androidx.constraintlayout.widget.ConstraintLayout>

✅ MainActivity

package com.example.sample28

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.view.View
import android.widget.Button
import android.widget.DatePicker
import android.widget.TextView
import java.util.*

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

        var cal = Calendar.getInstance()
        val year = cal.get(Calendar.YEAR)
        val month = cal.get(Calendar.MONTH)
        val dayOfMonth = cal.get(Calendar.DAY_OF_MONTH)

        val textView = findViewById<View>(R.id.textView) as TextView
        val button = findViewById<View>(R.id.button) as Button

        textView.text =
            """
                초기 설정된 날짜 [년도/월/일]
                $year/${month+1}/$dayOfMonth
            """.trimIndent()
        button.setOnClickListener(this)
    }

    override fun onClick(view: View?) {
        val textView = findViewById<TextView>(R.id.textView)
        val datePicker = findViewById<DatePicker>(R.id.datePicker)

        if(view?.id == R.id.button){
            textView.text = "생성된 날짜 [년도/월/일] : \n" + datePicker.year.toString() + "/" +
                    "" + (datePicker.month + 1).toString() + "/" + datePicker.dayOfMonth.toString()
        }
    }
}

TimePicker

-시간을 변경하면 바로 textView에 적용된다.

✅ activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:context=".MainActivity">
    <TextView
            android:layout_width="275dp"
            android:layout_height="53dp"
            android:text="Hello World!"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintTop_toTopOf="parent" app:layout_constraintVertical_bias="0.102"
            app:layout_constraintHorizontal_bias="0.501" android:id="@+id/textView"/>

    <TimePicker
            android:id="@+id/timePicker"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:timePickerMode="clock"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent" app:layout_constraintTop_toBottomOf="@+id/textView"
            app:layout_constraintVertical_bias="0.185"/>

</androidx.constraintlayout.widget.ConstraintLayout>

✅ MainActivity

package com.example.sample29

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.widget.TextView
import android.widget.TimePicker
import java.util.*

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

        var cal = Calendar.getInstance()
        val hour = cal.get(Calendar.HOUR_OF_DAY)
        val minute = cal.get(Calendar.MINUTE)
        val second = cal.get(Calendar.SECOND)

        val textView = findViewById<TextView>(R.id.textView)
        val timePicker = findViewById<TimePicker>(R.id.timePicker)

        textView.text = "현재 설정된 시간 \n 시:분:초 | $hour:$minute:$second"

        timePicker.setOnTimeChangedListener(this)
    }

    override fun onTimeChanged(view: TimePicker?, hourOfDay: Int, minute: Int) {
        val textView = findViewById<TextView>(R.id.textView)

        textView.text = "설정된 시간 \n 시:분 | $hourOfDay:$minute"
    }
}

0개의 댓글