在 Android 应用中将标签放在按钮顶部

Question

我正在尝试编写第一个 Android 应用程序，但遇到了以下问题。

这是一个处理一些按钮的循环：

   for (i in 0..7) {
        val btnID = resources.getIdentifier('N'.plus(i.toString()),"id",packageName)
        val imageBtn = findViewById<ImageButton>(btnID)
        imageBtn.setBackgroundColor(0x00)
        imageBtn.setOnClickListener {
            val result = Math.pow(2.toDouble(),i.toDouble()).toInt()
            val textView = findViewById<TextView>(R.id.textView2).apply {//
                text = result.toString()
            }
        }
        // Here I want to put a sticker: "Hi" on top of the button (imageBtn).
        .....
   }

上面的代码有效，按钮的行为符合我的预期。现在我想在每个按钮的顶部贴一个标签。我怎样才能做到这一点？我已经尝试了几十种方法，按照我在网上找到的示例代码，但没有任何效果。

下图更准确地说明了我的意思。

当然“Hi”不能成为按钮图像的一部分，因为我需要动态改变它。它以后可以变成“Ho”，“He”，“Pa”，……或者根据应用程序的状态。

Answer 1

希望这可能有用

 for (i in 0..7) {
        val btnID = resources.getIdentifier('N'.plus(i.toString()),"id",packageName)
        val imageBtn = findViewById<ImageButton>(btnID)
        imageBtn.setBackgroundColor(0x00)
        val result = Math.pow(2.toDouble(),i.toDouble()).toInt()
        imageBtn.setOnClickListener {
           
            val textView = findViewById<TextView>(R.id.textView2).apply {//
                text = result.toString()
            }
        }
        // Here I want to put a sticker: "Hi" on top of the button (imageBtn).
       imageBtn.text = result.toString()
   }

Answer 2

将此用于您的布局。

<RelativeLayout
       android:id="@+id/layoutButton"
       android:layout_width="60dp"
       android:layout_height="60dp">
    
       <ImageButton
           android:id="@+id/imgBtn"
           android:layout_width="match_parent"
           android:layout_height="match_parent" />
    
       <TextView
           android:layout_width="wrap_content"
           android:layout_height="wrap_content"
           android:text="Hi"
           android:layout_centerInParent="true"
           android:textSize="20sp" />
    
    
</RelativeLayout>

并根据需要给予 background ImageButton。

Answer 3

对于Constraintlayout使用这个。

<androidx.constraintlayout.widget.ConstraintLayout
        android:id="@+id/layoutButton"
        android:layout_width="60dp"
        android:layout_height="60dp">

        <ImageButton
            android:id="@+id/imgBtn"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Hi"
            android:textSize="20sp"
            app:layout_constraintBottom_toBottomOf="@+id/imgBtn"
            app:layout_constraintEnd_toEndOf="@+id/imgBtn"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="@+id/imgBtn" />


    </androidx.constraintlayout.widget.ConstraintLayout>

Answer 4

您可以使用简单的 Button 小部件代替 ImageButton，它具有 text 属性。要使按钮变圆，只需将可绘制的简单形状设置为背景即可。比如创建drawable circle.xml:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <solid android:color="@android:color/darker_gray"/>
</shape>

并在按钮小部件中使用它：

<Button
    ...
    android:background="@drawable/circle"
    .... />

Answer 5

由于我不得不花一些时间，而且这可能对其他人有用，所以我把我的解决方案放在这里。它现在完全符合我的要求。

这里是：

   for (i in 0..7) {
        val btnID = resources.getIdentifier('N'.plus(i.toString()),"id",packageName)
        val imageBtn = findViewById<ImageButton>(btnID)
        imageBtn.setBackgroundColor(0x00)
        imageBtn.setOnClickListener {
            val result = Math.pow(2.toDouble(),i.toDouble()).toInt()
            val textView = findViewById<TextView>(R.id.textView2).apply {//
                text = result.toString()
            }
        }
        setSticker(i,btnID)
   }


    fun setSticker(n:Int,btn:Int) {
        val label = TextView(this)
        label.id = View.generateViewId()

        label.text = "Hi"
        label.setTextColor(Color.rgb(0xFF,0xFF,0xFF))
        label.setTypeface(null, Typeface.BOLD)
        label.setTextSize(TypedValue.COMPLEX_UNIT_PX, 17.dpToPixels(this))
        label.elevation = 0.dpToPixels(this) // To make the label visible (i.e. on top)

        constraintLayout?.addView(label)
        val constrSet = ConstraintSet()
        constrSet.clone(constraintLayout)
        constrSet.connect(label.id, ConstraintSet.LEFT, btn, ConstraintSet.LEFT)
        constrSet.connect(label.id, ConstraintSet.RIGHT, btn, ConstraintSet.RIGHT)
        constrSet.connect(label.id, ConstraintSet.TOP, btn, ConstraintSet.TOP)
        constrSet.connect(label.id, ConstraintSet.BOTTOM, btn, ConstraintSet.BOTTOM)
        constrSet.applyTo(constraintLayout)
    }

在 Android 应用中将标签放在按钮顶部

Putting labels on top of buttons in an Android app

android

android-layout

kotlin

android-studio