Как сделать пользовательские диалоги - PullRequest
0 голосов
/ 30 сентября 2019

У меня 9 imageButton в моем представлении активности, и они определены с помощью идентификаторов, таких как imageButton1 ~ imageButton9 Мне нужно создать dialog/alert/popup любой из них, чтобы показать более подробную информацию о каждой кнопке изображения.

Вопрос

Так как это моя самая первая попытка с android studio, и я читал документы и сообщения на некоторых веб-сайтах о диалогах, но это меня очень смущает, , поэтому вопрос в том, как мнесоздавать диалоги для каждого из кнопок изображения?

Код

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 элемента в каждом диалоге (разные данные для каждого изображения),

  1. Изображение
  2. Текст
  3. Воспроизвести звук Кнопка
  4. Кнопка закрытия диалога

Есть идеи?

Обновление

На основе приведенного ниже ответа приведены последние коды, которые у меня есть

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();
    }
}

Проблема

, когда я нажимаю на изображение, которое должно открыть этот диалог, мой экран становится пустыми вернуться к основному виду деятельности.

Идеи?

1 Ответ

1 голос
/ 30 сентября 2019

Попробуйте, ваши 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()
    }
}
...