How to put an image in an AlertDialog? Android

Question

I don't know how to put an image into an AlertDialog.

I have this code, but i think this is not possible.

AlertDialog.Builder alert = new AlertDialog.Builder(MessageDemo.this);    
ImageView imageView = (ImageView) findViewById(R.id.imageView1);    
imageView.setImageResource(R.drawable.cw);             
alert.setView(imageView);    
alert.setNeutralButton("Here!", new DialogInterface.OnClickListener() {
    public void onClick(DialogInterface dlg, int sumthin) {

    }
});    
alert.show();

Niranj Patel · Accepted Answer · 2016-12-07T12:18:47.540

82

Create one sample.xml and add ImageView in that XML.

sample.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">


    <ImageView
        android:id="@+id/dialog_imageview"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/ic_launcher" />

</LinearLayout>

Java Code :

AlertDialog.Builder alertadd = new AlertDialog.Builder(MessageDemo.this);
LayoutInflater factory = LayoutInflater.from(MessageDemo.this);
final View view = factory.inflate(R.layout.sample, null);
alertadd.setView(view);
alertadd.setNeutralButton("Here!", new DialogInterface.OnClickListener() {
                public void onClick(DialogInterface dlg, int sumthin) {

                }
            });

alertadd.show();

edited Dec 07 '16 at 12:18

answered Jun 08 '11 at 09:17

Niranj Patel

32,980
10
97
133

1

it show me an error: Could not execute method of the activity – fr4n Jun 08 '11 at 09:38
Yes, your update. I have a new xml "sample.xml" with an image and a button. But it gives me an error. – fr4n Jun 08 '11 at 09:42
Outstanding! The image is left justifed, and I'm not very prolific with xml. How can I center the image horizontally? Thanks! – Larry Feldman Jan 15 '21 at 12:13

score 44 · Answer 2 · edited Jul 01 '16 at 07:18

44

You could do it in the following way. This will show an alertDialog with a message (if you don't need the message, just remove that line) and the image (and an OK button):

ImageView image = new ImageView(this);
image.setImageResource(R.drawable.YOUR_IMAGE_ID);

AlertDialog.Builder builder = 
        new AlertDialog.Builder(this).
        setMessage("Message above the image").
        setPositiveButton("OK", new OnClickListener() {                     
            @Override
            public void onClick(DialogInterface dialog, int which) {
                    dialog.dismiss();
            }
        }).
        setView(image);
builder.create().show();

edited Jul 01 '16 at 07:18

DerVO

3,679
1
23
27

answered Sep 19 '13 at 15:08

Miguel Rivero

1,436
14
11

8

How to move the message on bottom instead? – user2872856 Aug 18 '16 at 06:44
using positiveButton as bottom message – famfamfam Nov 06 '21 at 15:04
It worked, however it will crash on 2nd run with "The specified child already has a parent. You must call removeView() on the child's parent first.". To avoid this, need to add code on setNegativeButton. Check this https://stackoverflow.com/a/28071422/13299740 – Tieria Apr 20 '22 at 12:26

Juned · Answer 3 · 2021-09-01T15:33:01.257

There is an another option you can put an image in AlertDialog without creating an xml file.

    AlertDialog.Builder builder=new AlertDialog.Builder(DialogActivity.this);
    builder.setCancelable(true);
    builder.setIcon(R.drawable.your image name);
    builder.setTitle("Incoming Call");
    builder.setInverseBackgroundForced(true);
    builder.setPositiveButton("Accept",new DialogInterface.OnClickListener(){
        
        @Override
        public void onClick(DialogInterface dialog, int which){
            dialog.dismiss();
        }
    });
    builder.setNegativeButton("Reject",new DialogInterface.OnClickListener(){
        
        @Override
        public void onClick(DialogInterface dialog, int which){
            dialog.dismiss();
        }
    });
    AlertDialog alert=builder.create();
    alert.show();

I tried this but the icon doesn't show up...I used android built-in icon and I don't know what is the reason — Infinite Looper, Nov 25 '18 at 05:00
Just make sure icon path is correct. built in icon used to have different path I believe — Juned, Apr 20 '19 at 05:18

score 4 · Answer 4 · edited Jan 10 '19 at 00:34

4

For images I just do this:

public void onClick (View view) {
    new AlertDialog.Builder(this).setView(R.layout.your_layout).show();
}

edited Jan 10 '19 at 00:34

thesquaregroot

1,414
1
21
35

answered Oct 11 '16 at 02:35

Wallace Roberto

331
3
5

oiyio · Answer 5 · 2018-09-08T22:49:23.890

In addition to the other answers, i want to add the point that you should not be obliged to use AlertDialog. For example, in my case i want to show only imageView in a dialog and AlertDialog didn't worked for this case. The below solution worked for me :

LayoutInflater factory = LayoutInflater.from(context);
final View view = factory.inflate(R.layout.myphoto_layout, null);
Dialog dialog = new Dialog(context);
dialog.setContentView(view);
dialog.show();

myphoto_layout.xml :

<?xml version="1.0" encoding="utf-8"?>
<ImageView
    android:id="@+id/iv"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:src="@drawable/someImage" />

If you want to add image to your layout dynamically, you can use the below code :

ImageView iv = view.findViewById(R.id.iv); // id of your imageView element
iv.setImageBitmap(itmap);

score 1 · Answer 6 · edited Jan 14 '20 at 06:13

1

Try this method:

private void dialog() {
    AlertDialog.Builder alert = new AlertDialog.Builder(MainMenuActivity.this);
    LayoutInflater inflater = this.getLayoutInflater();
    View team = inflater.inflate(R.layout.image_layout, null);
    alert.setView(team);
    alert.show();
}

In addition, implement a layout named image_layout and put the desired UI elements into it.

edited Jan 14 '20 at 06:13

aboger

2,214
6
33
47

answered Jan 05 '20 at 16:34

Ahmer Afzal

11
4

Daniel Cettour · Answer 7 · 2022-09-28T14:09:26.917

In kotlin, just drag and drop a png file into "res" folder. In my case "res/drawable". Then, use this code:

    binding.myButton.setOnClickListener {
        val image = ImageView(requireContext()) 
        var myDialog: AlertDialog.Builder? = null
        image.setImageResource(R.drawable.my_png_file)
        myDialog = AlertDialog.Builder(
            requireContext(),
            R.style.AppCompatAlertDialogStyle
        )
        myDialog?.setTitle(getString(R.string.dialogTitle))
        myDialog?.setMessage(getString(R.string.dialogMessage))
        myDialog?.setPositiveButton(getString(R.string.closeDialog)) { dialog, _ ->
            dialog.dismiss()
        }
        myDialog?.setView(image)
        myDialog?.show()
}

The png file should already contain margins, so that the image doesn't stretch to the edges of the dialog. I used photoshop to shrink the image and create the margins (margins are represented in red below):

Result (notice the left and right margins)

How to put an image in an AlertDialog? Android

7 Answers7

Linked