How to Increase the size of Image View in Android

Question

I am working on a project that requires me to implement two horizontal scroll views with an image view in between them. I would like to extend the size of the image view to fill up the gap in between the scroll view. I went through the sample code, but it doesn't seem to mention anywhere in the size of the image view. I've enclosed the code below after the Image describing my problem.

enter image description here

public class Gallery2DemoActivity extends Activity {
private Gallery gallery,gallery1;
private ImageView imgView;

private Integer[] Imgid = {
    R.drawable.a_1, R.drawable.a_2, R.drawable.a_3, R.drawable.a_4, R.drawable.a_5, R.drawable.a_6, R.drawable.a_7
};

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

gallery = (Gallery) findViewById(R.id.examplegallery);
gallery.setAdapter(new AddImgAdp(this));

gallery1 = (Gallery)findViewById(R.id.examplegallery1);
gallery1.setAdapter(new AddImgAdp(this));

imgView = (ImageView)findViewById(R.id.ImageView01);    
imgView.setImageResource(Imgid[0]);


 gallery.setOnItemClickListener(new OnItemClickListener() {
    public void onItemClick(AdapterView parent, View v, int position, long id) {
        imgView.setImageResource(Imgid[position]); 
    }
});

}

public class AddImgAdp extends BaseAdapter {
int GalItemBg;
private Context cont;

public AddImgAdp(Context c) {
    cont = c;
    TypedArray typArray = obtainStyledAttributes(R.styleable.GalleryTheme);
    GalItemBg =  typArray.getResourceId(R.styleable.GalleryTheme_android_galleryItemBackground, 0);
    typArray.recycle();
}

public int getCount() {
    return Imgid.length;
}

public Object getItem(int position) {
    return position;
}

public long getItemId(int position) {
    return position;
}

public View getView(int position, View convertView, ViewGroup parent) {
    ImageView imgView = new ImageView(cont);

    imgView.setImageResource(Imgid[position]);
    imgView.setLayoutParams(new Gallery.LayoutParams(110, 100));
    imgView.setScaleType(ImageView.ScaleType.FIT_XY);
    imgView.setBackgroundResource(GalItemBg);

    return imgView;
}
}

This is my XML main file.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/LinearLayout01"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<Gallery
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/examplegallery"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content" />
<ImageView
    android:id="@+id/ImageView01"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" 
    android:layout_weight="1"/>
<Gallery
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/examplegallery1"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content" />
</LinearLayout>

Below is my Attributes file:

<?xml version="1.0" encoding="utf-8"?>
<resources>
<declare-styleable name="GalleryTheme">
    <attr name="android:galleryItemBackground" />
</declare-styleable>
</resources>

That is a beautiful descriptive picture that shows exactly what you want. I wish I saw that more often. (+1) — Fuzzical Logic, Jan 17 '12 at 09:06
thanks @Fuzzical Logic... I want the readers to understand my problem easier and reply will be better too :) — , Jan 17 '12 at 09:10
@Mansi: I've just added the Styleable attributes file. You may go through it. — , Jan 17 '12 at 09:19

score 4 · Accepted Answer · answered Jan 17 '12 at 09:17

4

Vinner,

The issue here is really two issues:

The size of the ImageView is based on the parent, which means that it shares its width and height.
The Image is resized to match the most limiting dimension (width).

The easiest way to handle this is to set the ScaleType of the ImageView. There are a number of Scaling Types, but the one you probably want is Center Crop. In code, this is done by view_name.setScaleType(ImageView.ScaleType.CENTER_CROP). You may also do this in XML for your ImageView with the attribute android:scaleType="centerCrop". Mind you, this will resize your Image and maintain your aspect ratio, but it will cut off the sides.

Just add the above attribute to your ImageView in your XML, (probably under your layout_weight), and it should do what you want.

Hope this helps,

FuzzicalLogic

answered Jan 17 '12 at 09:17

Fuzzical Logic

12,947
2
30
58

No problem. Take a look at all the ScaleTypes. They are actually pretty comprehensive. :) – Fuzzical Logic Jan 17 '12 at 09:26
Is it possible to achieve what I set out for, without cropping the image? – Jan 17 '12 at 09:42
Yes, *but* the image *will* be distorted and the aspect ratio will be different. Use a `scaleType` of `fitXY`. Heads up, it may be ugly... – Fuzzical Logic Jan 17 '12 at 09:50

score 1 · Answer 2 · answered Jan 17 '12 at 09:12

1

will you try below code... ?

?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/LinearLayout01"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<Gallery
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/examplegallery"
android:layout_width="fill_parent"
android:layout_height="wrap_content" android:layout_weight="1" />
<ImageView
android:id="@+id/ImageView01"
android:layout_width="fill_parent"
android:layout_height="0dp" 
android:src="@drawable/ic_launcher"
android:layout_weight="1"/>
<Gallery
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/examplegallery1"
android:layout_width="fill_parent"
android:layout_height="wrap_content" android:layout_weight="1"/>
</LinearLayout>

and if it do not work, try setting your gallery height to some dp, it will work.. Thanks

answered Jan 17 '12 at 09:12

AAnkit

27,299
12
60
71

I just thought about adding a gallery height to some hard coded value, but wouldn't that cause the app to work differently on various screen sizes? – Jan 17 '12 at 09:20
if you add height in dp, i dont think it will cause any problem.. have you tried above code.. I think it should work for you – AAnkit Jan 17 '12 at 09:24
Adding a layout_weight, caused the Horizontal and Image view to shrink in size. – Jan 17 '12 at 12:19
Because of your answer I was able to combine the code and get it to work. Thanks Ankit – Jan 17 '12 at 12:21
ya ,Most welcome, Will you please upload the working xml layout, in your question, it will help others with similar question, :) – AAnkit Jan 17 '12 at 12:29

score 0 · Answer 3 · answered May 31 '12 at 06:43

0

The size of the ImageView is based on the parent, which means that it shares its width and height. Also, the Image is resized to match the most limiting dimension (width).

answered May 31 '12 at 06:43

Adrian Monk

1,061
9
17

AJcodez · Answer 4 · 2012-01-17T09:31:18.193

It looks like in the AddImgAdp class, you set the ImageView's height and width to specific pixel sizes.

imgView.setLayoutParams(new Gallery.LayoutParams(110, 100)); //width = "110px", height="100px"

I personally would put the layout as a RelativeLayout, align the first gallery with the top, the second gallery with the bottom, nd have the ImageView set to align above the second gallery. Then make the image:

imgView.setLayoutParams( new Gallery.LayoutParams(
   Gallery.LayoutParams.FILL_PARENT, 
   Gallery.LayoutParams.FILL_PARENT) );

If you set the ImageView to fill_parent with a LinearLayout, it will fill to the bottom of the screen and the second gallery will be off the screen.

Also know that by filling in all the space you will most likely distort the picture. Consider all of your resizing options: http://developer.android.com/reference/android/widget/ImageView.ScaleType.html

How to Increase the size of Image View in Android

4 Answers4

Linked