Showing/Hiding ImageView in RelativeLayout

Question

I have a Relative Layout that has two children, an ImageView and a ProgressBar. While the image for the ImageView is loading I want to show the spinning progress bar, and once the image has finished I want to hide the progress bar and show the Image. I can never get the image to show up, but the progress bar shows just fine. I have verified that the image is being loaded, this seems like a layout issue but is beyond me...

this is my layout file

 <?xml version="1.0" encoding="utf-8"?>
    <RelativeLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center">
        <ImageView
            android:layout_width="110dp"
            android:layout_height="110dp"
            android:visibility="visible"/>
        <ProgressBar
            android:layout_width="110dp"
            android:layout_height="110dp"/>
    </RelativeLayout>

When Loading image...

final RelativeLayout relLayout = (RelativeLayout)convertView;
final ImageView imageView = (ImageView)relLayout.getChildAt(0);
final ProgressBar bar = (ProgressBar)relLayout.getChildAt(1);

bar.setIndeterminate(true);
bar.setVisibility(View.VISIBLE);
imageView.setVisibility(View.GONE);

And inside the onSuccess of my imageLoader

bar.setVisibility(View.GONE);
imageView.setVisibility(View.VISIBLE);
imageView.setImageBitmap(resizedBitmap);
relLayout.requestLayout(); // also tried invalidate(), and nothing at all

Help?

score 1 · Accepted Answer · edited May 23 '17 at 12:05

1

Just change

imageView.setVisibility(View.GONE);

with

imageView.setVisibility(View.INVISIBLE);

Also check this link.

edited May 23 '17 at 12:05

Community

1
1

answered Sep 24 '14 at 15:03

Batuhan Coşkun

2,961
2
31
48

this was actually the right answer... I was surprised. I was under the impression that setting it to INVISIBLE would still reserve layout space, which is why I went the GONE. As soon as I switched to INVISIBLE, I was able to hide/show a spinner or image easily – user2997084 Sep 25 '14 at 16:44
I have faced that problem once. I did that and problem solved. I do not understand why this solution downvoted. Weird people... – Batuhan Coşkun Sep 25 '14 at 17:46

score 0 · Answer 2 · answered Sep 24 '14 at 15:24

First in your XML put this line in your ImageView android:visibility="gone"

Then into your code use an asynkTask to show the progressBarr and when the download finish hide the proogressBar and show the ImageView

public void getImage(){
   new AsyncTask<Void, Void, Boolean>(){
      @Override
      protected Boolean doInBackground(Void... params){
         //Code to load image, take care don't change the UI because it can break the app
      }
      @Override
      protected void onProgressUpdate(Integer... values){
         //Here you can update your progressBar
      }
      @Override
      public void onPostExecute(Boolean result){
         //When the image finish the load here you can hide the progressBar and show the ImageView
        bar.setVisibility(View.INVISIBLE);
        imageView.setVisibility(View.VISIBLE);
      }
   }.execute();
}

I hope have helped

score 0 · Answer 3 · answered Sep 24 '14 at 18:45

Try to keep id for the views because when the item is being gone, then the position of the view will get changed
please try like this

Your Layout:
 <?xml version="1.0" encoding="utf-8"?>
    <RelativeLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center">
        <ImageView
            android:id="@+id/img_view"
            android:layout_width="110dp"
            android:layout_height="110dp"
            android:visibility="visible"/>
        <ProgressBar
            android:id="@+id/progress_bar"
            android:layout_width="110dp"
            android:layout_height="110dp"/>
    </RelativeLayout>

In your java class:

ImageView imgView = (ImageView)findviewbyId(R.id.img_view);
ProgressBar progressBar = (ProgressBar)findviewById(R.id.progress_bar);
imgView.setVisiblity(View.INVISIBLE);
progressBar.setIndeterminate(true);
In your oncomplete listener
imgView.setVisibility(View.VISIBLE);
progressBar.setVisibility(VIEW.INVISBLE);

Showing/Hiding ImageView in RelativeLayout

3 Answers3