Androidアプリ作成でのテキスト生成後のテキスト位置

Question

kotlinでAndroidアプリ作成しており、マッピングアプリを作成しようと思っています。
そこで、ボタンを押してテキストを追加生成したら、そのテキストを移動できるようにしたいと思っています。

テキストの追加と移動はできているのですが、ボタンを押してテキスト生成すると全てのテキスト位置が元に戻ってしまいます。
どうすればボタンを押してもテキストがその位置を維持した状態になりますか？

import android.os.Bundle
import android.view.MotionEvent
import android.view.View
import android.widget.TextView
import androidx.appcompat.app.AppCompatActivity
import com.example.mapping.databinding.ActivityMainBinding

class MainActivity : AppCompatActivity(), View.OnTouchListener{
    private lateinit var binding: ActivityMainBinding
    private var mappingText1 = "abc"
    private var oldX = 0F
    private var oldY = 0F
    private var addId = 1
    private lateinit var addItems: TextView

    //生成されるテキスト
    private fun getTextView(addId: Int): TextView {
        addItems = TextView(this).apply {
            id = addId
            text = id.toString()
            textSize = 50F
        }
        return addItems
    }

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        binding = ActivityMainBinding.inflate(layoutInflater)
        val view = binding.root
        setContentView(view)

        //ボタンを押してテキスト追加
        binding.button.setOnClickListener{
            //テキスト追加時にviewに個別のidを設定
            binding.constraint.addView(getTextView(addId))
            //追加したviewをaddItemsとして、リスナを設定
            addItems.setOnTouchListener(this)
            //ボタンを押した後、idの値をプラスしておく
            addId++
        }
    }

    override fun onTouch(v: View, event: MotionEvent): Boolean {
        var newX = event.x
        var newY = event.y

        when (event.action) {
            MotionEvent.ACTION_MOVE -> {
                var leftF = v.left + (newX - oldX)
                var topF = v.top + (newY - oldY)
                var left = leftF.toInt()
                var top = topF.toInt()

                v.layout(left, top, left + v.width, top + v.height)
                return true
            }
        }
        oldX = newX
        oldY = newY

        return true
    }

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:id="@+id/constraint"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:context=".MainActivity">
    <Button
            android:id="@+id/button"
            android:text="テキスト追加"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintBottom_toBottomOf="parent"
    />
</androidx.constraintlayout.widget.ConstraintLayout>

Answer 1

テキストを ConstraintLayout に追加していますが、ConstraintLayout は子ビューに設定された制約 (ボタンの app:layout_constraintStart_toStartOf="parent" など) に基づいてレイアウトを行うので、制約を設定しないと新しいテキストを追加した時にレイアウトのやり直しが起こって、初期位置に戻されてしまうのでしょう。

とりあえず以下のように変更して、テキストに制約を設定すれば期待する動きになると思いますが、本来ならばカスタム ViewGroup を作るべきな気が… (面倒くさいので、お勧めはしません)。

 // import 追加

+import android.view.ViewGroup.LayoutParams.WRAP_CONTENT
+import androidx.constraintlayout.widget.ConstraintLayout

 // onCreate メソッドで、テキスト追加時に ConstraintLayout.LayoutParams を設定

-            binding.constraint.addView(getTextView(addId))
+            val params = ConstraintLayout.LayoutParams(WRAP_CONTENT, WRAP_CONTENT)
+            params.leftToLeft = R.id.constraint
+            params.topToTop = R.id.constraint
+            params.leftMargin = 0
+            params.topMargin = 0
+            binding.constraint.addView(getTextView(addId), params)

 // onTouch メソッドで、テキストの移動は ConstraintLayout.LayoutParams の変更で行う

-                v.layout(left, top, left + v.width, top + v.height)
+                val params = v.layoutParams as ConstraintLayout.LayoutParams
+                params.leftMargin = left
+                params.topMargin = top
+                v.layoutParams = params

Comments

[fukumomo]

すごくわかりやすい解説ありがとうございます。
うまく行かない原因も理解できて、無事思っていた通りの動きになりました。
マッピングアプリを作る上での他の良いアプローチ方法が自分では思いつかないので、アドバイス頂いたカスタムViewGroupを作って進めていきたいと思います。

Answer 2

すごくわかりやすい解説ありがとうございます。
うまく行かない原因も理解できて、無事思っていた通りの動きになりました。
マッピングアプリを作る上での他の良いアプローチ方法が自分では思いつかないので、アドバイス頂いたカスタムViewGroupを作って進めていきたいと思います。