Android GridLayout - How to increase the spacing between columns or rows?

Question

This is just a portion of the background image. I have a gridlayout with 4 rows and 3 columns. These buttons in the layout (included just 3 for now) need to superimpose a background image which has a numeric keypad. I need to put the buttons exactly to fit these parts of image which have the numbers and will then make it transparent, so clicking on a number corresponds to clicking the actual button. Tried several methods but to no avail. I am not able to exactly fit them. Increasing the spacing between might help but just not able to get at it. Could someone please help? Thanks!

Answer 1

It will be exceedingly difficult to make sure the buttons fit the superimposed image exactly on devices with different screen sizes and different pixel densities. You are much better off having the user tap on the button itself. Use white for the text color and make a single rounded rectangle to use as the background of each button.

In src/main/res/drawable/orange_round_rect.xml:

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <corners android:radius="4dp" />
    <solid android:color="@color/orange_button" />
</shape>

Anything that isn't the button can be added elsewhere, e.g. as a background of the GridLayout.