Androidで画像を指に沿って移動し離したら元の位置に戻す

Androidでアニメーションを実装する必要が出てきた
そんなわけで今回は
指のドラッグにそって画像を動かし
指を話すと元の一に画像が戻る
そんなアニメーションを実装してみた

・解説
imageviewに対してsetOnTouchListenerをつける
ACTION_UPで元の位置に戻す
ACTION_DOWNで差分を計算
ACTION_MOVEで移動させる
アニメーションはViewPropertyAnimatorを使う
https://stackoverflow.com/questions/9398057/android-move-a-view-on-touch-move-action-move
https://qiita.com/ikemura23/items/7595a98c282eb3a9034d

・kotlin

class MainActivity : AppCompatActivity() {
    var dX = 0f
    var dY = 0f

    var initX: Float = 0f
    var initY: Float = 0f

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

        imageview.viewTreeObserver.addOnGlobalLayoutListener {
            initX = imageview.x
            initY = imageview.y
        }
        imageview.setOnTouchListener(View.OnTouchListener { view, event ->
            when (event.getAction()) {
                MotionEvent.ACTION_UP -> {
                    view.animate()
                        .x(initX)
                        .y(initY)
                        .setDuration(1000)
                        .start()
                }
                MotionEvent.ACTION_DOWN -> {
                    dX = view.x - event.getRawX()
                    dY = view.y - event.getRawY()
                }
                MotionEvent.ACTION_MOVE -> view.animate()
                    .x(event.getRawX() + dX)
                    .y(event.getRawY() + dY)
                    .setDuration(0)
                    .start()
                else -> false
            }
            true
        })
    }

    override fun onTouchEvent(event: MotionEvent): Boolean {
        Log.d("TouchEvent", "X:" + event.x + ",Y:" + event.y + "," + event.action)
        return true
    }
}

・xml

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

    <ImageView
        android:id="@+id/imageview"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@android:drawable/ic_lock_silent_mode_off"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        />

</androidx.constraintlayout.widget.ConstraintLayout>

Pocket

関連記事: