Loading images into scroll view causes images to go outside the scrollview

Question

I'm loading images dynamically from the Android Camera folder into a horizontal scroll view. The problem is that the scroll view has a huge space at the end of it (right side), as well as the images are being pushed off the screen in the front as I'm populating the scroll view (to the left). The more images being loaded in, the larger the gap at the end of the scroll view and the more images are being pushed off the front.

The xml is just a scroll view as the parent, and a linear layout as the child.

<HorizontalScrollView xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:tools="http://schemas.android.com/tools"
  android:id="@+id/scrollView1"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent"
  android:layout_gravity="center_horizontal" >
  <LinearLayout
    android:id="@+id/imageList"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center"
    android:orientation="horizontal" >
  </LinearLayout>
</HorizontalScrollView>

The code is using an asynctask to load the images in.

private class loadImages extends AsyncTask<Context, ImageView, Boolean> {
  @Override
  protected Boolean doInBackground(Context... params) {
    File sdCard = Environment.getExternalStorageDirectory();
    dir = new File(sdCard.getAbsolutePath() + "/DCIM/Camera");
    dir.mkdirs();
    ImageView gtbImage = null;

    if (dir.isDirectory()) {
      String[] children = dir.list();
      for (int i = 0; i < children.length; i++) {
          File imageLocation = new File(dir.getAbsolutePath() + "/" + children[i]);
          Bitmap myBitmap = decodeFile(imageLocation, 250, 250);

          gtbImage = new ImageView(getApplicationContext());
          gtbImage.setImageBitmap(myBitmap);
          imageList = (LinearLayout) findViewById(R.id.imageList);

          LinearLayout.LayoutParams p = new LinearLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT, Gravity.RIGHT);
          p.setMargins(5, 5, 5, 5);


          gtbImage.setLayoutParams(p);
          gtbImage.setPadding(1, 1, 1, 1);
          gtbImage.setBackgroundColor(Color.WHITE);
          gtbImage.setScaleType(ImageView.ScaleType.FIT_CENTER);
          publishProgress(gtbImage);
      }

    }

    return null;
  }

  protected void onProgressUpdate(ImageView... v) {
    imageList.addView(v[0]);
  }

Here is an image to better describe what the end of the scrollview looks like. Take note of the big blank spot at the end. The more images, the bigger that space grows.

enter image description here

Very baffled by this, I'm sure its something simple that I'm missing but after researching over and over again, I've hit a dead end and need a set of wiser eyes to take a look :)

What if you don't add padding and margins? If you have access to a Jellybean device (or emulator) you could enable the option "Show layout bounds" to see what's happening. — nhaarman, Mar 06 '13 at 21:45
@Niek commenting out p.setMargins(5, 5, 5, 5); and gtbImage.setPadding(1, 1, 1, 1); has the exact same result — Badams, Mar 06 '13 at 21:47

score 0 · Accepted Answer · edited May 23 '17 at 11:49

0

Try to remove the android:layout_gravity="center_horizontal" line in the HorizontalScrollView xml. I've had some similar issues a while back with that.

Instead, you should be able to use android:fillViewPort="true" on the HorizontalScrollView, as suggested here, or use both android:layout_gravity="center" and android:gravity="center" in your LinearLayout as suggested here.

edited May 23 '17 at 11:49

Community

1
1

answered Mar 06 '13 at 21:50

nhaarman

98,571
55
246
278

I removed the layout_gravity, and added fillViewport and the same issue still remains – Badams Mar 06 '13 at 21:57
UPDATE: I removed android:layout_gravity="center" from the LinearLayout and that fixed it. I dont fully understand WHY it fixed it, but your suggestions were key in getting it fixed! Thanks @Niek ! – Badams Mar 06 '13 at 22:03
Great! It indeed has something to do with centering something in the `ScrollView` that gives these strange problems. – nhaarman Mar 06 '13 at 22:10

Loading images into scroll view causes images to go outside the scrollview

1 Answers1