Android: Images created by loop using ImageView in LinearLayout not rendering properly

Question

I have certain picture links in an array and I am displaying it by creating an ImageView for each picture in an array and placing it in a LinearLayout. This seems to work if there is only one or two picture in the array, but pictures are cutting off when there are more than two pictures. In addition, I also want to display images in their original sizes.

XML Code:

<LinearLayout
                android:id="@+id/child_2_5"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:gravity="center"
                android:padding="3dp"
                android:orientation="horizontal"
                android:layout_below="@+id/child_2_4">

</LinearLayout>

MainActivity.java Code:

LinearLayout layout = (LinearLayout) findViewById(R.id.child_2_5);
for(int i=0; i<values1.length; i++) {
    ImageView image = new ImageView(this);
    image.setLayoutParams(new android.view.ViewGroup.LayoutParams(450,450));
    Glide.with(Main2Activity.this).load(values1[i]).into(image); // I am using Glide to display images
    layout.addView(image);
}

Here values1 = [https://drive.google.com/uc?export=view&id=0B6uiOVPlyIu-dnlFdTlZQ1lFNDA, https://drive.google.com/uc?export=view&id=0B6uiOVPlyIu-bUI1ZV9wY0R3cTQ, https://drive.google.com/uc?export=view&id=0B6uiOVPlyIu-WFpXeWVlZ01zX2c]

This is how it is rendering:

As you can see edges are cutting and pictures are not in this original size.

This is how I want it to render:

You can use scaletype property for imageview to align itself in imageview. — Mohamed Mohaideen AH, Nov 11 '17 at 15:05

score 0 · Answer 1 · answered Nov 11 '17 at 15:19

0

You can use ScaleType Property for imageview.

Here is the list of scaletype https://developer.android.com/reference/android/widget/ImageView.ScaleType.html

Set scaletype in xml

<ImageView
 android:id="@+id/imgView"
 android:layout_width="150dp"
 android:layout_height="150dp"
 android:scaleType="centerInside"/>

Set Scalatype Programmatically

 imgView.setScaleType(ImageView.ScaleType.CENTER_INSIDE);

Set scaletype using Glide

Using glide you can use centerCrop or fitCenter.

Glide.with(Main2Activity.this).load(values1[i]).fitCenter().into(image);

For more info about glide image scaling have a look at this https://futurestud.io/tutorials/glide-image-resizing-scaling

answered Nov 11 '17 at 15:19

Mohamed Mohaideen AH

2,527
1
16
24

Thanks. Now, with `image.setLayoutParams(new android.view.ViewGroup.LayoutParams(450,450));` The output is as it is, but without `image.setLayoutParams(new android.view.ViewGroup.LayoutParams(450,450));`, only first picture is enlarged and displayed. – Beginner Nov 11 '17 at 15:43
Check out: https://drive.google.com/file/d/1j7AdmxDFyZSETC0e6rC_AN-nsmw22PPN/view?usp=sharing – Beginner Nov 11 '17 at 15:45
Try to reduce the size of image width(450,450) and check may be this taking full length of your width. – Mohamed Mohaideen AH Nov 11 '17 at 15:51
width(350, 350) reduces the size of pictures and seems to work, but this will fail if there are more than 3 images. fitCenter() does not have any effect. I want pictures to move down in the screen if they can't fit. – Beginner Nov 11 '17 at 15:58
fitCenter() property for imageview not for linearlayout. If you want picture align in more number of lines use grid view : https://developer.android.com/guide/topics/ui/layout/gridview.html.. Otherwise if you want to customize linear layout have a look at this solution : https://stackoverflow.com/a/6997048/4824088 – Mohamed Mohaideen AH Nov 12 '17 at 08:50

Android: Images created by loop using ImageView in LinearLayout not rendering properly

1 Answers1