• After 15+ years, we've made a big change: Android Forums is now Early Bird Club. Learn more here.

Apps ImageButton scaling changes layout width and height

I'm using an ImageButton to display a picture but since it's really small, I'm using the scaleX and scaleY attributes to make it a bit bigger. The problem is that for some reason, if I scale it, the button itself gets larger. I know this because my buttons have borders and are in a grid. When I scale it, it overlaps the adjacent buttons. I'm really not sure why. What did I do wrong or am I lacking something?

Original
http://imgur.com/NJ6UOO4

Scaled
http://imgur.com/QLgHlux
 
Last edited:

I don't think they address my present issue. The problem there was that the image didn't fit the button. My problem is that when I resize the image, the button itself changes. Here is the xml tag for that backspace ImageButton:
Code:
<ImageButton
                    android:id="@+id/arr"
                    android:layout_width="0dp"
                    android:layout_height="match_parent"
                    android:layout_weight="1"
                    android:background="@drawable/sp_calc_button"
                    android:onClick="btnClicked"
                    android:src="@drawable/backspace"
                    android:textColor="@color/btnFontColor"
                    android:scaleType="center"
                    android:typeface="sans"
                    android:scaleX="1.5"
                    android:scaleY="1.5"
                    android:padding="0dp"
                    android:layout_margin="0dp" />
 
Upvote 0
Oh, I think I see the problem now. I assumed scaleX and scaleY only resized the image contained in the ImageButton. However, it's meant to resize the ImageButton itself. I see now how those links are helpful. Thanks @LV426 ! :D
Now, I've stumbled across a different problem though. What I'm doing now is using fitCenter to make it take up the remainder of the space then using padding to add extra space as needed. My problem, however, is that the padding makes the button height and width change as well. I want the button's height and width to remain uniform as I'm aiming for a uniform grid of buttons.

Here is how it looks like without the padding:
http://imgur.com/vNTlBiH

With the padding:
http://imgur.com/jRvu40G

My xml tag:
Code:
<ImageButton
                    android:id="@+id/arr"
                    android:layout_width="0dp"
                    android:layout_height="match_parent"
                    android:layout_weight="1"
                    android:background="@drawable/sp_calc_button"
                    android:onClick="btnClicked"
                    android:src="@drawable/backspace"
                    android:textColor="@color/btnFontColor"
                    android:scaleType="fitCenter"
                    android:typeface="sans"
                    android:padding="20dp"
                    android:layout_margin="0dp" />
 
Upvote 0

BEST TECH IN 2023

We've been tracking upcoming products and ranking the best tech since 2007. Thanks for trusting our opinion: we get rewarded through affiliate links that earn us a commission and we invite you to learn more about us.

Smartphones