Zahid H
Zahid H

Reputation: 245

Use LinearLayout to display multiple images

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

Upvotes: 0

Views: 1543

Answers (4)

Pankaj Zanzane
Pankaj Zanzane

Reputation: 1242

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);
    }

    } 

Upvotes: 1

Pankaj Zanzane
Pankaj Zanzane

Reputation: 1242

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);
            }

Upvotes: 2

Woody
Woody

Reputation: 1599

For your first question, check this: dimens

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

Upvotes: 1

Oscar Rene
Oscar Rene

Reputation: 361

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.

Upvotes: 1

Related Questions