Adjusting the size of an ImageButton in Android

You shouldn't use sp as a size dimension - dp should be used as it will help your view scale directly with different screen density and resolutions. See Here for dimensions.

padding will push other elements away from your view boundary. margin will push the contents of your view inward from the your boundary (ie would squash the available space for your picture) . The boundary is specified by height and width. Without more information I would guess you are being confused by your margins - delete them and experiment.

Also useful to you: android:scaleType="fitXY" makes the image stretch to match both the X and Y dimensions that are available to it. It helps you to see the canvas available to your image. Once you feel the area is large enough for a correctly scaled image change the scale type to centerInside. See Here for all scale types.


Set android:background instead of android:src to set the image on the button. This will adjust the image to your button's size. Then adjust the padding after.


Just had a play to try and understand your problem.

Seems ImageButton is a composite view which has a few pre-set values. Such as some sort of margin which you cannot override with the XML. If you cannot change your image to match what you want to happen then you are better to create your own composite view.

Here is my example of a composite view you can make yourself:

<FrameLayout android:layout_width="wrap_content" 
             android:layout_height="wrap_content">          
    <Button android:id="@+id/saveSearchButton"  
            android:layout_width="50dp"         
            android:layout_height="50dp" />
    <ImageView android:layout_width="45dp"  
               android:layout_height="45dp"
               android:scaleType="fitXY"
               android:src="@drawable/ic_menu_save" 
               android:layout_gravity="center"/>
</FrameLayout>

<FrameLayout android:layout_width="wrap_content" 
             android:layout_height="wrap_content">          
    <Button android:id="@+id/clearSearchButton"
            android:layout_width="50dp" 
            android:layout_height="50dp" />
    <ImageView android:layout_width="45dp"
               android:layout_height="45dp"
               android:scaleType="fitXY" 
               android:src="@drawable/ic_menu_close_clear_cancel" 
               android:layout_gravity="center"/>
</FrameLayout>      

And the original buttons:

<ImageButton android:id="@+id/imageButton1"  
             android:src="@drawable/ic_menu_save"               
             android:layout_height="45dp" android:layout_width="45dp"/>

<ImageButton android:id="@+id/imageButton2"
             android:src="@drawable/ic_menu_close_clear_cancel" 
             android:layout_height="45dp"
             android:layout_width="45dp"/>  

Here we can see custom image/button composite followed by the build in ImageButton as part of the SDK:

Example

Tags:

Android