Remove extra space of the buttons below Linear Layout

Question

There's this extra space below the buttons, and I dont know why is it there. I tried everything and looked for anyone who have had this kind of problem and sadly i found nothing. It's either I want to remove the extra space and/or lower it down perfectly aligned.

Here's my xml file

<RelativeLayout 
        android:layout_width="fill_parent"
        android:layout_height="fill_parent">
        <LinearLayout 
            android:id="@+id/button_layout"
            android:layout_alignParentTop="true"
            android:orientation="horizontal"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:background="#262626"
            android:gravity="center">
            <Button 
                android:id="@+id/receipts_button"
                android:background="@android:color/transparent"
                android:drawableTop="@drawable/preview_save_icon"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_weight="1"/>
            <Button android:id="@+id/capture_button"
                android:background="@android:color/transparent"
                android:drawableTop="@drawable/preview_upload_icon"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_weight="1"/>
            <Button android:id="@+id/settings_button"
                android:background="@android:color/transparent"
                android:drawableTop="@drawable/preview_discard_icon"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_weight="1"/>
        </LinearLayout>

Answer 1

Is there any reason you are using a button instead of ImageView? You are using android:drawableTop which will position your image in the top part and leave some space in the bottom for text! As you don't want text, I'ts easier to replace it with ImageView and set the image as source. So it will be centered on the view:

  <LinearLayout 
            android:id="@+id/button_layout"
            android:layout_alignParentTop="true"
            android:orientation="horizontal"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:background="#262626"
            android:gravity="center">
            <ImageView 
                android:id="@+id/receipts_button"
                android:background="@android:color/transparent"                
                android:src="@drawable/ic_launcher"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_weight="1"/>
            <ImageView android:id="@+id/capture_button"
                android:background="@android:color/transparent"
                android:src="@drawable/ic_launcher"                
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_weight="1"/>
            <ImageView android:id="@+id/settings_button"
                android:background="@android:color/transparent"
                android:src="@drawable/ic_launcher"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_weight="1"/>
        </LinearLayout>

Answer 2

尝试一下，实际上，当您设置android：gravity =“ center”时，它属于布局本身，当您说layout_gravity时，它将应用于布局的子级。

android:layout_gravity="center_vertical"

Answer 3

First of all it is not a good practice to have many nested Layouts. In your case you could remove either the LinearLayout or the RelativeLayout. Beyond that, although it would be helpfull to post the whole xml, I would suggest removing the android:layout_alignParentTop="true" in the LinearLayout, and maybe adding something like: android:layout_gravity="bottom"

Answer 4

• Remove android:drawableTop attribute and give Button image in android:background attribute. android:drawableTop will position your image in the top part.

• Set the layout_gravity attribute to center_vertical for the buttons

   <LinearLayout android:id="@+id/button_layout" android:layout_alignParentTop="true" android:orientation="horizontal" android:layout_width="fill_parent" android:layout_height="wrap_content" android:background="#262626" android:gravity="center"> <Button android:id="@+id/receipts_button" android:background="@drawable/preview_save_icon" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_gravity="center_vertical" android:layout_weight="1"/> <Button android:id="@+id/capture_button" android:background="@drawable/preview_upload_icon" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_gravity="center_vertical" android:layout_weight="1"/> <Button android:id="@+id/settings_button" android:background="@drawable/preview_discard_icon" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_gravity="center_vertical" android:layout_weight="1"/> </LinearLayout> 

Answer 5

Reason for this is correctly told by gameower . In addition to that, if you want to continue using Buttons then you just need to replace android:drawableTop by android:drawableLeft and you should get what you want.

Hope that hepls.