问题

Question

我的活动视图中有9个imageButton，它们是由ID定义的，例如imageButton1 ~ imageButton9，我需要分别创建dialog/alert/popup，以显示有关每个细节的更多信息图片按钮。

问题

因为这是我第一次尝试使用android studio，而且我也阅读了一些有关对话框的网站文章，但这对我来说却很混乱，所以，问题是我如何为每个imageButtons创建对话框？

代码

xml file

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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="wrap_content"
        android:layout_height="wrap_content"
        android:background="#00FFFFFF"
        android:drawingCacheQuality="high"
        tools:context=".ShapesActivity">

    <androidx.appcompat.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="?attr/colorPrimary"
            android:theme="@style/ThemeOverlay.AppCompat.ActionBar" />

    <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="65dp"
            android:orientation="horizontal"
            android:weightSum="3">

        <ImageButton
                android:id="@+id/imageButton1"
                android:layout_width="0dp"
                android:layout_height="146dp"
                android:layout_weight="1"
                android:background="#006B2D2D"
                android:contentDescription="@string/triangleDesc"
                android:scaleType="fitCenter"
                app:srcCompat="@drawable/triangle" />

        <ImageButton
                android:id="@+id/imageButton2"
                android:layout_width="0dp"
                android:layout_height="146dp"
                android:layout_weight="1"
                android:background="#006B2D2D"
                android:contentDescription="@string/trapezoidDesc"
                android:scaleType="fitCenter"
                app:srcCompat="@drawable/trapezoid" />

        <ImageButton
                android:id="@+id/imageButton3"
                android:layout_width="0dp"
                android:layout_height="146dp"
                android:layout_weight="1"
                android:background="#006B2D2D"
                android:contentDescription="@string/starDesc"
                android:scaleType="fitCenter"
                app:srcCompat="@drawable/star" />
    </LinearLayout>

    <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="210dp"
            android:orientation="horizontal"
            android:weightSum="3">

        <ImageButton
                android:id="@+id/imageButton4"
                android:layout_width="0dp"
                android:layout_height="146dp"
                android:layout_weight="1"
                android:background="#006B2D2D"
                android:contentDescription="@string/squareDesc"
                android:scaleType="fitCenter"
                app:srcCompat="@drawable/square" />

        <ImageButton
                android:id="@+id/imageButton5"
                android:layout_width="0dp"
                android:layout_height="146dp"
                android:layout_weight="1"
                android:background="#006B2D2D"
                android:contentDescription="@string/rectangleDesc"
                android:scaleType="fitCenter"
                app:srcCompat="@drawable/rectangle" />

        <ImageButton
                android:id="@+id/imageButton6"
                android:layout_width="0dp"
                android:layout_height="146dp"
                android:layout_weight="1"
                android:background="#006B2D2D"
                android:contentDescription="@string/octagonDesc"
                android:scaleType="fitCenter"
                app:srcCompat="@drawable/octagon" />
    </LinearLayout>

    <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="357dp"
            android:orientation="horizontal"
            android:weightSum="3">

        <ImageButton
                android:id="@+id/imageButton7"
                android:layout_width="0dp"
                android:layout_height="146dp"
                android:layout_weight="1"
                android:background="#006B2D2D"
                android:contentDescription="@string/heartDesc"
                android:scaleType="fitCenter"
                app:srcCompat="@drawable/heart" />

        <ImageButton
                android:id="@+id/imageButton8"
                android:layout_width="0dp"
                android:layout_height="146dp"
                android:layout_weight="1"
                android:background="#007E2F2F"
                android:contentDescription="@string/diamondDesc"
                android:scaleType="fitCenter"
                app:srcCompat="@drawable/diamond" />

        <ImageButton
                android:id="@+id/imageButton9"
                android:layout_width="0dp"
                android:layout_height="146dp"
                android:layout_weight="1"
                android:background="#00E040FB"
                android:contentDescription="@string/circleDesc"
                android:scaleType="fitCenter"
                app:srcCompat="@drawable/circle" />
    </LinearLayout>

</RelativeLayout>

kotlin file

import android.content.Intent
import android.os.Build
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.view.*
import androidx.appcompat.widget.Toolbar

class ShapesActivity : BaseActivity() {

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

        val toolbar = findViewById(R.id.toolbar) as Toolbar;
        setSupportActionBar(toolbar);

    //menu items actions
    override fun onCreateOptionsMenu(menu: Menu): Boolean {
        val inflater = menuInflater as MenuInflater
        inflater.inflate(R.menu.items, menu)
        return true
    }

    override fun onOptionsItemSelected(item: MenuItem) = when (item.itemId) {
        R.id.settings_page -> {
            if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.JELLY_BEAN) {
                val intent = Intent(this, SettingActivity::class.java);
                startActivity(intent);
            };
            true
        }

        else -> {
            // If we got here, the user's action was not recognized.
            // Invoke the superclass to handle it.
            super.onOptionsItemSelected(item)
        }
    }
}

逻辑

每个对话框中我需要有4个项目（每个imageButton的数据不同），

图片
文字
播放声音按钮
对话框关闭按钮

有什么主意吗？

更新

根据下面的答案，这里是我拥有的最新代码

dialog_custom.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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">

    <ImageView
        android:id="@+id/dialog_imageview"
        android:layout_width="294dp"
        android:layout_height="246dp"
        android:layout_alignParentStart="true"
        android:layout_alignParentTop="true"
        android:layout_alignParentEnd="true"
        android:layout_alignParentBottom="true"
        android:layout_centerInParent="true"
        android:layout_marginStart="68dp"
        android:layout_marginTop="274dp"
        android:layout_marginEnd="69dp"
        android:layout_marginBottom="270dp"
        android:foregroundGravity="center"
        tools:srcCompat="@tools:sample/avatars[0]" />

    <TextView
        android:id="@+id/tv_text"
        android:layout_width="298dp"
        android:layout_height="104dp"
        android:layout_alignParentStart="true"
        android:layout_alignParentTop="true"
        android:layout_alignParentEnd="true"
        android:layout_alignParentBottom="true"
        android:layout_marginStart="54dp"
        android:layout_marginTop="474dp"
        android:layout_marginEnd="59dp"
        android:layout_marginBottom="154dp"
        android:gravity="center_vertical"
        android:text="TextView"
        android:textAlignment="center"
        android:textSize="30sp" />

    <Button
        android:id="@+id/close_btn"
        style="@style/Widget.AppCompat.Button.Borderless"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:layout_alignParentEnd="true"
        android:layout_alignParentBottom="true"
        android:layout_marginStart="274dp"
        android:layout_marginTop="680dp"
        android:layout_marginEnd="70dp"
        android:layout_marginBottom="63dp"
        android:background="#F50057"
        android:gravity="center"
        android:text="Close"
        android:textAlignment="center"
        android:textColor="#FFFFFF" />

    <Button
        android:id="@+id/play_btn"
        style="@style/Widget.AppCompat.Button.Borderless"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:layout_alignParentEnd="true"
        android:layout_alignParentBottom="true"
        android:layout_marginStart="52dp"
        android:layout_marginTop="680dp"
        android:layout_marginEnd="292dp"
        android:layout_marginBottom="63dp"
        android:background="#00E676"
        android:gravity="center"
        android:text="Play"
        android:textAlignment="center" />
</RelativeLayout>

activity kotlin file

class BuildingsActivity : BaseActivity() {

    lateinit var mAdView : AdView;
    lateinit var context : Context

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


        // open dialog
        val imageButton1 = this.findViewById(R.id.imageButton1) as ImageButton;
        imageButton1.setOnClickListener() {
            openDialog();
        }

    }

    // button dialog
    public fun openDialog() {
        val dialog = Dialog(context)
        dialog.requestWindowFeature(Window.FEATURE_NO_TITLE)
        dialog.setContentView(R.layout.dialog_custom)

        val tv_text = dialog.findViewById(R.id.tv_text)as TextView
        val btn_close = dialog.findViewById(R.id.close_btn) as Button
        val btn_play = dialog.findViewById(R.id.play_btn) as Button
        val imageView = dialog.findViewById(R.id.dialog_imageview) as ImageView

        imageView.setImageResource(R.drawable.school) //set image here
        tv_text.setText("School")  // set description here


        //insert your button function here
        btn_close.setOnClickListener {
            fun onClick(v: View) {
                dialog.dismiss()
            }
        }

        btn_play.setOnClickListener {
            fun onClick(v: View) {
                val mp: MediaPlayer? = MediaPlayer.create(this, R.raw.a)
                mp?.start();
            }
        }

        dialog.show();
    }
}

问题

当我单击应该打开该对话框的图像时，我的屏幕变为空白并返回到主要活动。

想法？

Answer 1

尝试一下，您的btnclose和btnplay有不必要的代码

class MainActivity : AppCompatActivity() {

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

        var imageButton1 = findViewById(R.id.imageButton1) as ImageButton //add your imagebuttons here

        imageButton1.setOnClickListener { // provide/add setsetOnClickListener for all imagebutton 

            val description = imageButton1.getContentDescription().toString()
            val drawable = imageButton1.getDrawable()
            val mp = MediaPlayer.create(R.raw.imageButton1soundDialogCustom())

            openDialog(drawable, description, mp)
        }

    }

     fun openDialog(drawable: Drawable, description: String, mp: MediaPlayer ) {
        val dialog = Dialog(this@MainActivity)
        dialog.requestWindowFeature(Window.FEATURE_NO_TITLE)
        dialog.setContentView(R.layout.dialog_custom)

        val tvtext  = dialog.findViewById(R.id.tv_text)as TextView
        val btnclose = dialog.findViewById(R.id.close_btn) as Button
        val btnplay = dialog.findViewById(R.id.play_btn) as Button
        val imageView = dialog.findViewById(R.id.dialog_imageview) as ImageView

        imageView.setImageDrawable(drawable)//set image here
        tvtext.setText(description)

        btnclose.setOnClickListener {

                dialog.dismiss()

        }

        btnplay.setOnClickListener {

            val mp: MediaPlayer? = MediaPlayer.create(this, R.raw.a)
            mp?.start()
        }

         dialog.show()
    }
}

如何制作自定义对话框

问题

代码

逻辑

更新

问题

1 个答案: