Android - image view inside view pager issues

Question

I have an image view inside view pager to display some images coming from url as shown in the screen shot below,

enter image description here However, the image should be filled( should occupy the complete view pager space). But what is happening in my case is the image is displayed in center even though when i set layout params to fill parent.

my fragment where i return layout with image view:

ImageView image = new ImageView(getActivity());

        ImageLoader imgLoader = new ImageLoader(MainActivity.context);
        imgLoader.DisplayImage(imagePath, new Activity(), image);

        LinearLayout layout = new LinearLayout(getActivity());
        layout.setLayoutParams(new LayoutParams());

        layout.setGravity(Gravity.CENTER);
        layout.addView(image);

        return layout;

view pager:

<LinearLayout
            android:layout_width="match_parent"
            android:layout_height="225dp"
            android:background="@color/white"
            android:orientation="vertical" >

            <android.support.v4.view.ViewPager
                android:id="@+id/pager"
                android:layout_width="fill_parent"
                android:layout_height="0dp"
                android:layout_weight="1" />
        </LinearLayout>

when the image is still loading from url i ll show some progress like animation and once loaded i will set the image inside imageview

if (bitmap != null) {
                imageView.setBackgroundResource(0);
                imageView.setImageBitmap(bitmap);

            } else {
                imageView.setBackgroundResource(R.drawable.view_pager_progress);
                final AnimationDrawable startAnimation = (AnimationDrawable) imageView
                        .getBackground();
                imageView.setScaleType(ScaleType.CENTER);// i tried FIT_XY, dint work
                startAnimation.start();
            }

To summarize, what i want is, the image inside view pager should fill the complete space inside view pager both horizontally and vertically. Any idea how to do this?

Dear, how can you solve this? I have the same problem, but use coordinatorlayout with content... — Mateus, Jan 19 '16 at 11:20

score 6 · Accepted Answer · answered Apr 30 '13 at 11:08

6

Try to set ScaleType for you imageView to CENTER_CROP

imageView.setScaleType(CENTER_CROP)

Also, perhaps, you need to add some layout params when adding ImageView to LinearLayout

answered Apr 30 '13 at 11:08

Eugene Popovich

3,343
2
30
33

CENTER_CROP dint work, i even tried setting layout params for imageview. But no luck so far. – suresh cheemalamudi Apr 30 '13 at 11:12
Sorry to hear that. You need to use match parent layout params for both linear layout and image view inside your viewpager. The easiest way to achive this is to use xml layout resource. Then CENTER_CROP may help. – Eugene Popovich Apr 30 '13 at 11:27

score 1 · Answer 2 · answered Dec 06 '13 at 04:38

@suresh cheemalamudi in your above code you have given a height to your linear layout where your pager is located.Instead make it match parent.And the xml code should look like this below

   <android.support.v4.view.ViewPager
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/view_pager"
     android:layout_width="match_parent"
     android:layout_height="match_parent" />

and i your java code specify this way

  imageView.setScaleType(ImageView.ScaleType.CENTER_INSIDE);

score 0 · Answer 3 · answered Apr 30 '13 at 10:56

0

Try using:

image.setAdjustViewBounds(true);

answered Apr 30 '13 at 10:56

NoToast

98
5
15

Did it change anything at all? If not, make sure none of the paddings or margins of Views that are parents or adjacent to your imageView interfere with the layout you are trying to achieve. You could also try adding an imageView manually and see how it looks in the editor. – NoToast Apr 30 '13 at 11:02
here is complete xml code for the above activity. Do u think any problems in here? http://pastebin.com/7AAMWuvP – suresh cheemalamudi Apr 30 '13 at 11:05
FYI, this happens only in samsung galaxy s4, Rest of the devices it works fine. – suresh cheemalamudi Apr 30 '13 at 11:06

score 0 · Answer 4 · answered Aug 06 '14 at 09:22

OK. The solution which actually works is:

        ImageView imageView = new ImageView(context);
        imageView.setLayoutParams(new ViewGroup.LayoutParams(mScreenWidth, ViewGroup.LayoutParams.WRAP_CONTENT));
        imageView.setAdjustViewBounds(true);
        imageView.setScaleType(ImageView.ScaleType.FIT_CENTER);

        Drawable drawable = Drawable.createFromPath(Environment.getExternalStorageDirectory() + "/Android/data/" + getPackageName() + 
                "/"+....+".jpg");           
        if(drawable != null)                
            imageView.setImageDrawable(drawable);

        ((ViewPager) container).addView(imageView, 0);


<android.support.v4.view.ViewPager xmlns:android="http://schemas.android.com/apk/res/android"
   android:id="@+id/view_pager"
   android:layout_width="match_parent"
   android:layout_height="match_parent" 
   android:background="@android:color/black"
   />

Sorry I don't remember where I used it nor can I find it now. — Yar, Sep 28 '15 at 15:41

Android - image view inside view pager issues

4 Answers4