Use LinearLayout to display multiple images

Question

Trying to set the Image on a Image View where it will stretch the image based on the screen size and will also auto fit the images so it doesn't go beyond the screen.

My MainActivity:

package com.example.testting;

import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.RelativeLayout;
import android.widget.RelativeLayout.LayoutParams;

public class MainActivity extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);

        LinearLayout ll = (LinearLayout) findViewById(R.id.llLayout);
        for(int i=0;i<10;i++)
        {
                LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(R.dimen.num_icon, R.dimen.num_icon);
                ImageView ii= new ImageView(this);
                ii.setBackgroundResource(R.drawable.apple);
                ii.setLayoutParams(layoutParams);
                ll.addView(ii);
        }
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.main, menu);
        return true;
    }

}

My XML:

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".MainActivity"
    android:id="@+id/llLayout"
    android:orientation="horizontal"
    android:gravity="center" >

</LinearLayout>

My res/values/dimens file for standard phone screen:

<resources>

    <!-- Default screen margins, per the Android Design guidelines. -->
    <dimen name="activity_horizontal_margin">16dp</dimen>
    <dimen name="activity_vertical_margin">16dp</dimen>
        <dimen name="num_icon">55dp</dimen>

</resources>

My res/values/dimens file for 7" screen:

<resources>

    <!--
         Customize dimensions originally defined in res/values/dimens.xml (such as
         screen margins) for sw600dp devices (e.g. 7" tablets) here.
    -->

    <dimen name="num_icon">110dp</dimen>

</resources>

My res/values/dimens file for 10" screen:

<resources>

    <!--
         Customize dimensions originally defined in res/values/dimens.xml (such as
         screen margins) for sw720dp devices (e.g. 10" tablets) here.
    -->

    <dimen name="num_icon">160dp</dimen>

</resources>

It is supposed display 10 images using the dimension XML but it's not. I am seeing the following: enter image description here

score 2 · Answer 1 · answered Aug 26 '13 at 15:20

Keep your llLayout orientation to vertical

LinearLayout ll = (LinearLayout) findViewById(R.id.llLayout);
            for(int i=1;i<=10;i++)
            {
                LinearLayout linear=null;
                if(i/5==0){

                    if(linear!=null){

                        LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT);
                        ll.addView(linear,layoutParams);
                    }
                    linear = new LinearLayout(this);
                    linear.setOrientation(LinearLayout.HORIZONTAL);
                }
               LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams((int)getResources().getDimension(R.dimen.test), (int)getResources().getDimension(R.dimen.test));

                ImageView ii= new ImageView(this);
                ii.setBackgroundResource(R.drawable.ic_launcher);
                ii.setLayoutParams(layoutParams);
                linear.addView(ii);
            }

I am trying to do horizontal. And your code works except the screen displays 6 icon and I don't see the rest :/ — Zahid H, Aug 26 '13 at 15:52
For `if(linear!=null){ LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT); ll.addView(linear,layoutParams); }` Eclipse tells me: `Dead code` — Zahid H, Aug 26 '13 at 15:53

score 1 · Answer 2 · answered Aug 26 '13 at 15:10

1. R.dimen.some_value should contain the dimens defined in your res/values-XxXX folder.

2. I'm not sure what you mean about adding an image in the next line, but you could try using a RelativeLayout instead, childs of RelativeLayout can be positioned relative to other views using the properties like android:layout_above, android:layout_below, etc.

score 1 · Answer 3 · edited May 23 '17 at 11:53

1

For your first question, check this: dimens

And as for the second question, check this: line break

edited May 23 '17 at 11:53

Community

1
1

answered Aug 26 '13 at 15:19

Woody

1,589
14
16

Please update your answer to contain the content of what you are posting to. If the links you are pointing to go dead, your answer is useless. – Josh Mein Sep 05 '13 at 16:04

score 1 · Answer 4 · answered Aug 27 '13 at 06:49

Try this out This shows 5 images in row each row

LinearLayout ll = (LinearLayout) findViewById(R.id.llLayout);
    LinearLayout linear=new LinearLayout(this);
    for(int i=0;i<=10;i++)
    { 

            if(i%5==0){

                LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT);
                ll.addView(linear,layoutParams);
                linear = new LinearLayout(this);
                linear.setOrientation(LinearLayout.HORIZONTAL);
            }            
       LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams((int)getResources().getDimension(R.dimen.test), (int)getResources().getDimension(R.dimen.test));

        ImageView ii= new ImageView(this);
        ii.setBackgroundResource(R.drawable.ic_launcher);
        ii.setLayoutParams(layoutParams);
        linear.addView(ii);
    }

    }

So keep the `llLayout` as vertical or horizontal? – Zahid H Aug 27 '13 at 13:54 — Zahid H, Aug 27 '13 at 13:54
llLayout orientation to vertical – Pankaj Aug 28 '13 at 06:42 — Pankaj, Aug 28 '13 at 06:42

Use LinearLayout to display multiple images

4 Answers4