[안드로이드 코틀린] 애니메이션 적용해서 주사위 던지는 방법

이번 시간에는 애니메이션(Animation)과 랜덤 숫자(Random)를 통해 주사위 던지는 방법을 알아보겠습니다. 

---

목차

1. 실행 화면
2. 메인 화면 activity_main.xml
3. 메인 코드 MainActivity.kt

---

1. 실행 화면

 

2. 메인 화면 activity_main.xml

 - 설명 -

 1. 무작위로 선택된 숫자 보여주는 TextView

 2. 무작위로 선택된 주사위 보여주는 TextView 

 3. 무작위 선택 기능 Button

 4. 이미지 res -> drawable

dice_five.png

0.00MB

dice_six.png

0.00MB

dice_four.png

0.00MB

dice_three.png

0.00MB

dice_two.png

0.00MB

dice_one.png

0.00MB

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

    <TextView
        android:id="@+id/resultText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="30sp"
        android:textStyle="bold"/>

    <ImageView
        android:id="@+id/diceImage"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="50dp"
        android:src="@drawable/dice_one"/>

    <Button
        android:id="@+id/rollBtn"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="50dp"
        android:text="던지기"
        android:textSize="25sp"/>
</LinearLayout>

 

3. 메인 코드 MainActivity.kt

 - 설명 -

 1.  (1..6).random()

  1 ~ 6 사이의 무작위 숫자 생성 

 2.  when(randomNum)

   조건문 랜덤 숫자에 따른 이미지 변수에 담기

 3. ObjectAnimator.ofFloat

   애니메이션 설정(뷰, 속성, 값... ) 

 4. animatorRotate.duration

   애니메이션 지속 시간(1000 = 1초)

 5. animatorRotate.start()

   애니메이션 실행

 6. 참조 사이트

https://developer.android.com/guide/topics/graphics/prop-animation?hl=ko 

속성 애니메이션 개요  |  Android 개발자  |  Android Developers

class MainActivity : AppCompatActivity() {

    lateinit var diceImage: ImageView
    lateinit var resultText: TextView

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

        diceImage = findViewById(R.id.diceImage)
        resultText = findViewById(R.id.resultText)

        val rollBtn: Button = findViewById(R.id.rollBtn)
        rollBtn.setOnClickListener {

            //주사위 던지기
            rollDice()
        }
    }

    //주사위 던지기
    private fun rollDice(){

        //랜덤수
        val randomNum: Int = (1..6).random()

        //랜덤 이미지
        val selectedImage = when(randomNum){

            1 -> R.drawable.dice_one
            2 -> R.drawable.dice_two
            3 -> R.drawable.dice_three
            4 -> R.drawable.dice_four
            5 -> R.drawable.dice_five
            else -> R.drawable.dice_six
        }

        //애니메이션(회전)
        val animationRotate: ValueAnimator = ObjectAnimator
            .ofFloat(diceImage, "rotation", 0f, 180f, 360f)

        //지속 시간(1000 = 1초)
        animationRotate.duration = 300
        animationRotate.start()

        //이미지 적용
        diceImage.setImageResource(selectedImage)

        resultText.text = "주사위 숫자: $randomNum"
    }

}

 

 

 

2022.08.19 - [안드로이드] - [안드로이드 코틀린] 속성 애니메이션 (이미지를 움직이게 하는 방법)

[안드로이드 코틀린] 속성 애니메이션 (이미지를 움직이게 하는 방법)

2022.08.25 - [안드로이드] - [안드로이드 코틀린] 동적 메뉴(ActionMode) 만드는 방법

[안드로이드 코틀린] 동적 메뉴(ActionMode) 만드는 방법

2022.06.20 - [안드로이드] - [안드로이드 코틀린] 밀어서 화면 변경 ViewPager2 갤러리 느낌으로 만드는 방법

[안드로이드 코틀린] 밀어서 화면 변경 ViewPager2 갤러리 느낌으로 만드는 방법