In diesem Artikel werden wir eine Anwendung erstellen, durch die ein Benutzer ein auf dem Bildschirm sichtbares Objekt gemäß seinen/ihren Fingerbewegungen auf dem Bildschirm bewegen kann. Berühren zum Ziehen/Verschieben von Objekten (wie Bild, Schaltfläche) ist in Spielen wie Jigsaw Puzzles sehr beliebt. Hier erstellen wir eine einfache Möglichkeit, ein Bild auf einem Gerätebildschirm zu berühren und zu ziehen, nachdem der Benutzer diese Aktion abgeschlossen hat. Das Bild hat eine neue Position auf dem Gerätebildschirm, indem Sie view onTouchListener verwenden . Ein Beispiel-GIF ist unten angegeben, um eine Vorstellung davon zu bekommen, was wir in diesem Artikel tun werden. Beachten Sie, dass wir dieses Projekt mit der  Kotlin -Sprache implementieren werden. 

Schritt für Schritt Umsetzung

Schritt 1: Erstellen Sie ein neues Projekt

Informationen zum Erstellen eines neuen Projekts in Android Studio finden Sie unter So erstellen/starten Sie ein neues Projekt in Android Studio . Beachten Sie, dass Sie Kotlin als Programmiersprache auswählen .

Schritt 2: Legen Sie ein beliebiges Bildobjekt im Layout fest

Navigieren Sie zu app > res > layout > activity_main.xml und fügen Sie den folgenden Code zu dieser Datei hinzu. Nachfolgend finden Sie den Code für die Datei  activity_main.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"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
  
    <RelativeLayout
        android:id="@+id/main"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent">
  
        <ImageView
            android:id="@+id/image"
            android:layout_width="100dp"
            android:layout_height="100dp"
            android:contentDescription="moving object"
            android:src="@drawable/gfg" />
  
    </RelativeLayout>
    
</androidx.constraintlayout.widget.ConstraintLayout>

Schritt 3: Arbeiten mit der Datei MainActivity.kt

Wechseln Sie zur Datei MainActivity.kt und beziehen Sie sich auf den folgenden Code. Unten ist der Code für die MainActivity.kt -Datei. Kommentare werden innerhalb des Codes hinzugefügt, um den Code genauer zu verstehen.

import android.annotation.SuppressLint
import android.os.Bundle
import android.view.MotionEvent
import android.view.View.OnTouchListener
import android.view.ViewGroup
import android.widget.ImageView
import android.widget.RelativeLayout
import android.widget.Toast
import androidx.appcompat.app.AppCompatActivity
  
class MainActivity : AppCompatActivity() {
    private lateinit var mainLayout: ViewGroup
    private lateinit var image: ImageView
  
    // default position of image
    private var xDelta = 0
    private var yDelta = 0
  
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        mainLayout = findViewById(R.id.main)
        image = findViewById(R.id.image)
  
        // returns True if the listener has 
        // consumed the event, otherwise False.
        image.setOnTouchListener(onTouchListener())
    }
  
    @SuppressLint("ClickableViewAccessibility")
    private fun onTouchListener(): OnTouchListener {
        return OnTouchListener { view, event ->
            // position information 
            // about the event by the user
            val x = event.rawX.toInt()
            val y = event.rawY.toInt()
            // detecting user actions on moving
            when (event.action and MotionEvent.ACTION_MASK) {
                MotionEvent.ACTION_DOWN -> {
                    val lParams = view.layoutParams as RelativeLayout.LayoutParams
                    xDelta = x - lParams.leftMargin
                    yDelta = y - lParams.topMargin
                }
                MotionEvent.ACTION_UP -> Toast.makeText(this,
                        "new location!", Toast.LENGTH_SHORT)
                        .show()
                MotionEvent.ACTION_MOVE -> {
                    // based on x and y coordinates (when moving image)
                    // and image is placed with it.
                    val layoutParams = view.layoutParams as RelativeLayout.LayoutParams
                    layoutParams.leftMargin = x - xDelta
                    layoutParams.topMargin = y - yDelta
                    layoutParams.rightMargin = 0
                    layoutParams.bottomMargin = 0
                    view.layoutParams = layoutParams
                }
            }
            // reflect the changes on screen
            mainLayout.invalidate() 
            true
        }
    }
}

Führen Sie nun die App aus.

Ausgabe: