Android - Image Button Scale

Question

I am trying to fit an image inside an ImageButton for testing but the way the ImageButtonbehaves is not as expected.

initially, I made a

Answer 1

That's a good try, you are trying to go deeper into the android implementations.

Ans #3:

At first providing exact size as height and width is not a good practice in android. If you wish to know why, the reason would be simply it will try to squeeze/expand the image to the size specified by you in the height and width params. Always wrap_content is the preferred Parameter so that the OS will automatically adjust depending upon the screen size.Hence you need to modify as:

<ImageButton
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:id="@+id/ibTest"
    android:src="@drawable/image_top_test"
    android:layout_centerHorizontal="true"
    android:adjustViewBounds="true"
    android:cropToPadding="false"
    android:layout_below="@+id/hlTopBar"
    android:background="#00000000"
    android:scaleType="fitXY" />

Ans #1 :

Why does the ImageButton make an image as big as this so small, when it could fill most of the screen, even with the ImageButton size being very wide?

The answer is is similar to the above mentioned. Your Image size will be much lesser than that the Android OS calculated depending on your mentioned size, taking device resolution into consideration. Use the http://coh.io/adpi/ (or http://density.brdrck.me/) site to make it simple to calculate. Always take the mdpi as standard or base. Suppose your image size is 988X89 in mdpi, it will be:

Now, it is as if you are trying to view an image of 988px X 89px on an xhdpi screen where the Android Os calculated the image size as 1976px X 178px, which is way larger than your given image size of 988px X 89px. that's why you get small image with most area white.

How to correct it? Go through the Android specifications to support different densities screens. this requires you to design images specifically for hdpi, mdpi, xhdpi and put them in appropriate folders of:

 MyProject/
     res/
       drawable-xhdpi/
           awesomeimage.png
       drawable-hdpi/
           awesomeimage.png
       drawable-mdpi/
           awesomeimage.png
       drawable-ldpi/
           awesomeimage.png

Ref : http://developer.android.com/training/multiscreen/screendensities.html for more details

Answer 2

You should also check if there is any padding set around your imageButton, I created one that looked very similar to use and although fitXY worked, changing the size of the image became very confusing error-prone. However I then realized that there was 100p padding around all of the image hence the border being 100 dp away at each edge of the image.

Answer 3

On activity Creat..you can get the screen resolution...and resize the image according to the screen Widht and Height..and set the image ..In this way your ratio will be same on every type of devices ..

to resize images..: 1. Get screen width and height 2.resize image acording to screen resolution 3.set Image to the view