어플만들기 stage 개념 도입. 중간정리 (앱#15)

어제까지 안드로이드 코틀린 스톱워치에서 랜덤 한 숫자를 만들었고, 

그 숫자르 맞추기 위해서, 제가 시간을 시작, 정지할 수 있는 기능을 만들었습니다.

그리고 그 아래는 랜덤 한 숫자에서, 내가 정지한 숫자를 뺀 숫자가 계산되어 나타나게 만들었습니다.

하지만, 딱 한번만 하고 끝낼 수는 없죠.

 

여러 명이 참가할 수 있게 만들어야 합니다.

 

클릭을 하면, 시간이 다시 흘러가잖아요? 

초기화가 필요합니다. 또한 사람들이 모두 목표시간을 다르게 만들어야 하기 때문에, 다시 최초로 랜덤 하게 만들 필요가 있습니다.

이 것들을 해보겠습니다. 

 

하지만 일단 정리를 한번 해야겠죠? 이번에는 isrunning을 빼고, stage 개념을 도입하면서

정리를 해보겠습니다. isrunning으로하면 true값, 그리고 나머지 값 이 2가지만 했는데, stage개념을 넣으면 더 다양한 효과를 넣을 수 있기 때문에 해보겠습니다.

 

저희가 어제 했던 것들을 보죠.

어제 완료했던 것들입니다. 이제는 글자도 넣어보겠습니다. 뭔가 우리가 만들고 있으니까 뭔지를 알지, 남들이 보면 뭔가 싶잖아요? 그렇기에 한번 텍스트를 넣어서 조금 변경을 해보겠습니다.

텍스트 뷰를 넣어줘서, 현재와 목표라는 글을 적었습니다.

그리고 숫자를 위아래에서, 양옆으로 나눴고, 글자 수도 조금 더 크게 만들었죠.

가운데 숫자는 어차피 중간에 보이지 않기 때문에, 어떤 글자를 쓰지 않았습니다. 가운데 숫자는 제가 버튼을 눌렀기 때문에, 계산을 해서 보이는 것입니다.

 

이번에는 메인 액티비티로 가보겠습니다.

먼저 기존에 있던 내용입니다.

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

        var timerTask: Timer? = null
        var isRunning = false
        var sec : Int = 0
        val abc: TextView =  findViewById(R.id.text_random)
        val abc_1: TextView =  findViewById(R.id.text_time)
        val abc_2: TextView =  findViewById(R.id.text_point)
        val btn: Button =  findViewById(R.id.btn_main)


        val random = Random()
        val num = random.nextInt(1001)
        abc.text = ((num.toFloat())/100).toString()



        btn.setOnClickListener {
            isRunning = !isRunning
            if (isRunning == true) {
                timerTask = kotlin.concurrent.timer(period = 10) {
                    sec++
                    runOnUiThread {
                        abc_1.text = (sec.toFloat()/100).toString()
                    }
                }
            }  else {
                timerTask?.cancel()
                val point = (abs(sec-num).toFloat())/100
                abc_2.text = point.toString()
            }}}}

온 크리에이티드 함수를 보겠습니다.

override fun onCreate(savedInstanceState: Bundle?)

이렇게 적혀있잖아요? fun은 함수입니다.

이 것을 정리하기 위해서, 이대로 끝이 아니라, 함수를 정해줘서 조금 더 다채롭게 만들 수 있게 만들어보겠습니다.

fun main을 함수로 넣겠습니다.

class MainActivity() : AppCompatActivity(){
    fun main() {
        
    }

이런 식으로 변경을 했습니다. 그러면 메인 함수만 불러오는 것이겠죠?

메인 아래, 저희가 만들었던 것들을 집어넣어 보겠습니다.

 

 

차례대로 넣어보겠습니다.

setContentView(R.layout.activity_main)

이것은  액티비티 메인 파일을 불러오라는 것이었죠?

 

이후 변수를 그대로 가지고 와보겠습니다.

 

var timerTask: Timer? = null
var isRunning = false
var sec : Int = 0
val abc: TextView =  findViewById(R.id.text_random)
val abc_1: TextView =  findViewById(R.id.text_time)
val abc_2: TextView =  findViewById(R.id.text_point)
val btn: Button =  findViewById(R.id.btn_main)


val random = Random()
val num = random.nextInt(1001)

또 저희가 isrunning 안 하다고 했죠? 이 거 지우겠습니다.

stage = 1 값으로 정해주겠습니다. 그럼 싹 가져와서 다시 확인해보겠습니다.

class MainActivity() : AppCompatActivity(){
    fun main() {
        setContentView(R.layout.activity_main)

        var timerTask: Timer? = null
        var stage = 1
        var sec : Int = 0

        val abc: TextView =  findViewById(R.id.text_random)
        val abc_1: TextView =  findViewById(R.id.text_time)
        val abc_2: TextView =  findViewById(R.id.text_point)
        val btn: Button =  findViewById(R.id.btn_main)

        val random = Random()
        val num = random.nextInt(1001)

        abc.text = ((num.toFloat())/100).toString()

이런 식으로 만들어졌습니다.

 

여기에 스테이지 1이기에, 버튼을 시작을 만들어 놓겠습니다.

btn.text = "시작"

아래 is 러닝을 다시 변경을 해서, 가지고 와보겠습니다.

btn.setOnClickListener {
    stage ++
    if (stage == 2) {
        timerTask = kotlin.concurrent.timer(period = 10) {
            sec++
            runOnUiThread {
                abc_1.text = (sec.toFloat()/100).toString()
            }
        }

버튼을 눌렀을 때잖아요? stage ++ 로 버튼을 누르면 스테이지가 올라가는 상태로 만들었습니다.

그리고 스테이지 2 상태입니다.

2일 때는 누르면 시간이 흘러가는 모습이잖아요?

여기에 추가를 해보겠습니다.

 

버튼을 "정지"로 변경되게 만들어 볼게요.

btn.text = "정지"

 

이걸 아래에 넣었습니다. 

그럼 보이는 텍스트가 정지로 되겠죠? 스테이지 2 상태일 때요.

 

스테이지 3 상태도 만들어 두겠습니다.

else if(stage == 3) {
    timerTask?.cancel()
    val point = (abs(sec-num).toFloat())/100
    abc_2.text = point.toString()
    btn.text = "다음"

전에 만들었던 것처럼, 결과같이 나오게 만들었습니다. 

단지 이것을 스테이지 3으로 만들었을 뿐이고, 버튼에 나오는 모습을 다음으로 변경했을 뿐입니다.

이제 완성했습니다.

class MainActivity() : AppCompatActivity(){
    fun main() {
        setContentView(R.layout.activity_main)

        var timerTask: Timer? = null
        var stage = 1
        var sec : Int = 0

        val abc: TextView =  findViewById(R.id.text_random)
        val abc_1: TextView =  findViewById(R.id.text_time)
        val abc_2: TextView =  findViewById(R.id.text_point)
        val btn: Button =  findViewById(R.id.btn_main)

        val random = Random()
        val num = random.nextInt(1001)

        abc.text = ((num.toFloat())/100).toString()
        btn.text = "시작"

        btn.setOnClickListener {
            stage ++
            if (stage == 2) {
                timerTask = kotlin.concurrent.timer(period = 10) {
                    sec++
                    runOnUiThread {
                        abc_1.text = (sec.toFloat()/100).toString()
                    }
                }
                btn.text = "정지"


            }  else if(stage == 3) {
                timerTask?.cancel()
                val point = (abs(sec-num).toFloat())/100
                abc_2.text = point.toString()
                btn.text = "다음"
            }}
    }


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

자 , 이제 한번 되는지 봐볼까요?

 

• 스테이지 1

스테이지 1 상태입니다.

스테이지 1에서 목푯값이 랜덤으로 나오고, 시작이라고 버튼이 변경이 되었습니다.

시작 버튼을 클릭해봅니다.

 

• 스테이지 2

스테이지 2 상태입니다.

버튼을 클릭하면 스테이지 2 상태로 넘어옵니다.

여기서 현재에는 숫자가 0.64로 나와있지만, 계속 흐르고 있는 상태입니다.

버튼은 정지를 누르게 나와있죠?

 

• 스테이지 3 상태

스테이지3 상태입니다. 한 번 더 버튼을 눌러서 넘기면 스테이지 3 상태가 됩니다.

현재 값이 고정이 되고, 현재와 목표 아래 숫자의 차이가 나옵니다.

그리고 텍스트는 다음으로 넘어가라고 나오는 것이죠.

 

지금까지 어플 만들기 stage 개념 도입. 중간 정리 (앱#15) 이었습니다.

안드로이드 스탑워치 숫자에서 내가 멈춘 숫자 빼기(앱#14)

안드로이드 스탑워치 숫자에서 내가 멈춘 숫자 빼기(앱#14)

안드로이드 코틀린 숫자 게임 만들기(앱만들기#13)

안드로이드 코틀린 숫자 게임 만들기(앱만들기#13)

안드로이드 코틀린 랜덤 숫자 만들기(앱만들기#12)

안드로이드 코틀린 랜덤 숫자 만들기(앱만들기#12)