Home » Android » java – How to remove padding around buttons in Android?

java – How to remove padding around buttons in Android?

Posted by: admin March 10, 2020 Leave a comment

Questions:

In my Android app, I have this layout:

<?xml version="1.0" encoding="utf-8" ?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:orientation="vertical">

    <fragment
         android:id="@+id/map"
         android:layout_width="match_parent"
         android:layout_height="0dp" 
         android:layout_weight="1" 
         class="com.google.android.gms.maps.SupportMapFragment"/>

    <Button
        android:id="@+id/button_back"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:onClick="CloseActivity"
        android:padding="0dp"
        android:text="@+string/back" />

</LinearLayout>

In the preview and on the phone, it looks like:

As you can see on the button in the bottom area, there is some padding there.

How can I get rid of that, and let the button fully fill the bottom area?

How to&Answers:

For me the problem turned out to be minHeight and minWidth on some of the Android themes.

On the Button element, add:

<Button android:minHeight="0dp" android:minWidth="0dp" ...

Or in your button’s style:

<item name="android:minHeight">0dp</item>
<item name="android:minWidth">0dp</item>

Answer:

That’s not padding, it’s the shadow around the button in its background drawable. Create your own background and it will disappear.

Answer:

My solution was set to 0 the insetTop and insetBottom properties.

<android.support.design.button.MaterialButton
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:insetTop="0dp"
        android:insetBottom="0dp"
        android:text="@string/view_video"
        android:textColor="@color/white"/>

Answer:

A workaround may be to try to use -ve values for margins like following:

<Button
    android:id="@+id/button_back"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:onClick="CloseActivity"
    android:padding="0dp"
    android:layout_marginLeft="-5dip"
    android:layout_marginRight="-5dip"
    android:layout_marginTop="-5dip"
    android:layout_marginBottom="-5dip"
    android:text="@string/back" />

It will make that space vanish. I mean you can choose the appropriate dip value, which makes it go away. It worked for me. Hope it works for you.

Answer:

For removing padding around toggle button we need set minWidth and minHeight 0dp.android:minWidth="0dp" android:minHeight="0dp"

  <ToggleButton
        android:id="@+id/toggle_row_notifications"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:minWidth="0dp"
        android:minHeight="0dp"
        android:layout_alignParentRight="true"
        android:layout_centerVertical="true"
        android:padding="@dimen/_5sdp"
        android:textOn=""
        android:textOff=""
        android:background="@android:color/transparent"
        android:button="@drawable/toggle_selector"
        />

set your drawable file to button attribute like: android:button="@drawable/toggle_selector"

Below is my toggle_selecter.xml file

<?xml version="1.0" encoding="utf-8"?>
     <selector xmlns:android="http://schemas.android.com/apk/res/android">
            <item android:drawable="@drawable/notifications_toggle_on" 
                  android:state_checked="true"/>
            <item android:drawable="@drawable/notifications_toggle_off" 
                  android:state_checked="false"/>
     </selector>

Answer:

I am new to android but I had a similar situation. I did what @Delyan suggested and also used android:background=”@null” in the xml layout file.

Answer:

In the button’s XML set android:includeFontPadding="false"

Answer:

I had the same problem and it seems that it is because of the background color of the button. Try changing the background color to another color eg:

android:background="@color/colorActive"

and see if it works. You can then define a style if you want for the button to use.

Answer:

It’s not a padding but or the shadow of the background drawable or a problem with the minHeight and minWidth.

If you still want the nice ripple affect, you can make your own button style using the ?attr/selectableItemBackground:

<style name="Widget.AppTheme.MyCustomButton" parent="Widget.AppCompat.Button.Borderless">
    <item name="android:minHeight">0dp</item>
    <item name="android:minWidth">0dp</item>
    <item name="android:layout_height">48dp</item>
    <item name="android:background">?attr/selectableItemBackground</item>
</style>

And apply it to the button:

<Button 
    style="@style/Widget.AppTheme.MyCustomButton"
    ... />

Answer:

It doesn’t seem to be padding, margin, or minheight/width.
Setting android:background="@null" the button loses its touch animation, but it turns out that setting the background to anything at all fixes that border.


I am currently working with:

minSdkVersion 19
targetSdkVersion 23

Answer:

Give your button a custom background: @drawable/material_btn_blue

Answer:

You can also do it with layout_width(height) parameters.

E.g. I have deleted top and bottom space with android:layout_height="18dp" code.

Answer:

A standard button is not supposed to be used at full width which is why you experience this.

Background

If you have a look at the Material Design – Button Style you will see that a button has a 48dp height click area, but will be displayed as 36dp of height for…some reason.

This is the background outline you see, which will not cover the whole area of the button itself.
It has rounded corners and some padding and is supposed to be clickable by itself, wrap its content, and not span the whole width at the bottom of your screen.

Solution

As mentioned above, what you want is a different background. Not a standard button, but a background for a selectable item with this nice ripple effect.

For this use case there is the ?selectableItemBackground theme attribute which you can use for your backgrounds (especially in lists).
It will add a platform standard ripple (or some color state list on < 21) and will use your current theme colors.

For your usecase you might just use the following:

<Button
    android:id="@+id/sign_in_button"
    style="?android:attr/buttonBarButtonStyle"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:text="Login"
    android:background="?attr/selectableItemBackground" />
                   <!--  /\ that's all -->

There is also no need to add layout weights if your view is the only one and spans the whole screen

If you have some different idea on what your background should look like you have to create a custom drawable yourself, and manage color and state there.

This answer copied from Question: How to properly remove padding (or margin?) around buttons in Android?

Answer:

After hours of digging around multiple answers I finally found a solution that doesn’t use a different element, manipulate minHeight or minWidth, or even wrapping Button around a RelativeLayout.

<Button
    android:foreground="?attr/selectableItemBackground"
    android:background="@color/whatever" />

The main takeaway here is the setting of the foreground instead of background as many of the answers stipulate. Changing the background itself to selectableItemBackground will just overwrite any changes you made to the button’s color/background, if any.

Changing the foreground gives you the best of both worlds: get rid of the “invisible” padding and retain your button’s design.