Beautify.log

블로그 이전

Wed, 16 Feb 2022 07:01:46 GMT

티스토리로 이전합니다

이 블로그도 계속 사용합니다.

https://beautify-log.tistory.com

Android : Sqlite

Thu, 10 Feb 2022 22:38:40 GMT

개요

웹에서의 DB

웹에서는 클라이언트(화면단)가 서버에 어떤 정보를 달라고 요청할 때, 서버는 데이터베이스로부터 그 정보를 꺼내서 클라이언트로 보내줍니다.

Spring으로 예를 들면 DAO를 통해 DB에 접근하게 되는데 이 때 중간다리 역할로 MyBatis 같은 도구를 사용합니다.

이는 클라이언트, 서버, DB가 각각 독립된 환경임을 가정했을 때 성립할 수 있습니다.

안드로이드의 DB

물론 안드로이드에서도 독립된 DB로부터 데이터를 받아와서 화면단에 표현해 줄 수 있습니다.

그렇지만 굳이 외부에 있는 DB에 접근해서 정보를 가져올 필요가 없을 때, 다시 말해서 내부적으로만 데이터 교환이 이루어지는 경우가 있다고 가정한다면 외부에서 데이터를 가져오는 것은 다소 비효율적일 수 있습니다.

그래서 기기 내부에서만 사용할 수 있는 DB 시스템을 제공하는데, 안드로이드에서는 이 서비스를 Sqlite라는 이름으로 제공합니다.

Sqlite 사용하기

DBHelper 작성하기

우선 DBHelper가 필요합니다. 이는 클래스이며 다음과 같이 작성합니다.

class DBHelper(context: Context?, 
               name: String?, 
               factory: SQLiteDatabase.CursorFactory?, 
               version: Int)
              : SQLiteOpenHelper(context, name, factory, version)

이 클래스는 멤버변수로 context, name, factory, version을 갖고 SQLiteOpenHelper 클래스를 상속 받습니다.

내부에는 기본적으로 onCreate와 onUpgrade가 오버라이드 되어야 합니다.

class DBHelper(context: Context?, 
               name: String?, 
               factory: SQLiteDatabase.CursorFactory?, 
               version: Int)
              : SQLiteOpenHelper(context, name, factory, version) {
    override fun onCreate(db: SQLiteDatabase?) {
        // 테이블 생성
        var sql : String = " CREATE TABLE IF NOT EXISTS TEST( " +
                           "    SEQ INTEGER PRIMARY KEY AUTOINCREMENT, " +
                           "    TXT TEXT) "

        db?.execSQL(sql)
    }

    override fun onUpgrade(db: SQLiteDatabase?, oldVersion: Int, newVersion: Int) {
        var sql : String = " DROP TABLE IF EXISTS TEST "
        db?.execSQL(sql)
        onCreate(db)
    }
}

내부에는 SQL 쿼리문이 들어가며 execSQL을 통해 쿼리문을 실행시켜줍니다.

CRUD를 구성하여 보았습니다.

import android.annotation.SuppressLint
import android.content.Context
import android.database.sqlite.SQLiteDatabase
import android.database.sqlite.SQLiteOpenHelper

class DBHelper(context: Context?, name: String?, factory: SQLiteDatabase.CursorFactory?, version: Int)
              : SQLiteOpenHelper(context, name, factory, version) {

    override fun onCreate(db: SQLiteDatabase?) {
        // 테이블 생성
        var sql : String = " CREATE TABLE IF NOT EXISTS TEST( " +
                           "    SEQ INTEGER PRIMARY KEY AUTOINCREMENT, " +
                           "    TXT TEXT) "

        db?.execSQL(sql)
    }

    override fun onUpgrade(db: SQLiteDatabase?, oldVersion: Int, newVersion: Int) {
        var sql : String = " DROP TABLE IF EXISTS TEST "
        db?.execSQL(sql)
        onCreate(db)
    }

    // CRUD
    fun insert(db:SQLiteDatabase, txt:String) {
        val sql = " INSERT INTO TEST(TXT) " +
                  " VALUES('${txt}') "
        db.execSQL(sql)
    }

    @SuppressLint("Range")
    fun read(db:SQLiteDatabase, txt: String) : String? {
        val sql = " SELECT TXT FROM TEST " +
                  " WHERE TXT = '$txt' "

        var res = db.rawQuery(sql, null)

        var str:String? = ""
        while(res.moveToNext()) {
            str += res.getString(res.getColumnIndex("SEQ")) + " " + "" + res.getString(res.getColumnIndex("TXT"))
        }

        return str
    }

    fun update(db:SQLiteDatabase, txt:String, wantToEdit:String) {
        val sql = " UPDATE TEST " +
                  " SET TXT = '$wantToEdit'" +
                  " WHERE TXT = '$txt' "
        db.execSQL(sql)
    }

    fun delete(db:SQLiteDatabase, txt:String) {
        val sql = " DELETE FROM TEST " +
                  " WHERE TXT = '$txt' "
        db.execSQL(sql)
    }
}

MainActivity에서 CRUD 사용

package com.example.sample36

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

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

        // db에 넣어주기
        var dbHelper = DBHelper(this, "testdb.db", null, 1)

        val insertBtn = findViewById

Android : 장면 전환 시 데이터 주고받기

Thu, 10 Feb 2022 21:51:12 GMT

개요

접근

예를 들어서 어떤 화면에서 값을 입력받아 버튼을 누르면 다른 화면으로 이동해서 컨텐츠를 보여줘야 하는 경우가 있습니다.

Fragment를 사용하지 않고 아예 다른 화면으로 넘어가서 이전 화면에서 입력받은 정보를 불러와 처리해야 한다면 가장 기본적으로 DB에 입력받은 데이터를 저장하고 다른 화면에서 DB에 들어간 정보를 다시 불러와서 처리해주는 방식을 떠올릴 수 있을 것입니다.

그러나 간단한 숫자나 문자열 등을 DB에 저장해서 다시 이를 불러오는 작업은 그렇게 효율적이라는 생각은 들지 않는 것 같습니다.

Spring에서 Model이라는 객체를 사용하여 addAttribute로 전달해줄 값을 설정해주고 이를 불러올 곳에서 getAttribute로 값을 불러와 사용했습니다.

마찬가지로 안드로이드에서는 getSharedPreferences를 사용할 수 있습니다. 그러나 getSharedPreferences는 기본 자료형의 형태만 전달할 수 있다는 단점이 있습니다.

다시 말해서 object 형태는 전달해 줄 수 없다는 뜻인데, object를 전달해주기 위해서 Parcelable를 사용할 수 있습니다.

또는 값을 서로 전달하여 받는 방식 이외에 싱글턴이라는 공동 공유공간을 만들어서 값을 끌어올 수도 있습니다.

그러면 지금부터 각각을 어떻게 사용할 수 있는지 살펴보겠습니다.

`getSharedPreferences`

메인 레이아웃 구성

장면 전환을 위해 레이아웃을 두개 만들 것입니다. 우선 메인 레이아웃을 다음과 같이 구성하였습니다

서브 레이아웃 구성

`MainActivity`

레이아웃을 구성하였으니 이제 버튼을 클릭했을 때 다음 화면으로 넘겨줄 정보를 입력받고 다음화면으로 넘겨서 그 정보를 가져와 보겠습니다.

메인 화면에서는 두개의 버튼을 준비했습니다. 넘겨줄 정보를 저장해주고 다음 페이지로 넘기는 작업을 해보겠습니다.

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

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

        val write = findViewById

우선 컴포넌트들을 아이디 값으로 불러옵니다.

        write.setOnClickListener {
            val pref = getSharedPreferences("pref", MODE_PRIVATE)
            val editor = pref.edit()        // 초기화
            editor.putString("myData", edit.text.toString())
            editor.apply()
            edit.setText("")
        }

변수 write로 지정된 버튼을 클릭했을 때 이벤트 리스너입니다.

pref 변수에는 getSharedPreferences를 넣어주었습니다. 이 넘겨줄 정보의 이름이 "pref"이며 MODE_PRIVATE로 지정하여 새로운 값을 넣어줄 때마다 덮어쓰기 하게 해주었습니다.

editor 변수에는 pref를 초기화 하기 위한 것이 들어있습니다.

putString을 통해 "myData"라는 이름으로 사용자 입력 컴포넌트에 있는 값을 문자열로 넣어줍니다.

apply()를 통해 적용해주고 작업이 완료되면 빈칸으로 세팅합니다.

        move.setOnClickListener {
            val i = Intent(this, SecondActivity::class.java)
            startActivity(i)
        }

    }
}

다음 페이지로 이동하는 버튼을 눌렀을 때 SecondActivity로 넘겨줍니다.

Activity는 앱 안의 단일 화면을 나타냅니다. Activity의 새 인스턴스를 시작하려면 Intent를 startActivity()로 전달하면 됩니다. Intent는 시작할 액티비티를 설명하고 모든 필수 데이터를 담습니다. - 안드로이드 개발자 문서

다시 말해서 Intent를 통해 이 페이지에서 다른 페이지로 넘겨줄 것임을 명시해주고 startActivity로 전달하여 다음 페이지로 이동하게 해주었습니다.

`Parcelable`

메인 화면 레이아웃 구성

Parcelable을 살펴보기 위해 메인 레이아웃과 서브 레이아웃을 만들어주겠습니다.

서브 레이아웃 구성

DTO 구성

object 전달 연습을 위해 DTO를 하나 만들어주겠습니다.

package dto

import android.os.Parcel
import android.os.Parcelable

class Student(var name: String?, var count:Int, var level: String?) : Parcelable {

    constructor(parcel: Parcel):this(parcel.readString(), parcel.readInt(), parcel.readString()) {}


    override fun writeToParcel(parcel: Parcel?, p1: Int) {
        parcel?.writeString(name)
        parcel?.writeInt(count)
        parcel?.writeString(level)
    }

    override fun describeContents(): Int {
        return 0
    }

    companion object CREATOR : Parcelable.Creator {
        override fun createFromParcel(parcel: Parcel): Student {
            return Student(parcel)
        }

        override fun newArray(size: Int): Array {
            return arrayOfNulls(size)
        }
    }


}

우리는 장면 전환 시 객체를 전달해줄 것이기 때문에 전달해줄 형태의 객체는 Parcelable을 상속받아야 합니다.

Parcelable을 상속받았기 때문에 writeToParcel과 describeContents의 오버라이드가 필요합니다.

또한 companion object의 형태로 CREATOR가 구현되어야 합니다.

MainActivity

역시 버튼 클릭시 이벤트를 발생시켜보겠습니다.

import android.content.Intent
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.widget.Button
import android.widget.EditText
import dto.Student

// preference는 기본자료형만 보낼 수 있어서...
// intent를 사용하면 객체를 전달해줄 수 있다!
class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        val editName = findViewById(R.id.editName)
        val editCount = findViewById(R.id.editCount)
        val editLevel = findViewById(R.id.editLevel)

        val move = findViewById

버튼을 클릭했을 때 객체를 생성하여 생성에 필요한 것들을 넣어주었습니다.

그리고 다음 페이지로 넘어가기 위해 Intent를 사용하였습니다.

이 때 putExtra를 사용하여 "student"라는 이름으로 student 변수에 저장된 객체를 넘겨줍니다.

SubActivity

메인 페이지에서 다음 화면으로 넘어왔을 때 처리해 줄 것들입니다.

import android.annotation.SuppressLint
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.widget.Button
import android.widget.TextView
import dto.Student

class SecondActivity : AppCompatActivity() {
    @SuppressLint("SetTextI18n")
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_second)

        val textView = findViewById(R.id.textView)

        val read = findViewById

read 버튼 클릭 시 getParcelableExtra로 메인 화면에서 전달해 준 "student"를 받아옵니다.

null이 아닌 경우 텍스트뷰에 받아온 정보를 뿌려줍니다.

`Singleton`

싱글톤은 전역변수를 선언하지 않더라도 싱글톤 객체 하나만을 생성하여 어디서든 참조할 수 있게 해줍니다.

메인 레이아웃

화면 이동간 싱글톤을 통해 메인 레이아웃에서 입력한 텍스트를 서브 레이아웃에서 받아올 것입니다.

서브 레이아웃

싱글톤 생성

class Singleton {

    companion object {

        var chicken:String? = null
    }
}

싱글톤은 반드시 companion object가 선언되어야 합니다.

이 싱글톤 객체는 어디서든 참조할 수 있게 됩니다. 초기값을 null로 지정하였습니다.

MainActivity

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

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

        val editText = findViewById(R.id.editText)
        val move = findViewById

싱글톤을 호출할 때는 Singleton.으로 할 수 있으며 내부에 선언된 변수를 붙여주면 됩니다.

SubActivity

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

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

        val textView = findViewById(R.id.textView)

        textView.text = Singleton.chicken.toString()
    }
}

싱글톤에 있는 정보를 가져올 때도 Singleton.으로 불러올 수 있습니다.

Android : JSON 파일 파싱하기

Thu, 10 Feb 2022 11:19:40 GMT

개요

JSON이란?

JSON은 JavaScript Object Notation의 약자로 자바스크립트의 객체 문법을 사용해 데이터를 전달하거나 받기 위해 사용하는 것입니다.

"키 - 값"의 구조로 되어 있으며 RESTful API로 데이터를 전송하는데 큰 역할을 합니다.

JSON 파일 Parsing

JSON 파일 준비

main 디렉터리 하위에 assets 디렉터리를 만들어줍니다.

[
  {
    "id": "kotlin",
    "language": "코틀린"
  },
  {
    "id": "java",
    "language": "자바"
  },
  {
    "id": "swift",
    "language": "스위프트"
  }
]

JSON 파일 읽어오기

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.util.Log
import android.widget.TextView
import org.json.JSONArray

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

        // JSON 파일에 접근해서 문자열을 가져와보자!
        val jsonString = assets.open("data.json").reader().readText()
        Log.d("JSON STR", jsonString)

우선은 문자열을 가져오는 방법입니다. assets 디렉터리로 접근해서 open을 사용하여 파일을 열어줍니다. 이것을 reader로 읽어주는데 이 때 텍스트형식으로 읽어오라는 것입니다.

        // JSON 파일에 접근해서 배열 형식으로 가져와보자!
        val jsonArray = JSONArray(jsonString)
        Log.d("json str", jsonArray.toString())

JSONArray를 사용하면 배열 형식으로 가져올 수도 있습니다.

        // JSON 파일에 접근해서 key값으로 value를 뽑아보자!

        val textView = findViewById(R.id.textView)

        for (i in 0 until jsonArray.length()) {
            val jsonObject = jsonArray.getJSONObject(i)

            textView.append("\n--------------------------\n")     // 경계선

            val id = jsonObject.getString("id")
            val language = jsonObject.getString("language")

            textView.append(
                """
                    $id
                """.trimIndent()
            )

            textView.append(
                """
                    $language
                """.trimIndent()
            )


        }
    }
}

마지막으로 key 값을 가지로 value를 얻어서 텍스트뷰에 뿌려주겠습니다.

위에서 만든 배열을 돌며 값을 꺼내와보겠습니다.

jsonArray 즉 배열로 만들어진 것을 가지고 getJSONObject()를 사용해주었습니다.

getJSONObject()를 사용하면 index에 대한 value 값을 리턴해줍니다.

이 때 index를 key라고 생각하면 이해하는데 도움이 될 것 같습니다.

이는 객체상태이므로 문자열을 얻어와서 텍스트뷰에 뿌리기 위해서는 getString 메서드가 필요합니다.

Android: 파일 입출력

Thu, 10 Feb 2022 11:08:24 GMT

개요

파일 입출력이란?

파일 입출력은 말 그대로 디바이스에 파일로 저장하고 그 파일을 뷰에 출력해주는 일련의 과정을 말합니다.

파일 입출력 구현을 위한 레이아웃

레이아웃

우선 화면단에서 파일 입출력을 보여주기 위해 레이아웃을 만들어줍니다.

버튼 클릭 시 파일 읽고 쓰기, 뷰에 출력

코드를 뜯어가며 하나씩 살펴보겠습니다.

import android.os.Bundle
import android.provider.ContactsContract.Intents.Insert.NOTES
import android.view.View
import android.widget.Button
import android.widget.EditText
import android.widget.Toast
import androidx.appcompat.app.AppCompatActivity
import java.io.*
import java.lang.Exception

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

        val read = findViewById

우선은 뷰에 있는 버튼 세개를 가져옵니다. 각각의 버튼은 클릭 이벤트 리스너가 걸립니다.

    override fun onClick(view: View?) {
        val edit = findViewById(R.id.editText)

        if(view?.id == R.id.read) {
            var reader:BufferedReader? = null

            try {
                val `in`: InputStream? = openFileInput(NOTES)

                if (`in` != null) {
                    reader = BufferedReader(InputStreamReader(`in`))
                    var str: String?
                    val buf = StringBuffer()

                    // 파일 읽기
                    while (reader.readLine().also { str = it } != null) {
                        println("$str")
                        buf.append("""$str""")  // 실제로 값을 읽는 위치
                    }

                    edit.setText(buf.toString())
                }
            } catch (e:FileNotFoundException) {
                // e.printStackTrace()
                println(e.message)
                println("파일을 찾을 수 없음")
            } catch (e:Exception) {
                e.printStackTrace()
                Toast.makeText(this, "exception: $e", Toast.LENGTH_SHORT).show()
            } finally {
                if(reader != null)
                    try { reader.close() }
                    catch (e:Exception) { e.printStackTrace() }
            }

메인 클래스가 View.OnClickListener를 상속받으므로 onClick 함수가 구현되어야 합니다.

view를 매개변수로 받아서 이 변수의 아이디가 위에서 선언한 버튼인 경우에 대해 조건식을 세워줍니다.

우선 읽기입니다.

BufferedReader를 준비해줍니다. 그 다음으로 InputStream을 `in`으로 잡아주었습니다. 백틱을 붙여준 이유는 예약어를 변수명으로 사용하기 위함입니다.

InputStream은 입력된 데이터를 빨아들이는 것으로 보면 됩니다.

이 때 파일을 스트림으로 읽기 위해 openFileInput을 사용하였습니다. NOTES는 파일 이름입니다.

읽어들인 파일이 null이 아닐 때 BufferedReader로 파일을 읽어주고 읽은 내용을 저장할 변수 str을 준비합니다.

그리고 문자열의 추가/변경을 위해 StringBuffer도 준비해줍니다.

줄단위로 문장을 읽으면서 str에 while루프를 돌며 문장을 추가해주는데, 이것이 null이 아닐 때, 즉 문장이 입력 되어있을 때

StringBuffer에 값을 추가해줍니다.

저장된 값을 텍스트입력창에 뿌려줍니다.

기본적으로 파일 입출력은 예외발생 사항이 있을 수 있기 때문에 try catch 처리를 해주는 것이 좋습니다.

        } else if (view?.id == R.id.write) {
            var out:OutputStreamWriter? = null

            try {
                // MODE_PRIVATE : 덮어쓰기, MODE_APPEND : 이어쓰기
                out = OutputStreamWriter(openFileOutput(NOTES, MODE_PRIVATE))
                out.write(edit.text.toString())     // 실제로 값을 써줌

                Toast.makeText(this, "데이터 저장", Toast.LENGTH_SHORT).show()
            } catch (e:Exception) {
                e.printStackTrace()
            } finally {
                if (out != null) try {
                    out.close()
                } catch (e:IOException) { e.printStackTrace() }
            }

        } else if (view?.id == R.id.clear) {
            edit.setText("")
        }
    }
}

write 버튼을 눌렀을 때 처리할 작업입니다. 스트림으로 파일을 써내려갈 OutputStreamWriter를 준비해줍니다.

그리고 파일을 읽어서 써주기 위해 openFileOutput을 사용하고 매개변수로 파일 이름과 MODE_PRIVATE이라는 덮어쓰기 기능을 넣어줍니다.

데이터가 저장되었다면 토스트를 띄워 데이터 저장에 성공했음을 알려줍니다.

Android : DatePicker와 TimePicker

Wed, 09 Feb 2022 22:53:01 GMT

DatePicker

개요

날짜를 선택할 수 있게 해주는 컴포넌트 입니다.

html에서

type 속성이 date인 태그는

이와 같이 날짜를 선택할 수 있게 해줍니다.

안드로이드에서는 위와 같이 달력에서 날짜를 선택하게 해주는 calendar 형식과 목록에서 직접 날짜를 선택할 수 있게 해주는 spinner 형식을 제공합니다.

`calendar` 타입의 DatePicker

calendar 타입의 DatePicker는 아래와 같이 달력형식에서 날짜를 선택할 수 있게 해줍니다.

코드를 보면

datePickerMode가 calendar로 설정되어있음을 알 수 있습니다!

`spinner` 타입의 DatePicker

DatePicker를 스피너 타입으로 주었을 때는 스피너를 통해 사용자가 직접 날짜를 입력할 수 있게 해줍니다.

이렇게 스피너로부터 날짜를 입력받을 수 있습니다.

이 때는

이와 같이 android:datePickerMode를 spinner로 주면 됩니다.

값 얻어오기

DatePicker의 타입이 캘린더 타입이든 스피너 타입이든 값을 얻어오는 방법은 동일합니다.

Calendar라는 객체를 생성하고 거기에서 getInstance라는 메서드를 통해 값을 얻어옵니다.

다음과 같이 뷰가 구성되어 있다고 할 때

값을 얻어오고 버튼을 통해 텍스트뷰에 값을 넘겨줘보겠습니다.

import android.annotation.SuppressLint
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 {
    @SuppressLint("SetTextI18n")
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

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

우선 초기값으로 오늘 날짜를 보여주기 위해 Calendar 객체의 getInstance 메서드를 통해서 값을 얻어옵니다. 이 때, 연월일은 각각 Calendar.YEAR, Calendar.MONTH, Calendar.DAY_OF_MONTH라고 하는 값을 전달해서 get으로 얻어옵니다.

        val textView = findViewById(R.id.textView)
        val button = findViewById

텍스트뷰와 버튼을 아이디로 가져온 후 텍스트뷰의 초기값을 오늘 날짜로 지정해줍니다.

메인 클래스에서 View.OnClickListener의 상속을 받았으므로 setOnClickListener로 버튼 클릭시 발생하는 이벤트를 지정해줍니다.

    @SuppressLint("SetTextI18n")
    override fun onClick(view: View?) {
        val textView = findViewById(R.id.textView)
        val datePicker = findViewById(R.id.datePicker)

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

onClick 함수를 오버라이드 해주었습니다.

파라미터로 받아온 뷰(버튼)이 클릭되었을 때 텍스트뷰를 사용자가 지정한 날짜로 바꿔줍니다.

TimePicker

개요

시간을 선택할 수 있게 해주는 컴포넌트입니다.

마찬가지로 html에서는

의 타입을 time으로 주면 시간을 입력받을 수 있습니다.

안드로이드에서는 DatePicker와 마찬가지로 스피너를 제공하며 시계UI에서 시간을 입력받기 위해서는 모드를 clock으로 주면 됩니다.

`clock` 타입의 TimePicker

시계 모양의 UI를 통해 시간값을 입력하게 할 수 있습니다.

코드를 보면

timePickerMode가 clock으로 설정되어 있습니다.

`spinner` 타입의 TimePicker

DatePicker와 마찬가지로 목록에서 직접 시간을 선택할 수 있게 해주는 spinner 타입도 제공합니다.

코드에서 timePickerMode를 spinner로 바꿔주면

이렇게 스피너에서 값을 입력받을 수 있습니다.

값 얻어오기

DatePicker에서 값을 얻어오는 방법과 유사합니다.

주의사항은 이벤트 리스너를 사용할 때 TimePicker 값의 변화를 실시간으로 조회하길 원한다면 TimePicker.OnTimeChangedListener를 상속받아야 한다는 것입니다.

여기서는 버튼클릭에 대한 이벤트가 아닌 값이 바뀔 때마다 조회해서 텍스트뷰에 뿌려주는 연습을 해보겠습니다.

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)

텍스트뷰의 초기값(현재시간) 설정을 위해 현재시간을 가져와 보겠습니다.

Calendar 객체의 getInstance 메서드를 받아옵니다.

각각 시, 분을 get 메서드로 얻어오는데 매개변수로 각각 Calendar.HOUR_OF_DAY, Calendar.MINUTE을 사용했습니다.

        val textView = findViewById(R.id.textView)
        val timePicker = findViewById(R.id.timePicker)

        textView.text = "현재 설정된 시간 : \n 시:분 | $hour : $minute"
        timePicker.setOnTimeChangedListener(this)
    }

텍스트뷰와 타임피커를 아이디로 가져오고 초기값을 우선 현재 시간으로 지정해줍니다.

그다음 타임피커의 값이 바뀔 때마다 그 값을 조회해서 텍스트뷰에 뿌려주기 위해 타임피커에 이벤트 리스너를 지정해줍니다.

    override fun onTimeChanged(view: TimePicker?, hourOfDay: Int, minute: Int) {
        val textView = findViewById(R.id.textView)
        textView.text = "현재 설정된 시간 : \n 시:분 | $hourOfDay : $minute"
    }
}

타임피커의 값이 바뀔 때마다 텍스트뷰에 값을 뿌려줄 함수를 오버라이드하여 구현합니다.

TimePicker에서는 원래 "초"단위를 입력받을 수 없습니다. UI에서 보면 아시겠지만 초를 입력하는 곳은 없습니다.

그래서 초를 얻어오기 위해서는 별도의 변수를 선언해서 초를 얻어와야 합니다.

오버라이드한 함수에 단위까지 출력하게 해주기 위해서는 val second:Int = Calendar.SECOND를 별도로 선언해서 텍스트뷰에 집어넣어주면 됩니다.

Android: ImageButton

Mon, 07 Feb 2022 14:02:30 GMT

개요

Android: SeekBar와 RatingBar

Mon, 07 Feb 2022 13:30:51 GMT

`SeekBar`

개요

A SeekBar is an extension of ProgressBar that adds a draggable thumb. The user can touch the thumb and drag left or right to set the current progress level or use the arrow keys. Placing focusable widgets to the left or right of a SeekBar is discouraged. - 안드로이드 개발자 문서

SeekBar는 손가락을 왼쪽이나 오른쪽으로 드래그해서 진행상황 등을 나타낼 수 있는 도구입니다.

이런 모양으로 생겼죠..

HTML에서는 에서 range타입을 주어 비슷한 것을 만들 수 있었습니다.

이 포스팅에서는 SeekBar의 움직임에 따라 텍스트뷰에 숫자가 반영되도록 만들어보겠습니다.

대략 이런 형태가 될 것입니다.

`activity_main.xml`에 넣어주기

우선 바의 움직임에 따라 텍스트뷰에 숫자를 쏴서 보여주기 위해 텍스트뷰도 함께 넣어주겠습니다.

`MainActivity` 설정해주기

레이아웃을 잡아주었다면 이제 bar를 움직일 때 텍스트뷰에 변화를 줘보겠습니다.

import android.os.Build
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.view.View
import android.widget.SeekBar
import android.widget.TextView
import androidx.annotation.RequiresApi

class MainActivity : AppCompatActivity() {

    @RequiresApi(Build.VERSION_CODES.O)     // 버전차이 때문에 seekBar.min 사용 할 수 없어서 추가
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        val seekBar = findViewById(R.id.seekBar)
        val textView = findViewById(R.id.textView) as TextView

        seekBar.min = 1
        seekBar.max = 1000

우선 seekBar와 textView를 findViewById로 불러와줍니다.

그리고 seekBar의 최대, 최소값을 지정합니다. 이 때 최소값을 나타내는 min은 현재 사용중인 버전에서 호환되지 않는다고 하여 상단에 어노테이션(@RequiresApi(Build.VERSION_CODES.O))을 붙여줬습니다.

        seekBar.setOnSeekBarChangeListener(object:SeekBar.OnSeekBarChangeListener{
            override fun onProgressChanged(p0: SeekBar?, progress: Int, p2: Boolean) {
                textView.text = "$progress"
            }

            override fun onStartTrackingTouch(p0: SeekBar?) {

            }

            override fun onStopTrackingTouch(p0: SeekBar?) {

            }
        })

    }
}

그리고 seekBar의 상태변화를 감지하는 이벤트 리스너인 setOnSeekBarChangeListener를 사용합니다. 이 때 SeekBar.OnSeekBarChangeListener 인터페이스를 상속받는 object는 세개의 퍼블릭 메서드를 오버라이드 받아야합니다.

각각의 메서드는 다음과 같이 정의됩니다.

`RatingBar`

개요

RatingBar 별점을 매길 때 흔히 사용합니다.

별을 손으로 탭하면 .5 단위로 숫자가 올라갑니다. 이를 텍스트뷰에 반영시키는 것을 구현해보겠습니다.

`activity_main.xml`에 `RatingBar` 넣어주기

앞에서 언급한 것처럼 RatingBar의 결과를 텍스트뷰에 표시해줄 것입니다.

`MainActivity`에서 텍스트뷰에 별점 반영하게 하기

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

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

        val ratingBar = findViewById(R.id.ratingBar)
        val textView = findViewById(R.id.textView) as TextView

마찬가지로 RatingBar와 TextView를 findViewById로 불러옵니다.

        ratingBar.setOnRatingBarChangeListener { ratingBar, rating, fromUser ->
            textView.text = "$rating"
        }
    }
}

setOnRatingBarChangeListener로 RatingBar의 변화를 감지합니다.

각각의 파라미터는 다음과 같이 정의됩니다.

Android : Fragment

Mon, 07 Feb 2022 13:19:47 GMT

Fragment란?

웹에서 SPA라는 개념을 들어보셨을겁니다. Single Page Application의 약자인데, 페이지가 이동할 때마다 새로운 페이지를 불러오지 않고 현재의 페이지를 동적으로 다시 작성하는 기술을 말합니다.

Fragment도 이와 유사합니다. 단어의 의미는 조각이라는 뜻이지요.

예를 들어 상단에 버튼 세개가 그 아래에 뷰가 있다고 가정할 때, 누르는 버튼에 따라 각각 다른 페이지를 보여주는 것입니다.

우리가 자주 사용하는 카카오톡, 인스타그램 등 다양한 애플리케이션이 프레그먼트를 지원합니다.

그럼 우선 상단에 버튼을 주고 버튼의 조작에 따라 다른 뷰를 보여주는 앱을 구성해보겠습니다.

상단에 버튼을 주고 조작에 따라 다른 뷰 표시하기

`Button` 메뉴 만들어주기

우선 layout 디렉터리에 activity_fragment_menu.xml을 만들어주고 아래와 같이 버튼 세개를 작성해줍니다. 이 때 레이아웃은 LinearLayout임에 주의합시다.

각 뷰에 보여 줄 페이지 작성하기

버튼을 조작할 때마다 뷰에 보여줄 컴포넌트를 작성합니다. 버튼이 세개 있으므로 세개의 컴포넌트를 만들어주어야 합니다.

각각의 파일명은 activity_fragment_one처럼 뒤에 숫자가 영어로 붙는 방식으로 해주겠습니다.

`activity_fragment_one.xml`

`activity_fragment_two.xml`

`activity_fragment_three.xml`

`activity_main.xml`에서 `FrameLayout` 지정하기

버튼의 조작에 따라 다른 페이지를 보여줄 뷰를 설정해야 합니다. 이를 FrameLayout으로 지정할 것입니다.

그리고 상단에 위에서 만든 버튼 세개를 넣어주기 위해 를 추가해주었습니다.

이 때 의 속성에서 android:name에는 클래스를 기반으로 각 메뉴가 앱 초기화 시점에서 생성될 수 있도록 해줄 코틀린 패키지가 들어갑니다.

Kotlin 패키지 파일 작성

버튼을 앱 초기화시 생성해주기 위해 필요합니다.

`FragmentMenu`

import android.os.Bundle
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import androidx.fragment.app.Fragment

class FragmentMenu : Fragment() {
    override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? {

        return inflater.inflate(R.layout.activity_fragment_menu, container, false)
    }
}

이 함수는 MainActivity의 onCreate와 유사합니다. activity_fragment_menu.xml에서 만든 버튼 세개를 뷰로 생성해주는 것입니다.

각각의 파라미터는 다음과 같습니다.

파라미터	정의
`inflater`	프레그먼트의 모든 뷰를 확장시킬 수 있는 `LayoutInflater` 객체
`container`	프레그먼트의 UI를 연결할 상위 view
`savedInstanceState`	`null`이 아닌 경우 프레그먼트는 이전에 저장된 상태에서 재생성됨.

FragmentOne ~ FragmentThree

각각은 별도의 파일이며 Fragment를 상속받아 만들어줍니다.

class FragmentOne : Fragment() {
    override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? {
        return inflater.inflate(R.layout.activity_fragment_fragment1, container, false)
    }
}

class FragmentTwo : Fragment() {
    override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? {
        return inflater.inflate(R.layout.activity_fragment_fragment2, container, false)
    }
}

class FragmentThree : Fragment() {
    override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? {
        return inflater.inflate(R.layout.activity_fragment_fragment3, container, false)
    }
}

`MainActivity`

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.util.Log
import android.view.View
import androidx.fragment.app.Fragment

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

        val fm = supportFragmentManager
        val fragmentTransaction = fm.beginTransaction()
        fragmentTransaction.add(R.id.content, FragmentOne())
        fragmentTransaction.commit()
    }

여기에서 supportFragmentManager를 사용합니다.

FragmentManager는 앱 프래그먼트에서 작업을 추가, 삭제 또는 교체하고 백 스택에 추가하는 등의 작업을 실행하는 클래스입니다.

여기에서 supportFragmentManager는 FragmentManager에 접근하기 위한 도구입니다. 프래그먼트의 모든 요소를 제어할 수 있습니다.

beginTransaction()을 통해 트랜젝션하여 프래그먼트를 편집할 것임을 알려줍니다.

여기에 add를 사용하여 텍스트뷰로 작성한 내용을 FragmentOne이라는 객체에 넣어 앱을 처음 실행했을 때 보여줄 것입니다.

    // fragment_menu에서 사용할 onClick 멤버구현
    override fun onClick(v: View?) {
        Log.d("button", "clicked")

        var fr:Fragment? = null

        if(v?.id == R.id.button1) {
            fr = FragmentOne()
        } else if (v?.id == R.id.button2) {
            fr = FragmentTwo()
        } else if (v?.id == R.id.button3) {
            fr = FragmentThree()
        }

        val fm = supportFragmentManager
        val fragmentTransaction = fm.beginTransaction()

        // fragment 교체
        fragmentTransaction.replace(R.id.content, fr!!)
        fragmentTransaction.commit()
    }
}

각 뷰에는 onClick이 적용되어 있습니다. 이 함수는 View.OnClickListener를 클래스에 상속시켜주어야 멤버함수로 오버라이드하여 구현할 수 있습니다.

프래그먼트를 변수 fr로 잡아주고 버튼의 아이디에 따라 보여줄 뷰(fr)를 지정해줍니다.

replace 메서드로 fr 값에 따라 어떤 컨텐츠를 보여줄 지 선언해주고 커밋합니다.

`navBar`로 `Fragment` 사용하기

이제부터 사용할 것은 navBar라는 개념입니다. 많은 애플리케이션에서 하단에 navBar를 위치시켜 사용자의 편의성을 도모하고 있습니다.

하단 navBar를 만들어서 Fragment를 적용해보겠습니다.

의존성 추가

우선 navBar를 사용하기 위해 의존성을 추가해줘야 합니다.

app 디렉터리에 있는 gradle.build를 열고 다음과 같이 추가해줍니다.

plugins {
    // navBar 사용하기 위해 플러그인 추가
    id 'kotlin-android-extensions'
}

...

dependencies {
    // navBar 사용하기 위해 의존성 추가
    implementation 'com.google.android.material:material:1.4.0'
}

`navBar` 구성 만들어주기

navBar에는 이전 예시와 마찬가지로 세개의 메뉴를 넣어줄 것입니다.

여기에서 icon은 다음과 같이 만들어줍니다.

res 디렉터리의 drawable 디렉터리에서 새로 만들기 -> Image Asset을 클릭해줍니다.

아이콘 타입을 Launcher Icons(Adaptive and Legacy)로 하고 아래 Asset Type을 Clip Art로 잡아준 다음 Clip Art에서 사용하자 하는 아이콘을 선택합니다.

이 때 상단의 Name을 알맞게 바꿔줍니다.

그 다음 창에서 완료를 누르면 drawable 디렉터리에 새로운 xml 파일들이 생겨납니다.

우리는 foreground로 되어있는 것을 사용할 것이므로 navBar 아이템을 담당하는 xml 파일의 icon은 foreground로 지정해줍니다.

`activity_main.xml`에 `FrameLayout`과 `navBar` 만들어주기

네비게이션 메뉴 조작에 따라 다른 화면을 보여줄 것이기 때문에 상단메뉴 예시와 마찬가지로 뷰와 네비게이션바를 만들어줍니다. layout 디렉터리에 들어갑니다.

BottomNavigationView의 app:menu 속성을 앞에서 우리가 만들어준 bottom_navi_menu로 지정해줍니다.

메뉴 선택 시 보여줄 View 만들기

Layout 디렉터리에 메뉴 선택시 보여 줄 View를 만들어주겠습니다.

각 메뉴를 클래스로 생성하기

이전 예시에서는 onCreateView 메서드를 오버라이드하여 사용했지만 여기서는 조금 다른 방법으로 시도합니다.

바로 뷰에 보여줄 각 xml 파일을 Fragment 클래스의 생성자로 사용하는 방법입니다.

마찬가지로 각각의 파일입니다.

import androidx.fragment.app.Fragment
class FragmentOne : Fragment(R.layout.activity_fragment_one) {}

import androidx.fragment.app.Fragment
class FragmentTwo : Fragment(R.layout.activity_fragment_two) {}

import androidx.fragment.app.Fragment
class FragmentThree : Fragment(R.layout.activity_fragment_three) {}

`MainActivity`에서 연결하기

이제 완성된 것들을 연결시켜주겠습니다.

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import androidx.fragment.app.Fragment
import kotlinx.android.synthetic.main.activity_main.*

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

        val firstFragment = FragmentOne()
        val secondFragment = FragmentTwo()
        val thirdFragment = FragmentThree()

메뉴를 누를 때마다 보여줄 바뀔 페이지 객체를 생성합니다.

        // 가장 처음 보여주는 화면
        setCurrentFragment(firstFragment)

        bottomNaviView.setOnNavigationItemSelectedListener {
            when (it.itemId) {
                R.id.person -> setCurrentFragment(firstFragment)
                R.id.home -> setCurrentFragment(secondFragment)
                R.id.setting -> setCurrentFragment(thirdFragment)
            }
            true
        }

    }

setCurrentFragment은 가장 처음 보여줄 화면을 설정합니다. 아래에 별도로 작성되어 있습니다.

bottomNaviView는 activity_main.xml에서 만들어준 네비게이션바가 들어가는 공간입니다. 이 자리에 ItemSelectedListener로 뷰에 대해 장면전환을 할 수 있도록 해줍니다. 이 때, menuItem으로 it가 들어갑니다.

true는 setOnNavigationItemSelectedListener가 동작하게 해줍니다.

    fun setCurrentFragment(fragment:Fragment) = supportFragmentManager.beginTransaction().apply {
        replace(R.id.flFragment, fragment)
        commit()
    }
}

setCurrentFragment 함수는 장면전환을 도와주는 함수입니다. fragment를 매개변수로 받아서 flFragment 즉 프레임 레이아웃을 매개변수로 받은 fragment로 변환해주고 커밋해주는 함수입니다.

Android: VideoView와 WebView

Mon, 07 Feb 2022 11:39:33 GMT

VedioView

개요

비디오뷰는 비디오컨텐츠를 보여주기 위한 컴포넌트입니다.

Displays a video file. The VideoView class can load images from various sources (such as resources or content providers), takes care of computing its measurement from the video so that it can be used in any layout manager, and provides various display options such as scaling and tinting. - 안드로이드 개발자 문서

우리는 소유한 영상을 화면에 표기해주는 간단한 예제 정도만 보겠습니다.

사용 예시

`activity_main.xml`

MainActivity

res 디렉터리에 raw 디렉터리를 만들고 영상을 넣어줍니다.

비디오뷰를 아이디로 불러옵니다.

import android.net.Uri
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.view.View
import android.widget.MediaController
import android.widget.VideoView

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

        val videoView = findViewById(R.id.videoView) as VideoView

setMediaController 메서드는 미디어 컨트롤러(뒤로, 재생, 일시정지 등)을 설정해주기 위한 메서드입니다.

내부에 MediaController를 이 객체에서 사용할 것이기 때문에 this로 잡아줍니다.

그리고 비디오 파일의 URI를 설정해줍니다. 이 때 parse를 사용해 경로를 가져옵니다.

        // 미디어 컨트롤러
        videoView.setMediaController(MediaController(this))
        videoView.setVideoURI(Uri.parse("android.resource://" + packageName + "/" + R.raw.snow))
    }
}

WebView

개요

웹에서 이라는 태그가 있습니다. 웹 문서 전체를 통째로 페이지에 보여줄 수 있는 태그입니다.

안드로이드에서는 이와 비슷한 역할을 하는 WebView라는 태그가 있습니다.

어떻게 사용하는지 살펴보겠습니다.

사용 예시

`activity_main.xml`에 `WebView` 만들어주기

`MainActivity`에서 특정 웹페이지 url로 불러오기

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.view.View
import android.webkit.WebChromeClient
import android.webkit.WebView

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

        val webView = findViewById(R.id.webView) as WebView

        // url
        webView.loadUrl("https://m.naver.com")
    }
}

`MainActivity`에서 html로 페이지 삽입하기

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.view.View
import android.webkit.WebChromeClient
import android.webkit.WebView

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

        val webView = findViewById(R.id.webView) as WebView

        // html
        val html = "Hello World! 안녕하세요!"
        webView.loadData(html, "text/html", "UTF-8")
    }
}

`MainActivity`에서 html 문서 넣기

`src`의 `main` 디렉터리 내부에 `assets` 디렉터리 만들기

이와 같은 형태로 디렉터리를 만들어줍니다. 폴더에 반드시 노란줄 네개가 그어져 있어야합니다.

인텔리제이에서 지원해주기 때문에 잘 잡힐겁니다.

`html` 문서 호출하기

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.view.View
import android.webkit.WebChromeClient
import android.webkit.WebView

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

        val webView = findViewById(R.id.webView) as WebView

        // html 문서 호출
        webView.loadUrl("file:///android_assets/hello.html")
        webView.settings.javaScriptEnabled = true
        webView.webChromeClient = WebChromeClient()
    }
}

Android: ScrollView와 GridView

Mon, 07 Feb 2022 11:00:08 GMT

ScrollView

개요

어떤 컨텐츠를 화면에 표시할 때 화면보다 컨텐츠가 큰 경우 컨텐츠가 잘려버린다면 서비스를 사용하는데 있어 불편함을 초래할 것입니다.

웹에서는 브라우저에서 스크롤이라는 기능을 자동으로 지원하여 뷰포트보다 크기가 큰 컨텐츠를 보여줄 때 스크롤을 조작하여 모든 컨텐츠를 다 열어볼 수 있습니다.

Android에서는 ScrollView를 통해 스크롤을 사용할 수 있습니다.

단, ScrollView는 하나의 자식태그만 가질 수 있기 때문에 다양한 컴포넌트들을 처리하고자 할 때는 하나로 감싼 다음 적용해주어야 합니다.

`ScrollView` 사용 예시

위 예시는 스크롤을 보이게 하기 위해 일부러 같은 것을 반복하여 작성한 것입니다.

이렇게 해주면 화면에 스크롤이 나타나게 되고 위아래로 쓸어넘기면서 모든 컨텐츠를 다 볼 수 있습니다.

주의할 점은 ScrollView가 아닌 주석 처리된 ConstraintLayout을 사용하게 되면 화면단에서 스크롤뷰를 지원하지 않으며 본래 스크롤을 넘겼을 때 표시되는 컨텐츠들은 나오지 않고 잘리게 됩니다.

GridView

개요

그리드는 row와 column의 집합체입니다. 비교대상으로 table 또한 row와 column의 집합체인데, 둘의 차이점은 컴포넌트가 사용자가 지정한대로 들어가는지 그렇지 않은지 입니다.

그리드는 순서대로 들어갑니다. 테이블은 사용자가 지정한 대로 해당 자리에 값이 들어갑니다.

`GridView` 사용 예시

스피너를 그리드 형태로 배치시켜보겠습니다.

`GridView` 준비

우선 그리드뷰가 준비되어야 합니다. 그리드뷰에서 선택한 내용의 반영여부를 확인하기 위해 텍스트뷰도 준비해줍니다. MainActivity에서 스피너로부터 선택한 결과를 텍스트뷰에 보여줄 것입니다.

스피너 아이템 준비

스피너를 사용할 것이기 때문에 스피너 내부에 들어갈 아이템 요소를 준비해줍니다.

`MainActivity` 손보기

우선 임의의 배열을 만들어줍시다. 이 배열이 스피너의 아이템이 될 것입니다.

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.view.View
import android.widget.ArrayAdapter
import android.widget.GridView
import android.widget.TextView

class MainActivity : AppCompatActivity() {

    var items = arrayOf(
        "서울", "부산", "대구", "광주", "인천", "목포", "여수", "태백",
        "서울", "부산", "대구", "광주", "인천", "목포", "여수", "태백",
        "서울", "부산", "대구", "광주", "인천", "목포", "여수", "태백",
        "서울", "부산", "대구", "광주", "인천", "목포", "여수", "태백"
    )

그 다음으로 override된 onCreate 함수 내부에 텍스트뷰와 그리드뷰를 아이디값으로 불러와 캐스트 변환 해주었습니다.

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

        val textView = findViewById(R.id.textView) as TextView
        val grid = findViewById(R.id.grid) as GridView

위에서 선언한 items 배열을 스피너 아이템에 Adapter로 꽂아주고 이를 그리드에 뿌려줍니다.

        grid.adapter = ArrayAdapter(this, R.layout.item_spinner, items)
        /* 또는
        grid.setAdapter(
            ArrayAdapter(this, R.layout.item_spinner, items)
        )
        */

그리드를 클릭했을 때 텍스트뷰를 배열의 인덱스에 맞게 업데이트 시켜줍니다.

        grid.setOnItemClickListener { parent, view, position, id ->
            textView.text = items[position]
        }

    }
}

Android : ListView

Sat, 05 Feb 2022 23:08:16 GMT

개요

이번 포스팅에서 살펴볼 내용은 리스트뷰입니다.

리스트뷰가 무엇인지 우선 안드로이드 개발자 문서에서 확인해보겠습니다.

Displays a vertically-scrollable collection of views, where each view is positioned immediatelybelow the previous view in the list. For a more modern, flexible, and performant approach to displaying lists, use RecyclerView. To display a list, you can include a list view in your layout XML file:

쉽게 말해서 사용자가 정의한 데이터 목록을 아이템 단위로 구성하여 화면에 출력해주는 것입니다.

`ListItem`과 내부 아이템 작성하기

ListItem을 사용하기 위해서 우선 activity_main.xml에 를 작성해줍니다.

TextView는 리스트뷰에서 선택한 아이템을 출력해주기위해 준비해두었습니다.

이제 리스트뷰의 각 아이템에 적용해 줄 컴포넌트를 만들어주겠습니다.

`MainActivity` 작성하기

이제 ListItem에 들어갈 각 아이템을 정의해주고 아이템을 클릭할 때마다 텍스트뷰의 내용이 바뀌도록 해주겠습니다.

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.view.View
import android.widget.AdapterView
import android.widget.ArrayAdapter
import android.widget.ListView
import android.widget.TextView
import androidx.annotation.Dimension

class MainActivity : AppCompatActivity(), AdapterView.OnItemClickListener {

    var items = arrayOf(
        "서울", "부산", "대구", "광주", "대전", "울산", "전주", "목포",
        "제주", "강원", "태백", "인천", "서울", "부산", "대구", "광주",
        "대전", "울산", "전주", "목포", "제주", "강원", "태백", "인천",
        "서울", "부산", "대구", "광주",
        "대전", "울산", "전주", "목포", "제주", "강원", "태백", "인천"
    )

arrayOf를 사용하여 배열을 만들어줍니다. 배열 안에 랜덤으로 지명을 넣어주었습니다.


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

        val listView = findViewById(R.id.listView) as ListView
        val textView = findViewById(R.id.textView)
        textView.setTextSize(Dimension.SP, 28.0f)

        // Adapter
        val adapter:ArrayAdapter<*> = ArrayAdapter(this, R.layout.item_spinner, items)

        listView.adapter = adapter

        listView.onItemClickListener = this
    }

onCreate 함수에 리스트뷰와 텍스트뷰를 아이디로 하여 접근해주었습니다. 둘 다 main_activity에 있는 컴포넌트들입니다.

val listView = findViewById(R.id.listView) as ListView

자료유형이 확실하지 않을 때 이처럼 제네릭을 로만 써줘도 무방합니다. 다만 as를 사용하여 캐스트 변환을 해줄 수도 있습니다.

textView.setTextSize(Dimension.SP, 28.0f)

텍스트뷰에 표시되는 글자의 크기를 변경해줍니다. Dimension.SP가 무엇인지 안드로이드 개발자 문서를 참조해보면

Denotes that an integer parameter, field or method return value is expected to represent a dimension.

각각은 DP, PX, SP라는 상수이며 크기를 나타내는 단위입니다.

안드로이드에서는 PX과 같은 절대적인 단위의 사용을 지양하는게 좋습니다.

각각에 대한 참고사항은 여기를 참조해주세요.

우리가 사용할 SP는 시스템 폰트를 반영하라는 것입니다.


    override fun onItemClick(p0: AdapterView<*>?, p1: View?, pos: Int, p3: Long) {
        val textView = findViewById(R.id.textView)
        textView.text = items[pos]
    }

}

그 다음으로 onItemClick 함수를 오버라이드 해주었습니다. 각각의 파라미터가 나타내는 것은 다음과 같습니다.

`parameter`	의미
`p0: AdapterView<*>?`	클릭이 발생한 `AdapterView`
`p1: View?`	`AdapterView 내에서 클릭한 보기(어댑터에서 제공하는 보기)`
`pos: Int`	`Adapter`에서 `View`의 위치
`p3: Long`	클릭된 아이템의 `row id`

텍스트뷰에는 items 배열의 pos에 해당하는 값을 넣어줍니다.

Android: 배경에 이미지 넣기

Sat, 05 Feb 2022 21:39:59 GMT

이미지를 넣을 때 ImageView라는 태그를 사용합니다.

쉽게 생각해보면 배경 이미지를 넣을 때 ImageView를 사용해서 이미지를 넣어주고 뷰포트 너비와 높이만큼 늘려주면 될 것이라고 생각할 수 있습니다.

물론 틀렸다고 말할 수는 없지만 옳은 방법은 아닙니다.

배경 이미지를 넣기 위해 이미지를 불러오는 방법은 잘못된 방법이므로, 다른 방법을 생각해보아야 합니다.

바로 레이아웃에 배경 속성을 지정해주는 방법입니다.

레이아웃 마지막 속성에 android:background="@drawable/rose"을 추가해 주었습니다.

이렇게 배경에 이미지를 추가하고자 할 때는 이미지뷰를 사용하지 않고 레이아웃에 속성을 부여하여 사용합니다.

이 이미지는 drawable 디렉터리에 있는 rose라는 이미지입니다.

Android: 컨텍스트 메뉴와 스피너

Sat, 05 Feb 2022 21:06:17 GMT

컨텍스트 메뉴란?

주요 개념

컨텍스트 메뉴(context menu) 또는 상황에 맞는 메뉴는 그래픽 사용자 인터페이스 안에서 어떠한 항목을 클릭할 때 뜨는 팝업 메뉴로, 메뉴를 호출한 동작, 응용 프로그램의 실행, 선택된 항목의 상황에 따라 다양한 선택 사항을 나열하여 보여준다. 바로 가기 메뉴라고도 한다. 위키백과

가령 바탕화면에서 오른쪽 마우스를 눌렀을 때 바탕화면과 디스플레이에 관한 메뉴를 보여줍니다. 이를 컨텍스트 메뉴라고 합니다.

컨텍스트 메뉴 구성 작성하기

우선 컨텍스트 메뉴를 만들어주기 위해 res디렉터리에 menu라는 디렉터리를 만들어주고, 내부에 context_menu_main.xml 파일을 만들어줍시다.

그 파일에 아래와 같이 메뉴 아이템들을 만들어줍니다.

컨텍스트 메뉴를 클릭할 때마다 메인 화면에서 보이는 텍스트뷰에 효과를 줄 것입니다. 그래서 텍스트뷰의 속성을 아래와 같이 작성해줍니다.

컨텍스트 메뉴 적용하기

xml 파일로 컨텍스트 메뉴를 구성하였다면, 이제 화면단에서 사용할 수 있도록 해주어야 합니다.

MainActivity를 열어서 컨텍스트 메뉴를 적용해주겠습니다. 그 전에 각 컴포넌트에 좀 더 쉽게 접근할 수 있도록 build.gradle에 다음과 같이 추가해주겠습니다.

android {
    buildFeatures {
        viewBinding true
    }
}

자 이제 메인 액티비티에 ActivityMainBinding을 선언해 주겠습니다.

import com.example.sample13.databinding.ActivityMainBinding

class MainActivity : AppCompatActivity() {

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

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

그 다음으로 컨텍스트 메뉴를 생성하는 함수를 오버라이드 해줍니다.

그리고 내부에 menuInflater.inflate(R.menu.context_menu_main, menu)를 넣어줍니다.

여기에서 menuInflater에 대해 자세히 알아보겠습니다.

This class is used to instantiate menu XML files into Menu objects. For performance reasons, menu inflation relies heavily on pre-processing of XML files that is done at build time. Therefore, it is not currently possible to use MenuInflater with an XmlPullParser over a plain XML file at runtime; it only works with an XmlPullParser returned from a compiled resource (R. something file.) 안드로이드 개발자 문서

클래스로 규정되어 있으며 이 클래스는 메뉴 XML 파일을 메뉴 객체로 인스턴스화 하는데 사용됩니다. 성능상의 이유로 메뉴 인플레이션은 빌드 시 수행되는 XML 파일 사전 처리에 크게 의존합니다....

import com.example.sample13.databinding.ActivityMainBinding

class MainActivity : AppCompatActivity() {

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

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

    // 생성한 컨텍스트 메뉴 적용
    override fun onCreateContextMenu(menu: ContextMenu?, v: View?, menuInfo: ContextMenu.ContextMenuInfo?) {
        menuInflater.inflate(R.menu.context_menu_main, menu)
    }

}

다시 말해서 우리가 작성한 context_menu_main.xml 파일을 메뉴 객체로 만들어 주기 위해 사용되는 것입니다.

여기에 딸려 있는 인터페이스인 inflate를 구현해주며, 다음과 같은 추상 메서드가 상속됩니다.

void inflate(int menuRes, Menu menu)    // 메뉴xml 경로와 menu 객체

그 다음으로 onContextItemSelected를 오버라이드하여 메뉴를 선택했을 때 바꿔 줄 내용을 선언해주겠습니다.

import com.example.sample13.databinding.ActivityMainBinding

class MainActivity : AppCompatActivity() {

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

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

    // 생성한 컨텍스트 메뉴 적용
    override fun onCreateContextMenu(menu: ContextMenu?, v: View?, menuInfo: ContextMenu.ContextMenuInfo?) {
        menuInflater.inflate(R.menu.context_menu_main, menu)
    }

    override fun onContextItemSelected(item: MenuItem): Boolean {
        val textView = findViewById(R.id.textView)
        when(item.itemId) {
            R.id.text_color -> {
                textView.text = "글자색 변경"
                textView.setTextColor(Color.parseColor("#ff0000"))
            }
            R.id.text_back_color -> {
                textView.text = "배경색 변경"
                textView.setBackgroundColor(Color.parseColor("#0000ff"))
                textView.setTextColor(Color.parseColor("#ffffff"))
            }
            R.id.text_basic -> {
                textView.text = "초기화"
                textView.setTextColor(Color.parseColor("#000000"))
                textView.setBackgroundColor(Color.parseColor("#ffffff"))
            }
        }

        return super.onContextItemSelected(item)
    }

}

글자색과 배경색을 바꿔주기 위해 setter를 사용했습니다.

메뉴가 생성되었으므로 이제 초기화될 때 텍스트뷰에 이를 적용시키기 위해서 onCreate 함수에 registerForContextMenu 메서드를 통해 텍스트뷰를 매개변수로 받아 처리하게 해줍니다.

import com.example.sample13.databinding.ActivityMainBinding

class MainActivity : AppCompatActivity() {

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

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

        registerForContextMenu(binding.textView)
    }

    // 생성한 컨텍스트 메뉴 적용
    override fun onCreateContextMenu(menu: ContextMenu?, v: View?, menuInfo: ContextMenu.ContextMenuInfo?) {
        menuInflater.inflate(R.menu.context_menu_main, menu)
    }

    override fun onContextItemSelected(item: MenuItem): Boolean {
        val textView = findViewById(R.id.textView)
        when(item.itemId) {
            R.id.text_color -> {
                textView.text = "글자색 변경"
                textView.setTextColor(Color.parseColor("#ff0000"))
            }
            R.id.text_back_color -> {
                textView.text = "배경색 변경"
                textView.setBackgroundColor(Color.parseColor("#0000ff"))
                textView.setTextColor(Color.parseColor("#ffffff"))
            }
            R.id.text_basic -> {
                textView.text = "초기화"
                textView.setTextColor(Color.parseColor("#000000"))
                textView.setBackgroundColor(Color.parseColor("#ffffff"))
            }
        }

        return super.onContextItemSelected(item)
    }

}

스피너

HTML의 라는 태그에 을 넣어 드랍다운 목록을 만들어주었습니다.



  
    
    
    
    Fruits

이 태그는 오직 문자열만 사용할 수 있다는 단점이 있기 때문에 활용성이 그렇게 높지는 않습니다.

그렇지만 안드로이드에서는 에 해당하는 것을 각각의 객체로 만들어서 넣어줄 수 있기 때문에 텍스트 뿐만 아니라 이미지도 함께 넣어줄 수 있습니다.

Android의 Spinner

우선 스피너를 만들어주기 위해 activity_main.xml에 스피너를 추가해 주겠습니다.

그리고 스피너 내부에 들어갈 아이템을 텍스트뷰로 만들어주겠습니다.

layout 디렉터리에 item_spinner.xml을 추가해줍니다.

이 아이템 하나가 각각의 스피너 아이템 객체가 될 것입니다.

이제 MainActivity로 돌아와 스피너를 초기화 해주겠습니다. 과일 이름이 들어있는 배열을 사용할 것입니다.

스피너를 초기화 해주기 위해 setUpSpinnerFruits라는 함수를 만들어줍시다.

class MainActivity : AppCompatActivity() {

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

        setUpSpinnerFruits()
    }

    // 스피너 아이템에 추가할 항목
    val fruits = arrayOf("과일 선택", "사과", "배", "바나나", "포도")

    // 스피너 초기화(값 설정) - initialize
    fun setUpSpinnerFruits() {
        val adapter = ArrayAdapter(this, R.layout.item_spinner, fruits)     // fruits 배열의 각 인덱스마다 Adapter 적용

        // spinner에 적용
        val spinner = findViewById(R.id.spinner)
        spinner.adapter = adapter
    }

}

우선 스피너의 아이템이 될 배열을 하나 만들어주었습니다.

그리고 ArrayAdapter를 사용하여 각 배열의 인덱스마다 Adapter를 적용하여 스피너 아이템으로 만들어줍니다.

이 과정을 통해 위에서 작성한 item_spinner.xml의 서식이 각각 지정됩니다.

Spinner에 위에서 적용시킨 Adapter 넣어주는 과정을 거칩니다. 그리고 onCreate 함수에서 애플리케이션 실행과 동시에 초기화시켜줍니다.

그러면 이제 스피너 아이템 선택을 감지하고 기본적으로 배치되어있는 텍스트뷰에 선택한 스피너의 값이 찍히도록 해보겠습니다.

setUpSpinnerFruits 함수에 이어서 작성합니다.

// 스피너 아이템 선택 감지 및 출력
fun setUpSpinnerHandler() {
    val spinner = findViewById(R.id.spinner)
    val textView = findViewById(R.id.textView)

    spinner.onItemSelectedListener = object : AdapterView.OnItemSelectedListener {

        override fun onItemSelected(p0: AdapterView<*>?, view: View?, position: Int, id: Long) {
            textView.text = "selected: $position ${spinner.getItemAtPosition(position)}"
        }

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

        }
    }
}

함수 내부에는 스피너와 텍스트뷰를 불러오는 변수가 있습니다.

스피너에 대해 onItemSelectedListener를 사용하여 선택된 아이템에 대해 처리해 줄 작업을 지정합니다.

이 때 AdapterView는 ListView, GridView, Spinner, Gallery의 상위 클래스입니다. 우리가 사용하는 스피너에 OnItemSelectedListener로 이벤트를 등록해 줄 것입니다.

내부에 콜백함수 두개가 선언되어 있는데 onItemSelected는 클릭된 아이템에 대해 처리할 작업이며 onNothingSelected는 아무것도 선택되지 않았을 때 처리할 작업입니다.

우리는 아이템이 선택되었을 때 텍스트뷰의 내용을 스피너 아이템 인덱스 번호와 내용을 가져와서 뿌려줄 것입니다.

아이템 내용을 가져오는 방법은 getItemAtPosition 메서드를 사용하여 position을 매개변수로 받아 가져옵니다.

외부에서 배열 받아오기

앞에서 실습한 내용은 메인 클래스 내부에서 임의로 배열을 만들어 적용한 것입니다. 외부에서 배열을 가져올 수도 있는데 values 디렉터리에 array.xml을 만들어주고 다음과 같이 입력해줍니다.



    
        과일 선택
        귤
        파인애플
        키위
        망고

태그 안에 아이템 태그로 스피너 아이템을 만들어주었습니다.

메인으로 돌아가서 fruits 변수로 선언된 배열만 바꿔주면 됩니다.

val fruits = resources.getStringArray(R.array.fruits)

View를 객체화 하여 접근하기

펼처보기

Android: 라디오 버튼과 체크박스

Sat, 05 Feb 2022 18:24:18 GMT

HTML과 Android의 라디오 버튼 비교

HTML의 라디오 버튼

라디오 버튼은 어떤 항목 내에서 하나만 선택하여 값을 받을 때 사용합니다.

우리가 흔히 익숙하게 알고 있는 동그란 모양의 그 버튼을 말합니다. html에서는 다음과 같은 방법으로 만들어주었습니다.

이 때, 다양한 선택지가 존재한다면 name 속성으로 라디오 버튼을 그룹화 해주고 각각의 value를 다르게 지정해서 선택한 값을 서버로 전송해 줄 수 있는 것입니다.

위의 코드에서 살펴보면 각각의 라디오 버튼은 name="fruit"이라는 속성으로 그룹화 되어있기 때문에 셋 중에 하나가 선택되는 구조로 되어 있음을 알 수 있습니다. 이 때 value를 각각 다르게 지정해서 조회 버튼을 클릭했을 때 어떤 값이 출력되었는지를 확인해 볼 수 있습니다.

Android에서의 라디오 버튼

안드로이드에서는 RadioGroup이라는 태그를 중심으로 하위에 RadioButton이 위치하고 있으며 RadioGroup은 html의 라디오 버튼에서 name과 같은 역할을 합니다.

라디오 그룹을 먼저 봤을 때 보통의 태그들과 별반 다를 것은 없어보입니다. 아이디가 주어져있고, 컨텐츠의 너비, 높이 그리고 기준점이 등록되어 있습니다.

그렇다면 라디오 버튼 하나만 가져와서 분해 해보겠습니다.

안드로이드와 html의 라디오 버튼 접근 방식의 차이라고 한다면 html에서는 라디오버튼의 값을 조회할 때 value로 어떤 값이 선택되었는지 확인할 수 있지만, 안드로이드에서는 id를 사용해서 해당 아이디의 버튼이 선택되었을 경우에 대한 작업을 처리하게 할 수 있습니다.

예를 들어서 radio1이라는 아이디를 가진 버튼이 클릭되었을 때 작업을 처리한다면 R.id.radio1 -> 처리할 작업과 같은 형태로 작성할 수 있습니다.

선택된 라디오 버튼 값 조회해보기

준비사항

라디오 버튼 그룹 밑에서 바로 확인할 수 있도록 텍스트뷰를 만들어서 값을 뿌려줄 준비를 해보겠습니다.

레이아웃 XML에서 텍스트뷰를 추가해줍니다. 이 때 의 아이디는 textView로 줍니다.

MainActivity에서 코드 작성

`by lazy`를 사용해서 컴포넌트에 접근하기

app 디렉터리 안에 들어있는 build.gradle에 뷰를 객체화 해주기 위해 다음과 같이 추가해줍니다.

android {
...

    buildFeatures {
        viewBinding true
    }
}

그 다음 상단의 Sync Now를 클릭하여 프로젝트를 업데이트 해줍니다.

다시 MainActivity로 돌아와서

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.util.Log
import android.widget.RadioGroup
import android.widget.TextView
import com.example.sample11.databinding.ActivityMainBinding

class MainActivity : AppCompatActivity() {

    // 컴포넌트에 자유롭게 접근 가능
    val binding by lazy { ActivityMainBinding.inflate(layoutInflater) }

    override fun onCreate(savedInstanceState: Bundle?) {

        // ActivityMainBiding을 사용할 때 setContentView를 아래와 같이 사용한다.
        setContentView(binding.root)

        // 실시간으로 바뀌는 값 가져오기
        binding.radioGroup.setOnCheckedChangeListener { _, checkedId ->
            Log.d(" ", "RadioButton is Clicked")
            when (checkedId) {
                R.id.radio1 -> {
                    binding.textView.text = "Apple is selected"
                    Log.d(" ", "Apple is selected")
                }
                R.id.radio2 -> {
                    binding.textView.text = "Banana is selected"
                    Log.d(" ", "Banana is selected")
                }
                R.id.radio3 -> {
                    binding.textView.text = "Orange is selected"
                    Log.d(" ", "Orange is selected")
                }
            }
        }

        super.onCreate(savedInstanceState)
    }
}

여기에서는 by lazy를 사용해서 컴포넌트에 보다 쉽게 접근하여 setOnCheckedChangeListener를 사용해서 각 라디오버튼의 아이디를 기준으로 특정 작업을 처리하도록 해주었습니다.

아이디 값으로 바로 컴포넌트에 접근하는 방법

by lazy로 접근하는 방법은 접근해야 할 컴포넌트의 개수가 많을 때 유리하게 사용할 수 있습니다.

우리가 접근할 컴포넌트는 두개에 한정되기 때문에 어떤 방법을 사용하더라도 크게 문제가 되진 않지만 접근해야 할 컴포넌트의 개수가 많다면 아래와 같이 id 값으로 바로 접근하는 것은 코드의 양이 많아지는 결과를 초래할 수 있씁니다.

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.util.Log
import android.widget.RadioGroup
import android.widget.TextView

class MainActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {

        setContentView(R.layout.activity_main)
        super.onCreate(savedInstanceState)

        // id로 접근하기
        val radioGroup = findViewById(R.id.radioGroup)
        val textView = findViewById(R.id.textView)

        radioGroup.setOnCheckedChangeListener { _, checkedId ->
            Log.d(" ", "RadioButton is Clicked")
            when (checkedId) {
                R.id.radio1 -> {
                    textView.text = "Apple is selected"
                    Log.d(" ", "Apple is selected")
                }
                R.id.radio2 -> {
                    textView.text = "Banana is selected"
                    Log.d(" ", "Banana is selected")
                }
                R.id.radio3 -> {
                    textView.text = "Orange is selected"
                    Log.d(" ", "Orange is selected")
                }
            }
        }
    }
}

HTML과 Android의 체크 박스 비교

HTML의 체크박스

체크박스는 라디오버튼과 다르게 체크가 되어 있는지를 확인한 후 Boolean으로 값을 반환해줍니다.

Android의 체크박스

안드로이드의 체크박스는 라는 태그를 사용하여 만들어줍니다.

이 체크박스를 체크여부에 따라 텍스트뷰의 내용을 바꿔보겠습니다.

우선 MainActivity에서 뷰를 객체화 해주기 위해 build.gradle에 다음과 같이 추가해줍니다.

android {
...

    buildFeatures {
        viewBinding true
    }
}

MainActivity에서 각 컴포넌트에 접근해서 체크박스가 체크되었을 때, 그렇지 않을 때 텍스트뷰의 내용을 바꿔주도록 하겠습니다.

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

class MainActivity : AppCompatActivity() {

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

        // traditional
        setContentView(R.layout.activity_main)
        val checkBox = findViewById(R.id.checkBox)
        val textView = findViewById(R.id.textView)

        checkBox.setOnCheckedChangeListener { _, isChecked ->
            if (isChecked) {
                textView.text = "checked!!"
            } else {
                textView.text = "unChecked!!"
            }
        }
    }
}

ActivityMainBinding을 사용하는 방법으로 작성해보겠습니다. 이 때 CompoundButton을 사용하여 모든 버튼 요소에 접근에 접근해서 OnCheckedChangeListener를 사용하여 체크박스의 상태가 바뀔 때마다 텍스트뷰의 내용을 바꿔주는 함수를 별도로 작성해주겠습니다.

이를 setOnCheckedChangeListener의 매개변수로 받아서 체크박스에 대한 이벤트를 처리해줍니다.

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.widget.CheckBox
import android.widget.CompoundButton
import android.widget.TextView
import com.example.sample12.databinding.ActivityMainBinding

class MainActivity : AppCompatActivity() {

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

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

        setContentView(binding.root)
        binding.checkBox.setOnCheckedChangeListener(checkListener)

    }

    val checkListener by lazy {
        // CompoundButton으로 모든 버튼 요소에 접근 가능
        CompoundButton.OnCheckedChangeListener { buttonView, isChecked ->
            val checkBox = findViewById(R.id.checkBox)
            val textView = findViewById(R.id.textView)

            if (isChecked) {
                when (buttonView.id) {
                    R.id.checkBox -> {
                        textView.text = "checked!!"
                    }
                }
            } else {
                when (buttonView.id) {
                    R.id.checkBox -> {
                        textView.text = "unChecked!!"
                    }
                }
            }
        }
    }
}

Android: 상단 메뉴와 이벤트 처리하기

Thu, 03 Feb 2022 12:05:46 GMT

상단 메뉴 추가하기

html에서는 상단바에 navbar를 추가할 때 웹에서는

안드로이드에서는 onCreateOptionsMenu라는 함수를 오버라이드하여 사용자 지정 메뉴를 추가할 수 있습니다.

안드로이드에서의 navbar는 action bar라고 부릅니다.

우선 액션바를 만들어주기 위해서는 컴포넌트를 생성해주는 xml이 있어야 합니다.

menu라는 태그 안에 item이라는 태그들이 들어 있으며 item이 액션바의 각 메뉴 역할을 합니다.

안드로이드에서 제공하는 무료 아이콘을 사용하기 위해 android:icon이라는 속성을 사용해 주었습니다.

그리고 app:showAsAction 속성은 직접 보여줄지 아닐지를 결정해줍니다.

검색의 경우 app:showAsAction="always|withText"로 설정하여 항상 보여주거나 텍스트(검색)을 같이 보여주도록 하고 있습니다.

채팅의 경우는 항상 보여주도록 되어있고, 이메일은 공간의 여유가 있다면 보여주도록 하고 있습니다.

세팅의 경우 never로 되어 있기 때문에 토글 메뉴 속으로 숨겨질 것입니다.

MainActivity로 돌아와 onCreateOptionsMenu 함수를 오버라이드 해주고 menuInflater로 메뉴 XML을 객체로 인스턴스화 해줍니다.

이를 menu 디렉터리의 menu_main에 확장시켜주었습니다.

액션바의 각 메뉴를 클릭하면 로그를 통해 함수가 실행되었음을 알려주고 id로 지정된 것들을 누르면 텍스트뷰가 바뀌도록 해주었습니다.

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

        // action bar를 보이지 않게 해줌
//        supportActionBar?.setDisplayShowTitleEnabled(false)
    }

    // 사용자 지정 메뉴 추가
    override fun onCreateOptionsMenu(menu: Menu?): Boolean {
        menuInflater.inflate(R.menu.menu_main, menu)
        return super.onCreateOptionsMenu(menu)
//        return false
    }

    // 메뉴 item 클릭시
    override fun onOptionsItemSelected(item: MenuItem): Boolean {
        Log.i(ContentValues.TAG,"onOptionsItemSelected()가 실행됨.")

        val textView:TextView = findViewById(R.id.textView)
        when(item.itemId) {
            R.id.menu_search -> textView.text = "검색 메뉴가 클릭됨."
            R.id.menu_chat -> textView.text = "채팅 메뉴가 클릭됨."
            R.id.menu_email -> textView.text = "이메일 메뉴가 클릭됨."
            R.id.action_setting -> textView.text = "세팅 메뉴가 클릭됨."
        }
        return super.onOptionsItemSelected(item)
    }
}

이벤트 처리하기

어떤 버튼을 누르거나 기기를 흔들거나 할 때 모달을 띄우고 내용을 바꿔주고 보이던 것을 보이지 않게하는 것, 바로 이벤트입니다.

자바스크립트에서 이벤트 리스너를 통해 DOM 요소를 동적으로 만들어주었는데, 안드로이드에서도 마찬가지로 각각의 컴포넌트를 동적으로 만들어줄 수 있습니다.

이 때 onClick 함수를 오버라이드하여 사용하거나 각각의 컴포넌트에 ID로 접근하여 OnClickListener라는 메서드로 제어합니다.

다음과 같은 구조의 XML에 대해서

입력란에 이름을 입력하고 버튼을 클릭했을 때 알림창으로 이름을 출력해주는 로직을 작성해보겠습니다.

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

        val button = findViewById

프로젝트 생성 동시에 기본적으로 생성되는 onCreate 함수 안에서 실행시켜주었습니다.

입력란과 버튼에 ID로 접근하여 버튼에 대해 이벤트를 세팅해줍니다.

`by lazy` 사용하여 이벤트 처리하기

또 다른 방법으로는 by lazy를 사용하는 방법이 있습니다.

초기화를 늦게 시켜준다는 개념이었는데, 프로그램을 실행하자마자 초기화할 필요가 없는 경우에 대비하여 만들어진 녀석입니다.

두개의 버튼을 위 아래로 주고 위에 있는 버튼을 눌렀을 때 아래에 있는 버튼의 내용을 날짜가 출력되도록 프로그램을 작성해보겠습니다.

import android.annotation.SuppressLint
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.widget.Toast
import android.util.Log
import android.view.View
import android.widget.Button
import java.text.SimpleDateFormat
import java.util.*

class MainActivity : AppCompatActivity(), View.OnClickListener {

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

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

        val btn2 = findViewById

View.OnClickListener를 메인클래스에서 사용하게 되면 findViewId로 직접 컴포넌트에 접근하여 클릭 이벤트를 줄 수 있습니다. 또한 onClick 함수를 별도로 만들어서 xml상에서 android:onClick="onClick"로 직접 부여하여 사용할 수도 있습니다.

여기에서 by lazy 를 사용해 보겠습니다.

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.widget.Toast
import com.example.sample09.databinding.ActivityMainBinding
import java.util.*

class MainActivity : AppCompatActivity() {

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

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(binding.root)    // 이 코드를 마주했을 때 binding이 초기화(객체화)됨.

        binding.btn.setOnClickListener {
            Toast.makeText(this.applicationContext, "버튼_one 클릭", Toast.LENGTH_SHORT).show()

            binding.btn2.text="시간 출력~"
        }
    }
}

by lazy를 사용하면 초기화를 늦게 해줍니다. 그래서 우선적으로 onCreate 함수가 실행되게 되고 함수 내부에서 setContentView를 만나면 binding이 초기화 되면서 버튼을 클릭했을 때 이벤트 리스너가 실행됩니다.

Android: Layout

Thu, 03 Feb 2022 11:32:11 GMT

Layout

Layout이란?

흔히 레이아웃이라 하면 어떤 요소들을 적재적소에 효율적으로 배치하는 것을 말합니다.

예를 들어 새로 오픈한 마트의 전단지를 보면 마트 이름, 행사 상품, 약도, 주소, 전화번호 등등 다양한 것들이 기재되어 있는데, 보기좋은 형태를 취하고 있습니다.

소비자의 눈에 한눈에 들어오도록 일목요연하게 정리되어 있지요.

Application을 제작할 때 사용자가 조작하기 쉽도록 UI를 각 공간에 효율적으로 배치하는 일을 레이아웃이라고 합니다.

레이아웃에는 다양한 종류가 있고, 이 포스팅에서는 6가지 정도에 대해 살펴보려고 합니다.

Android의 Layout

우선 안드로이드 개발자 문서에서는 다음과 같이 레이아웃을 정의하고 있습니다.

레이아웃은 앱에서 사용자 인터페이스를 위한 구조(예: 활동)를 정의합니다. 레이아웃의 모든 요소는 View와 ViewGroup 객체의 계층 구조를 사용하여 빌드됩니다. 일반적으로 View는 사용자가 보고 상호작용할 수 있는 것을 그립니다. ViewGroup은 그림 1과 같이 View 및 기타 ViewGroup 객체의 레이아웃 구조를 정의하는 보이지 않는 컨테이너입니다. 그림 1. UI 레이아웃을 정의하는 뷰 계층 구조 예

우리에게 가장 친숙한 HTML로 살펴본다면 View는 사용자와 소통하는 각각의 컴포넌트에, ViewGroup은 그 컴포넌트들을 감싸고 있는

태그 정도로 봐도 무방할 것 같습니다.

안드로이드에서는 이를 XML로 작성하여 화면에 보여주며, 반드시 하나의 View나 ViewGroup으로 감싸져 있어야 합니다.

이렇게 작성된 XML은 초기에 MainActivity.kt 안에 있는 클래스의 onCreate() 함수에 의해 호출되어 생성됩니다.

fun onCreate(savedInstanceState: Bundle) {
    super.onCreate(savedInstanceState)
    setContentView(R.layout.main_layout)
}

Layout에 배치되는 UI

여기서 UI라고 함은 텍스트 상자, 입력상자, 버튼 등 사용자에게 보여줄 다양한 요소를 말합니다. 이는 위에서 언급한 XML 문서로부터 작성되고 onCreate() 함수에 의해 초기화 됩니다.

각각의 요소들은 속성을 갖습니다.

html에서도 각 태그들은 위와 같이 속성과 값이라는 구조를 가지며 태그만의 특성을 나타내주었습니다.

안드로이드에서도 비슷한 방식을 취하는데 위의 xml을 예로 들어보겠습니다.

`android:layout_width`와 `android:layout_height`

모든 컴포넌트는 레이아웃 위에 배치됩니다. 이 때 레이아웃 컨테이너 내부에서 어느 정도의 너비와 높이를 가질 것인지 나타냅니다.

`match_parent`와 `wrap_content`

match_parent는 상위 뷰 그룹이 허용하는 한 최대한 커지도록 뷰에 지시합니다. wrap_content는 콘텐츠에 필요한 치수대로 알아서 크기를 조절하라고 뷰에 지시합니다.

단, 픽셀과 같이 절대적인 단위를 사용하여 레이아웃 너비와 높이를 지정하는 것은 권장되지 않습니다. 밀도 독립형 픽셀 단위(dp)나 wrap_content, match_parent와 같은 상대적인 측정값을 사용하는 것이 좋습니다.

`android:id="@+id/아이디"`

컴포넌트의 아이디를 나타냅니다. 아이디를 통해 MainActivity에서 각 컴포넌트에 접근하여 이벤트를 제어하거나 할 수 있습니다.

`android:orientation="vertical 또는 horizontal"`

컨텐츠가 쌓이는 방식입니다. horizontal이면 컴포넌트가 수평하게 쌓입니다. 반대로 vertical이면 컴포넌트가 수직으로 쌓입니다.

ConstraintLayout

최신 레이아웃 방식입니다.

기존의 레이아웃도 물론 멋있는 애플리케이션을 만들 수 있었지만, 개발자들을 힘들게 만들었습니다.

그것은 바로 기기마다 다른 해상도가 주원인이었고, 개발자들은 어쩔 수 없이 다양한 해상도를 지원하기 위해 해상도만 다른 같은 앱을 여러개 만들었어야 했습니다.

그러나 Constraint Layout은 혁신을 불러왔습니다. 마치 HTML의 flex box처럼 작동하여 다양한 기기의 해상도에 맞게 알아서 컴포넌트의 크기를 최적화 해주기 때문입니다.

A ConstraintLayout is a ViewGroup which allows you to position and size widgets in a flexible way.

안드로이트 프로젝트를 새로 만들게 되면 레이아웃은 기본적으로 Constraint로 설정되어 있습니다.

LinearLayout

LinearLayout is a view group that aligns all children in a single direction, vertically or horizontally. You can specify the layout direction with the android:orientation attribute.

쉽게 말해서 뷰 그룹의 하위에 속한 항목들을 수직 또는 수평방향으로, 단일 방향으로 배치하는 레이아웃입니다.

위 xml에서 레이아웃의 오리엔테이션이 수직으로 정의되어 있으므로 텍스트뷰와 버튼은 수직으로 배치됩니다.

위 아래로 긴 형태가 되는 것이지요.

RelativeLayout

상대적 레이아웃이라고도 부릅니다. 구글 개발자 문서에 우연히 한국어로 된 문서가 있었습니다.

RelativeLayout은 상대 위치에 하위 뷰를 표시하는 뷰 그룹입니다. 각 뷰의 위치는 동위 요소(예: 다른 뷰의 왼쪽 또는 아래)에 상대적이거나 상위 RelativeLayout 영역(예: 맨 아래, 왼쪽 또는 중앙으로 정렬됨)에 상대적인 위치로 지정될 수 있습니다.

단, 컴포넌트를 만들어주고 위치를 지정해주지 않으면 모두 왼쪽 상단에 그려지기 때문에 RelativeLayout.LayoutParams를 사용하여 위치를 지정해줄 수 있습니다.

RelativeLayout.LayoutParams를 네가지 정도만 가져와서 소개해보겠습니다.

android:layout_alignParentTop : "true"면 뷰의 상단 가장자리를 상위 뷰의 상단 가장자리와 일치시킵니다.
android:layout_centerVertical : "true"면 하위 요소를 상위 요소 내에 세로로 중앙에 배치합니다.
android:layout_below : 뷰의 상단 가장자리를 리소스 ID로 지정한 뷰 아래에 배치합니다.
android:layout_toRightOf : 이 뷰의 왼쪽 가장자리를 리소스 ID로 지정된 뷰의 오른쪽에 배치합니다.
더 많은 내용은 여기를 참고해주세요.

FrameLayout

우선 설명입니다.

FrameLayout is designed to block out an area on the screen to display a single item. Generally, FrameLayout should be used to hold a single child view, because it can be difficult to organize child views in a way that's scalable to different screen sizes without the children overlapping each other. You can, however, add multiple children to a FrameLayout and control their position within the FrameLayout by assigning gravity to each child, using the android:layout_gravity attribute.

집어 치우고 여기서 FRAME은 액자입니다. 액자에는 사진을 넣습니다.

하나의 액자에 여러개의 사진을 같이 넣으면 마지막에 넣은 사진은 앞에 넣은 사진에 가려서 보이지 않을 것입니다.

이를 프레임 레이아웃에 연결시켜보면 액자 속에서 보이는 뷰는 보이지 않는 뷰를 가리고 있어서 보이지 않는 뷰의 전체를 다 볼 수 없게 됩니다.

세 개의 뷰가 있다고 가정했을 때 크기가 모두 같다면 가장 앞에 있는 뷰만 보이게 되고, 크기가 모두 다르다면 가장 큰 크기의 뷰는 자신을 가리고 있는 뷰에 의해 일부분만 보이게 될 것입니다.

아래와 같이 xml에서 컴포넌트를 정의했다고 가정하면

이와 같은 형태로 보일 것입니다.

나중에 들어간 자동자 사진이 맨 앞으로 나와서 처음 들어간 바다 사진을 가리는 것이지요.

참고로 여기서 app:srcCompat="@drawable/pride"는 미디어를 삽입하기 위한 속성으로 @drawble 디렉터리 안에 들어있는 사진이름을 적어준 것입니다.

GridLayout

CSS에서 그리드 시스템이라는 개념에 대해 들어보았을 것입니다.

MDN에서 다음과 같이 정의합니다.

그리드는 수평선과 수직선으로 이루어진 집합체로, 디자인 요소를 정렬할 수 있는 대상 패턴을 생성한다. 이 디자인은 페이지에서 페이지로 이동할 때 요소가 널뛰거나 너비가 바뀌지 않는 디자인 생성에 도움을 주어 웹 사이트의 일관성을 높여준다. 하나의 그리드은 대게 columns, rows로 구성되며, 각 행과 열 사이에 공백이 있는데, 대게는 이를 일컬어 gutters라고 부른다.

안드로이드에서도 마찬가지로 row와 column을 가지며 지정된 row와 column에 맞게 컴포넌트를 순서대로 정렬해줍니다.

아래 XML을 보시면 으로 선언되었고 이 태그는 android:rowCount과 android:columnCount라는 속성을 갖습니다.

4행 3열의 구조로 총 12칸을 가지며 1 ~ 12라는 값을 가진 버튼들은 순서대로 배치됩니다.

다음과 같은 결과를 얻을 수 있습니다.

TableLayout

단어에서 느껴지는 것처럼 표를 기반으로 한 레이아웃입니다.

그리드와 비슷할 수 있으나 그리드는 행렬에 순서대로 컴포넌트가 자리잡는데 반해 테이블은 HTML에서의 테이블처럼 지정된 곳에 값을 넣어줄 수 있습니다.

테이블 레이아웃 내부에는 TableRow가 존재하고 내부에 TextView가 들어있는 구조입니다.

마치

와 같은 구조로 볼 수 있습니다.

결과는 다음과 같습니다.

Android : activity_main.xml 구성

Sun, 30 Jan 2022 07:53:17 GMT

/app/src/main/res/layout/activity_main.xml은 View를 구성하는 요소들이다.

View, Activity, Fragment란?

구분	의미
View	화면 내 기본적인 UI 요소, 모든 UI 요소는 View 클래스의 서브클래스 Widget과 Layout으로 구분하며 Widget은 Button, TextView, CheckBox와 같은 시각적인 UI 요소를 의미함. Layout은 화면에서 보이지 않으나 다른 View들을 담는 container 역할을 하는 것을 의미함.
Activity	하나의 화면과 밀접하게 연관되어 있는 독립형 실행 모듈
Fragment	두 개 이상의 Activity를 하나의 화면에서 구성하는 것.

activity_main.xml 구성

TextView는 텍스트 상자를 나타내고, Button은 버튼을 나타냄.

MainActivity.kt

package com.test.androidstudy

import android.content.ContentValues
import android.content.DialogInterface
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.util.Log
import android.widget.Button
import android.widget.TextView
import android.widget.Toast
import androidx.appcompat.app.AlertDialog

class MainActivity : AppCompatActivity() {

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

    override fun onCreate(savedInstanceState: Bundle?) {

        /*  biding을 사용한다면
            setContentView(R.layout.activity_main)
            setContentView(binding.root)

            binding.btnSay.setOnClickListener {
                Log.i(ContentValues.TAG, "btnSay Tapped")
                binding.sayHello.text = "Hello World!"
            }
        */
        super.onCreate(savedInstanceState)

        // layout에 있는 activity_main.xml로 화면 정의
        setContentView(R.layout.activity_main)

        val sayHello:TextView = findViewById(R.id.sayHello)
        val butter = findViewById

[BOJ] 24089 : ボールの移動 (Moving Balls)

Fri, 28 Jan 2022 04:58:09 GMT

問題

$N$個のボールがあり、１から$N$までの番号が付けられている。また、何個でもボールを入れることのできる$N$個の箱があり、箱には１から$N$までの番号が付けられている。

箱$i$（$1≦i≦N$）には最初、ボール$i$が入っていた。

JOI高校の生徒である葵は、この状態から箱とボールに対して$M$回の操作を行なった。

$j$回目の（$1≦j≦M$）の操作は、次のように行われた。

ボール$X_j$が入っている箱を探し、その箱からボール$X_j$を取り出す。その後、箱$Y_j$にボール $X_j$を入れる。

葵が$M$回の操作をすべて終えた後、$N$個のボールがそれぞれどの箱に入っているかを求めよ。

INPUT ＆ OUTPUT

INPUT ＆ OUTPUTの例

コード作成

Java

import java.util.Scanner;

public class Main {

    public static void main(String[] args) {

        // BOJ24089

        Scanner sc = new Scanner(System.in);

        int n = sc.nextInt();                   // 공의 개수
        int m = sc.nextInt();                   // 조작 횟수

        int[] box = new int [n];                // 박스를 공의 개수만큼 만들어줌

        for (int i = 0; i < box.length; i++) {
            box[i] = i+1;                       // 조작하기 전 조건에 맞게 공 초기화
        }

        for (int i = 0; i < m; i++) {
            int x = sc.nextInt();               // 꺼낼 공
            int y = sc.nextInt();               // 옮길 상자
            box[x-1] = y;
        }

        for (int ball : box) {
            System.out.println(ball);           // 개행을 두고 공을 순서대로 출력
        }

    }
}

Kotlin

import java.util.Scanner

fun main(args: Array) = with(Scanner(System.`in`)) {

    val n:Int = nextInt()    // 공의 개수
    val m:Int = nextInt()    // 조작 횟수

    var index = 1
    val box:Array = Array(n) { index++ }


    for(i in 0 until m) {
        val x:Int = nextInt()
        val y:Int = nextInt()
        box[x-1] = y
    }

    for(ball in box) {
        println(ball)
    }

}

Kotlin Programming Intermediate - 11

Thu, 27 Jan 2022 07:20:04 GMT

구단 관리 프로그램 작성하기

야구팀 관리 프로그램을 작성하시오.

DTO는 Human을 상속받는 Picher, Batter가 있고 DAO에서 Mutablelist로 CRUD를 구현할 것. 단, 각각의 클래스는 하나의 파일에서 작성할 것. 파일 입출력 기능 구현할 것.

Main

import dao.MemberDao
import kotlin.system.exitProcess

fun main(args: Array) {

    // dao 생성
    val dao = MemberDao()

    while(true) {
        println("******************************************")
        println("************* 구단 관리 프로그램 *************")
        println("** 사용하실 메뉴 번호를 입력 후 엔터키를 누르세요. **")
        println("************* 1. 선수 등록 *****************")
        println("************* 2. 전체 선수 조회 *************")
        println("************* 3. 선수 검색 *****************")
        println("************* 4. 선수 정보 수정**************")
        println("************* 5. 선수 삭제 *****************")
        println("************* 6. 파일로 저장 ****************")
        println("************* 7. 파일 바로 출력 **************")
        println("************* 8. 프로그램 종료 ***************")
        print("****** 사용할 메뉴의 번호 >>>> ")

        var wantToUse: Int = readLine()!!.toInt()

        when (wantToUse) {
            1 -> dao.addMember()
            2 -> dao.printAllData()
            3 -> dao.searchWithName()
            4 -> dao.editTeamList()
            5 -> dao.deleteTeamList()
            6 -> dao.saveAsText()
            7 -> dao.printFileToConsole()
            8 -> {
                println("프로그램이 종료됩니다...")
                exitProcess(0)
            }
        }
    }



}

DTO

package dto

open class Human(var index:Int, var number: Int, var name: String, var age:Int, var height: Double, var ref:Int) {

    override fun toString(): String {
        return "$index. 선수번호: $number, 선수이름: '$name', 나이: $age, 선수 신장: $height, "
    }
}

class Pitcher(index: Int, number: Int, name: String, age:Int, height: Double, ref:Int, var win:Int, var lost:Int, var defense:Double) : Human(index, number, name, age, height, ref) {

    override fun toString(): String {
        return super.toString() + "전적: ${win}승 / ${lost}패, 방어율: $defense"
    }

}

class Batter(index:Int, number:Int, name:String, age:Int, height:Double, ref:Int, var batCount:Int, var hit:Int, var batAvg:Double) : Human(index, number, name, age, height, ref) {

    override fun toString(): String {
        return super.toString() + "타수: $batCount, 안타수: $hit, 타율: $batAvg"
    }

}

DAO

package dao

import dto.Batter
import dto.Human
import dto.Pitcher
import java.io.File
import java.io.FileWriter

class MemberDao {

    var teamList:MutableList = mutableListOf(
        Pitcher(1, 1001, "Kim", 25, 181.5, 1, 100, 42, 75.0, ),
        Batter(2, 1002, "Park", 24, 181.5, 2, 75, 10, 24.0, )
    )



    // CRUD
    // CREATE
    fun addMember() {

        print("입력할 선수의 번호 >> ")
        var number:Int = readLine()!!.toInt()
        print("입력할 선수명 >> ")
        var name:String = readLine()!!
        print("입력할 선수의 나이 >> ")
        var age:Int = readLine()!!.toInt()
        print("입력할 선수의 신장 >> ")
        var height:Double = readLine()!!.toDouble()

        print("투수라면 1, 타자라면 2를 입력하세요 >> ")
        var ref:Int = readLine()!!.toInt()

        var index = 0
        index++

        when (ref) {
            1 -> {
                print("승리한 경기 수 >> ")
                var win:Int = readLine()!!.toInt()
                print("패배한 경기 수 >> ")
                var lost:Int = readLine()!!.toInt()
                var defense:Double = (win / lost).toDouble()

                teamList.add(Pitcher(index, number, name, age, height, ref, win, lost, defense))

                println("입력하신 선수가 추가되었습니다.")
            }

            2 -> {
                print("타수 >> ")
                var batCount:Int = readLine()!!.toInt()
                print("안타수 >> ")
                var hit:Int = readLine()!!.toInt()
                var batAvg:Double = (batCount / hit).toDouble()

                teamList.add(Batter(index, number, name, age, height, ref, batCount, hit, batAvg))
                println("입력하신 선수가 추가되었습니다.")
            }

            else -> println("잘못된 입력입니다. 다시 시도하세요.")
        }



    }


    // READ
    // 모든 데이터 출력
    fun printAllData() {
        if(teamList != null || teamList.size != 0) {
            for (item in teamList) println(item)
        } else if (teamList == null || teamList.size == 0) {
            println("작성된 명단이 한 건도 존재하지 않습니다.")
        }
    }

    // 검색
    fun searchWithName() {
        print("검색할 선수의 이름 입력 >> ")
        var inputName:String = readLine()!!

        for(item in teamList) {
            if (item.name == inputName) {
                println(item)
            } else {
                println("검색결과가 없습니다")
            }
        }
    }


    // UPDATE
    // 수정

    private var Human.win: Int
        get() { return win }
        set(value) { win = value }

    private var Human.lost: Int
        get() { return lost }
        set(value) { lost = value }

    private var Human.bat: Int
        get() { return bat }
        set(value) { bat = value }

    private var Human.hit: Int
        get() { return hit }
        set(value) { hit = value }

    fun editTeamList() {
        printAllData()
        print("수정할 선수의 순번을 입력하세요 >> ")
        val wantEdit:Int = readLine()!!.toInt() - 1
        println("다음 선수의 정보를 수정합니다.")
        println("${teamList[wantEdit]}")

        println("수정할 내용을 선택하세요.")
        for (item in teamList) {
            if (item.ref == 1) {
                print("*** [1]선수번호, [2]선수이름, [3]나이, [4]신장, [5]이긴 게임 수, [6]진 게임 수 >> ")

                val editInform:Int = readLine()!!.toInt()

                when(editInform) {
                    1 -> {
                        print("변경할 선수번호를 입력하세요 >> ")
                        val newNumber:Int = readLine()!!.toInt()
                        teamList[wantEdit].number = newNumber
                        println("변경이 완료 되었습니다.")
                        break
                    }

                    2-> {
                        print("변경할 선수이름을 입력하세요 >> ")
                        val newName:String = readLine()!!
                        teamList[wantEdit].name = newName
                        println("변경이 완료 되었습니다.")
                        break
                    }

                    3-> {
                        print("변경할 선수나이를 입력하세요 >> ")
                        val newAge:Int = readLine()!!.toInt()
                        teamList[wantEdit].age = newAge
                        println("변경이 완료 되었습니다.")
                        break
                    }

                    4-> {
                        print("변경할 선수신장을 입력하세요 >> ")
                        val newHeight:Double = readLine()!!.toDouble()
                        teamList[wantEdit].height = newHeight
                        println("변경이 완료 되었습니다.")
                        break
                    }

                    5 -> {
                        print("변경할 이긴 게임 수를 입력하세요 >> ")
                        val newWinValue:Int = readLine()!!.toInt()
                        teamList[wantEdit].win = newWinValue
                        println("변경이 완료 되었습니다.")
                        break
                    }

                    6 -> {
                        print("변경할 이긴 게임 수를 입력하세요 >> ")
                        val newWinValue:Int = readLine()!!.toInt()
                        teamList[wantEdit].lost = newWinValue
                        println("변경이 완료 되었습니다.")
                        break
                    }
                }

            } else if (item.ref == 2) {
                print("*** [1]선수번호, [2]선수이름, [3]나이, [4]신장, [5]타수, [6]안타수 >> ")

                val editInform:Int = readLine()!!.toInt()

                when(editInform) {
                    1 -> {
                        print("변경할 선수번호를 입력하세요 >> ")
                        val newNumber:Int = readLine()!!.toInt()
                        teamList[wantEdit].number = newNumber
                        println("변경이 완료 되었습니다.")
                        break
                    }

                    2-> {
                        print("변경할 선수이름을 입력하세요 >> ")
                        val newName:String = readLine()!!
                        teamList[wantEdit].name = newName
                        println("변경이 완료 되었습니다.")
                        break
                    }

                    3-> {
                        print("변경할 선수나이를 입력하세요 >> ")
                        val newAge:Int = readLine()!!.toInt()
                        teamList[wantEdit].age = newAge
                        println("변경이 완료 되었습니다.")
                        break
                    }

                    4-> {
                        print("변경할 선수신장을 입력하세요 >> ")
                        val newHeight:Double = readLine()!!.toDouble()
                        teamList[wantEdit].height = newHeight
                        println("변경이 완료 되었습니다.")
                        break
                    }

                    5 -> {
                        print("변경할 타수를 입력하세요 >> ")
                        val newBat:Int = readLine()!!.toInt()
                        teamList[wantEdit].bat = newBat
                        println("변경이 완료 되었습니다.")
                        break
                    }

                    6 -> {
                        print("변경할 안타 수를 입력하세요 >> ")
                        val newHit:Int = readLine()!!.toInt()
                        teamList[wantEdit].hit = newHit
                        println("변경이 완료 되었습니다.")
                        break
                    }
                }
            }
        }

    }


    // DELETE
    fun deleteTeamList() {
        printAllData()
        print("삭제할 선수의 순번을 입력하세요 >> ")
        var wantToDelete = readLine()!!.toInt() - 1
        teamList.removeAt(wantToDelete)
    }

    // File IO
    // 파일로 저장
    fun saveAsText() {

        val path:String = "/User/hwangduil/test/test.rtf"
        val writer = FileWriter(path)

        try {
            writer.write(teamList.toString())
        } catch (e:Exception) {
            e.printStackTrace()
        } finally {
            writer.close()
        }

    }

    // 파일을 콘솔로 출력
    fun printFileToConsole() {

        val path:String = "/User/hwangduil/test/test.rtf"

        val br = File(path).bufferedReader()
        val list = mutableListOf()
        br.useLines { e -> e.forEach { list.add(it) } }
        list.forEach { println(it) }

    }

}

Beautify.log

블로그 이전

Android : Sqlite

개요

웹에서의 DB

안드로이드의 DB

Sqlite 사용하기

DBHelper 작성하기

MainActivity에서 CRUD 사용

Android : 장면 전환 시 데이터 주고받기

개요

접근

getSharedPreferences

메인 레이아웃 구성

서브 레이아웃 구성

MainActivity

Parcelable

메인 화면 레이아웃 구성

서브 레이아웃 구성

DTO 구성

MainActivity

SubActivity

Singleton

메인 레이아웃

서브 레이아웃

싱글톤 생성

MainActivity

SubActivity

Android : JSON 파일 파싱하기

개요

JSON이란?

JSON 파일 Parsing

JSON 파일 준비

JSON 파일 읽어오기

Android: 파일 입출력

개요

파일 입출력이란?

파일 입출력 구현을 위한 레이아웃

레이아웃

버튼 클릭 시 파일 읽고 쓰기, 뷰에 출력

Android : DatePicker와 TimePicker

DatePicker

개요

calendar 타입의 DatePicker

spinner 타입의 DatePicker

값 얻어오기

TimePicker

개요

clock 타입의 TimePicker

spinner 타입의 TimePicker

값 얻어오기

Android: ImageButton

개요

activity_main.xml에 이미지 버튼 넣기

MainActivity에서 이벤트 추가하기

Android: SeekBar와 RatingBar

SeekBar

개요

activity_main.xml에 넣어주기

MainActivity 설정해주기

RatingBar

개요

activity_main.xml에 RatingBar 넣어주기

MainActivity에서 텍스트뷰에 별점 반영하게 하기

Android : Fragment

Fragment란?

상단에 버튼을 주고 조작에 따라 다른 뷰 표시하기

Button 메뉴 만들어주기

각 뷰에 보여 줄 페이지 작성하기

activity_fragment_one.xml

activity_fragment_two.xml

activity_fragment_three.xml

activity_main.xml에서 FrameLayout 지정하기

Kotlin 패키지 파일 작성

FragmentMenu

FragmentOne ~ FragmentThree

MainActivity

navBar로 Fragment 사용하기

의존성 추가

navBar 구성 만들어주기

`getSharedPreferences`

`MainActivity`

`Parcelable`

`Singleton`

`calendar` 타입의 DatePicker

`spinner` 타입의 DatePicker

`clock` 타입의 TimePicker

`spinner` 타입의 TimePicker

`activity_main.xml`에 이미지 버튼 넣기

`MainActivity`에서 이벤트 추가하기

`SeekBar`

`activity_main.xml`에 넣어주기

`MainActivity` 설정해주기

`RatingBar`

`activity_main.xml`에 `RatingBar` 넣어주기

`MainActivity`에서 텍스트뷰에 별점 반영하게 하기

`Button` 메뉴 만들어주기

`activity_fragment_one.xml`

`activity_fragment_two.xml`

`activity_fragment_three.xml`

`activity_main.xml`에서 `FrameLayout` 지정하기

`FragmentMenu`

`MainActivity`

`navBar`로 `Fragment` 사용하기

`navBar` 구성 만들어주기

`activity_main.xml`에 `FrameLayout`과 `navBar` 만들어주기

`MainActivity`에서 연결하기

`activity_main.xml`

`activity_main.xml`에 `WebView` 만들어주기

`MainActivity`에서 특정 웹페이지 url로 불러오기

`MainActivity`에서 html로 페이지 삽입하기

`MainActivity`에서 html 문서 넣기

`src`의 `main` 디렉터리 내부에 `assets` 디렉터리 만들기

`html` 문서 호출하기

`ScrollView` 사용 예시

`GridView` 사용 예시

`GridView` 준비

`MainActivity` 손보기

`ListItem`과 내부 아이템 작성하기

`MainActivity` 작성하기

`by lazy`를 사용해서 컴포넌트에 접근하기

`by lazy` 사용하여 이벤트 처리하기

`android:layout_width`와 `android:layout_height`

`match_parent`와 `wrap_content`

`android:id="@+id/아이디"`

`android:orientation="vertical 또는 horizontal"`