Android - set imageView inside DialogFragment

Question

I have an application wherein I have a custom listView, upon clicking any item in the listView, a DialogFramgent is shown. Now, what I want to do is to set the imageView I have inside that DialogFramgent to an image in the external storage. I know that I can set the source of the imageView as such:

File imgFile = new  File(“/sdcard/Images/test_image.jpg”);
if(imgFile.exists()){

    Bitmap myBitmap = BitmapFactory.decodeFile(imgFile.getAbsolutePath());

    ImageView myImage = (ImageView) findViewById(R.id.imageViewItem);
    myImage.setImageBitmap(myBitmap);

}

However, I couldn't initialize my ImageView variable properly because findViewById gives an error: `The method findViewById(int) is undefined for type ItemDialog.

Here is the part in my custom listView onClickLisenter where I call my DialogFragment:

resultListView.setOnItemClickListener(new OnItemClickListener() {
    @Override
    public void onItemClick(AdapterView<?> a, final View v, final int position, long id) {

        positionSelected = position;

        SearchResultListViewItem selectedRow = results.get(position);
        String selectedItem = selectedRow.getItemName();
        itemBarcode = selectedRow.getBarcode();

        itemListDB.open();

        ItemDialog itemDialog = new ItemDialog();

        itemDialog.itemName = selectedItem;
        itemDialog.brandName = itemListDB.getBrandFromItemBarcode(itemBarcode);
        itemDialog.UOMName = itemListDB.getUOMFromItemBarcode(itemBarcode);
        itemDialog.priceName = itemListDB.getPriceFromItemBarcode(itemBarcode);
        itemDialog.discountName = itemListDB.getDiscountFromItemBarcode(itemBarcode);
        itemDialog.mListener = SearchResult.this;

        itemDialog.qtyFromList = qtyInput.get(position);
        itemDialog.discFromList = qtyInput.get(position);

        itemListDB.close();
        itemDialog.show(getFragmentManager(), "");

    }
});

and here is my ItemDialog class:

public class ItemDialog extends DialogFragment implements OnClickListener{

    //my variables go over here

    public interface onSubmitListener {
        void setOnSubmitListener(String qty, String disc);  
    }  

    @Override  
    public Dialog onCreateDialog(Bundle savedInstanceState) {  

        final Dialog dialog = new Dialog(getActivity());  
        dialog.getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,  
                WindowManager.LayoutParams.FLAG_FULLSCREEN);  

        dialog.setContentView(R.layout.fragment_item_dialog);  
        setStyle(DialogFragment.STYLE_NORMAL, R.style.MyDialog);

        File imgFile = new  File("/sdcard/Images/test_image.png");
        if(imgFile.exists()){

            Bitmap myBitmap = BitmapFactory.decodeFile(imgFile.getAbsolutePath());

            ImageView myImage = (ImageView) findViewById(R.id.imageViewItem);
            myImage.setImageBitmap(myBitmap);

        }

        dialog.setTitle("Item Details");
        dialog.show();  
        //I set more variables here       
        return dialog;  
    }       

}

So, does anyone have an idea on how to set the source image of an imageView that's inside a DialogFragment? I'm stuck here and frankly, I have no idea how to proceed and I'll be really grateful if anyone can help me.

Thank you.

Answer 1

You need to inflate layout in your Dialog Fragment under onCreateDialog(...)

  LayoutInflater layoutInflater = (LayoutInflater) getActivity()
         .getSystemService(Context.LAYOUT_INFLATER_SERVICE);

  View layout2 = layoutInflater.inflate(R.layout.contact_filter_popup,null);

  dialog.setView(layout2);

and then reference your Imageview with that particular layout

   ImageView img=(ImageView)layout2.findViewById(R.id.imageViewItem);

Update:

@Override  
public Dialog onCreateDialog(Bundle savedInstanceState) {  

    final Dialog dialog = new Dialog(getActivity());  

    dialog.getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,  
            WindowManager.LayoutParams.FLAG_FULLSCREEN);  


     LayoutInflater layoutInflater = (LayoutInflater) getActivity()
         .getSystemService(Context.LAYOUT_INFLATER_SERVICE);

    View layout2 = layoutInflater.inflate(R.layout.contact_filter_popup,null);
    dialog.setContentView(layout2);  

    setStyle(DialogFragment.STYLE_NORMAL, R.style.MyDialog);

    ImageView myImage = (ImageView) layout2.findViewById(R.id.imageViewItem);

    File imgFile = new  File("/sdcard/Images/test_image.png");

    if(imgFile.exists()){

        Bitmap myBitmap = BitmapFactory.decodeFile(imgFile.getAbsolutePath());
        myImage.setImageBitmap(myBitmap);

    }

    dialog.setTitle("Item Details");
    dialog.show();  

    return dialog;  
}       

Answer 2

try to override the onCreateView() callback method, as a fragment, DialogFragment can be inflated with this method so you can later inlfate your layout and finding the imageview reference.

Answer 3

The problem is due to the lifecycle mismatch. In a dialog fragment when the dialog is created it doesn't mean the views are created. This will result in IllegalArgumentException due to fragment not attached to Activity. To overcome this always use/access your views after the views are inflated in the onViewsCreated()/onCreateViews() method. Find my solution below which works fine.

public class ImageDetailDialog extends DialogFragment implements OnClickListener{

    private String url ;

    private ImageView imgProdDetail;


    /* (non-Javadoc)
     * @see android.support.v4.app.DialogFragment#onCreate(android.os.Bundle)
     */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        url = getArguments().getString("url");
        setStyle(DialogFragment.STYLE_NO_TITLE, R.style.product_dialog);
    }

    /* (non-Javadoc)
     * @see android.support.v4.app.Fragment#onCreateView(android.view.LayoutInflater, android.view.ViewGroup, android.os.Bundle)
     */
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
            Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.image_detail_dialog, null);
        imgProdDetail = (ImageView)view.findViewById(R.id.img_prod_detail);
        view.setOnClickListener(this);
        return view;
    }

    /* (non-Javadoc)
     * @see android.support.v4.app.Fragment#onViewCreated(android.view.View, android.os.Bundle)
     */
    @Override
    public void onViewCreated(View view, Bundle savedInstanceState) {
        super.onViewCreated(view, savedInstanceState);

            /** Decode/load YOUR IMAGE HERE **/
        imgProdDetail.setImageResource(R.drawable.image);
    }

    /* (non-Javadoc)
     * @see android.support.v4.app.DialogFragment#onCreateDialog(android.os.Bundle)
     */
    @Override
    public Dialog onCreateDialog(Bundle savedInstanceState) {
        Dialog dialog = super.onCreateDialog(savedInstanceState);
        dialog.getWindow().requestFeature(Window.FEATURE_NO_TITLE);
        //not working
        dialog.setCanceledOnTouchOutside(true);
        return dialog;
    }

    /* (non-Javadoc)
     * @see android.view.View.OnClickListener#onClick(android.view.View)
     */
    @Override
    public void onClick(View v) {
        if(v!=imgProdDetail)
            this.dismissAllowingStateLoss();
    }

}

Answer 4

Fragments do not have the findViewById method, you can call it on the getView() method of th fragment:

  File imgFile = new  File(“/sdcard/Images/test_image.jpg”);
  if(imgFile.exists()){
    Bitmap myBitmap = BitmapFactory.decodeFile(imgFile.getAbsolutePath());
    ImageView myImage = (ImageView) getView().findViewById(R.id.imageViewItem);
    myImage.setImageBitmap(myBitmap);
  }

I assume you already have inflated the corresponding view of the DialogFragment.

For more information: http://developer.android.com/reference/android/app/Fragment.html#getView()