1

I'm trying to build my first calculator app with android studio, I'm familiar with Java but not with UIs and XML files. I do not understand why I have margins around the buttons that I have created.

I tried to set the layout_margin to 0 but it did not work.

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout

    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"

    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:weightSum="18"

    tools:context=".MainActivity">

    <TextView
        android:id="@+id/displayTextView"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:textSize="30dp"
        android:layout_margin="10dp"
        android:layout_weight="1"
        android:gravity="left"
        android:background="@drawable/border"

        />

    <TextView
        android:id="@+id/finalResultTextView"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:textSize="40dp"
        android:layout_margin="10dp"
        android:layout_weight="2"
        android:background="@drawable/border"
        android:gravity="center"
        />

    <LinearLayout

        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:orientation="horizontal"
        android:layout_weight="3"
        android:weightSum="5"

        >

        <Button
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:text="C"
            android:autoSizeTextType="uniform"
            android:autoSizeMaxTextSize="60dp"
            />

        <Button
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:text="\u232b"
            android:autoSizeTextType="uniform"
            android:autoSizeMaxTextSize="60dp"
            />

        <Button
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:text="%"
            android:autoSizeTextType="uniform"
            android:autoSizeMaxTextSize="60dp"
            />

        <Button
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:autoSizeMaxTextSize="60dp"
            android:autoSizeTextType="uniform"
            android:text="{" />

        <Button
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:text="}"
            android:autoSizeTextType="uniform"
            android:autoSizeMaxTextSize="60dp"
            />


    </LinearLayout>

    <LinearLayout

            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:orientation="horizontal"
            android:layout_weight="3"
            android:weightSum="5"
            >

            <Button
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:text="7"
                android:autoSizeTextType="uniform"
                android:autoSizeMaxTextSize="60dp"
                />

        <Button
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:autoSizeMaxTextSize="60dp"
            android:autoSizeTextType="uniform"
            android:text="8"

            />

            <Button
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:text="9"
                android:autoSizeTextType="uniform"
                android:autoSizeMaxTextSize="60dp"
                />

            <Button
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:text="("
                android:autoSizeTextType="uniform"
                android:autoSizeMaxTextSize="60dp"
                />

            <Button
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:text=")"
                android:autoSizeTextType="uniform"
                android:autoSizeMaxTextSize="60dp"
                />


    </LinearLayout>

    <LinearLayout

            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:orientation="horizontal"
            android:layout_weight="3"
            android:weightSum="5"
            >

            <Button
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:text="4"
                android:autoSizeTextType="uniform"
                android:autoSizeMaxTextSize="60dp"
                />

            <Button
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:text="5"
                android:autoSizeTextType="uniform"
                android:autoSizeMaxTextSize="60dp"
                />

            <Button
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:text="6"
                android:autoSizeTextType="uniform"
                android:autoSizeMaxTextSize="60dp"
                />

            <Button
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:text="/"
                android:autoSizeTextType="uniform"
                android:autoSizeMaxTextSize="60dp"
                />

            <Button
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:text="*"
                android:autoSizeTextType="uniform"
                android:autoSizeMaxTextSize="60dp"
                />


        </LinearLayout>

    <LinearLayout

            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:orientation="horizontal"
            android:layout_weight="3"
            android:weightSum="5"
            >

            <Button
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:text="1"
                android:autoSizeTextType="uniform"
                android:autoSizeMaxTextSize="60dp"
                />

            <Button
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:text="2"
                android:autoSizeTextType="uniform"
                android:autoSizeMaxTextSize="60dp"
                />

            <Button
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:text="3"
                android:autoSizeTextType="uniform"
                android:autoSizeMaxTextSize="60dp"
                />

            <Button
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:text="-"
                android:autoSizeTextType="uniform"
                android:autoSizeMaxTextSize="60dp"
                />

            <Button
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:text="+"
                android:autoSizeTextType="uniform"
                android:autoSizeMaxTextSize="60dp"
                />


    </LinearLayout>

    <LinearLayout

            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:orientation="horizontal"
            android:layout_weight="3"
            android:weightSum="5"
            >

            <Button
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:text="."
                android:autoSizeTextType="uniform"
                android:autoSizeMaxTextSize="60dp"
                />

            <Button
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:text="0"
                android:autoSizeTextType="uniform"
                android:autoSizeMaxTextSize="60dp"
                />

            <Button
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="3"
                android:text="="
                android:autoSizeTextType="uniform"
                android:autoSizeMaxTextSize="100dp"
                />


                />
        </LinearLayout>

</LinearLayout>

Even after I set the layout_margin to "0dp" I'm still getting margin around each button.

Here is the screenshot:

You can see at the blueprint that each button have a margin around it

Uri Amiel
  • 23
  • 5

2 Answers2

0

Here is a solution for you. By default Buttons are taking 5dp of margin. Which margin you can remove by giving minus margin. 

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:weightSum="18"
    tools:context=".MainActivity">

    <TextView
        android:id="@+id/displayTextView"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_margin="10dp"
        android:layout_weight="1"
        android:background="@drawable/border"
        android:gravity="left"
        android:textSize="30dp"

        />

    <TextView
        android:id="@+id/finalResultTextView"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_margin="10dp"
        android:layout_weight="2"
        android:background="@drawable/border"
        android:gravity="center"
        android:textSize="40dp" />

    <LinearLayout

        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="3"
        android:orientation="horizontal"
        android:weightSum="5"

        >

        <Button
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginLeft="-5dip"
            android:layout_marginTop="-5dip"
            android:layout_marginRight="-5dip"
            android:layout_marginBottom="-5dip"
            android:layout_weight="1"
            android:autoSizeMaxTextSize="60dp"
            android:autoSizeTextType="uniform"
            android:padding="0dp"
            android:text="C" />

        <Button
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginLeft="-5dip"
            android:layout_marginTop="-5dip"
            android:layout_marginRight="-5dip"
            android:layout_marginBottom="-5dip"
            android:layout_weight="1"
            android:autoSizeMaxTextSize="60dp"
            android:autoSizeTextType="uniform"
            android:padding="0dp"
            android:text="\u232b" />

        <Button
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginLeft="-5dip"
            android:layout_marginTop="-5dip"
            android:layout_marginRight="-5dip"
            android:layout_marginBottom="-5dip"
            android:layout_weight="1"
            android:autoSizeMaxTextSize="60dp"
            android:autoSizeTextType="uniform"
            android:padding="0dp"
            android:text="%" />

        <Button
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginLeft="-5dip"
            android:layout_marginTop="-5dip"
            android:layout_marginRight="-5dip"
            android:layout_marginBottom="-5dip"
            android:layout_weight="1"
            android:autoSizeMaxTextSize="60dp"
            android:autoSizeTextType="uniform"
            android:padding="0dp"
            android:text="{" />

        <Button
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginLeft="-5dip"
            android:layout_marginTop="-5dip"
            android:layout_marginRight="-5dip"
            android:layout_marginBottom="-5dip"
            android:layout_weight="1"
            android:autoSizeMaxTextSize="60dp"
            android:autoSizeTextType="uniform"
            android:padding="0dp"
            android:text="}" />


    </LinearLayout>

    <LinearLayout

        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="3"
        android:orientation="horizontal"
        android:weightSum="5">

        <Button
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginLeft="-5dip"
            android:layout_marginTop="-5dip"
            android:layout_marginRight="-5dip"
            android:layout_marginBottom="-5dip"
            android:layout_weight="1"
            android:autoSizeMaxTextSize="60dp"
            android:autoSizeTextType="uniform"
            android:padding="0dp"
            android:text="7" />

        <Button
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginLeft="-5dip"
            android:layout_marginTop="-5dip"
            android:layout_marginRight="-5dip"
            android:layout_marginBottom="-5dip"
            android:layout_weight="1"
            android:autoSizeMaxTextSize="60dp"
            android:autoSizeTextType="uniform"
            android:padding="0dp"
            android:text="8"

            />

        <Button
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginLeft="-5dip"
            android:layout_marginTop="-5dip"
            android:layout_marginRight="-5dip"
            android:layout_marginBottom="-5dip"
            android:layout_weight="1"
            android:autoSizeMaxTextSize="60dp"
            android:autoSizeTextType="uniform"
            android:padding="0dp"
            android:text="9" />

        <Button
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginLeft="-5dip"
            android:layout_marginTop="-5dip"
            android:layout_marginRight="-5dip"
            android:layout_marginBottom="-5dip"
            android:layout_weight="1"
            android:autoSizeMaxTextSize="60dp"
            android:autoSizeTextType="uniform"
            android:padding="0dp"
            android:text="(" />

        <Button
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginLeft="-5dip"
            android:layout_marginTop="-5dip"
            android:layout_marginRight="-5dip"
            android:layout_marginBottom="-5dip"
            android:layout_weight="1"
            android:autoSizeMaxTextSize="60dp"
            android:autoSizeTextType="uniform"
            android:padding="0dp"
            android:text=")" />


    </LinearLayout>

    <LinearLayout

        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="3"
        android:orientation="horizontal"
        android:weightSum="5">

        <Button
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginLeft="-5dip"
            android:layout_marginTop="-5dip"
            android:layout_marginRight="-5dip"
            android:layout_marginBottom="-5dip"
            android:layout_weight="1"
            android:autoSizeMaxTextSize="60dp"
            android:autoSizeTextType="uniform"
            android:padding="0dp"
            android:text="4" />

        <Button
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginLeft="-5dip"
            android:layout_marginTop="-5dip"
            android:layout_marginRight="-5dip"
            android:layout_marginBottom="-5dip"
            android:layout_weight="1"
            android:autoSizeMaxTextSize="60dp"
            android:autoSizeTextType="uniform"
            android:padding="0dp"
            android:text="5" />

        <Button
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginLeft="-5dip"
            android:layout_marginTop="-5dip"
            android:layout_marginRight="-5dip"
            android:layout_marginBottom="-5dip"
            android:layout_weight="1"
            android:autoSizeMaxTextSize="60dp"
            android:autoSizeTextType="uniform"
            android:padding="0dp"
            android:text="6" />

        <Button
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginLeft="-5dip"
            android:layout_marginTop="-5dip"
            android:layout_marginRight="-5dip"
            android:layout_marginBottom="-5dip"
            android:layout_weight="1"
            android:autoSizeMaxTextSize="60dp"
            android:autoSizeTextType="uniform"
            android:padding="0dp"
            android:text="/" />

        <Button
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginLeft="-5dip"
            android:layout_marginTop="-5dip"
            android:layout_marginRight="-5dip"
            android:layout_marginBottom="-5dip"
            android:layout_weight="1"
            android:autoSizeMaxTextSize="60dp"
            android:autoSizeTextType="uniform"
            android:padding="0dp"
            android:text="*" />


    </LinearLayout>

    <LinearLayout

        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="3"
        android:orientation="horizontal"
        android:weightSum="5">

        <Button
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginLeft="-5dip"
            android:layout_marginTop="-5dip"
            android:layout_marginRight="-5dip"
            android:layout_marginBottom="-5dip"
            android:layout_weight="1"
            android:autoSizeMaxTextSize="60dp"
            android:autoSizeTextType="uniform"
            android:padding="0dp"
            android:text="1" />

        <Button
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginLeft="-5dip"
            android:layout_marginTop="-5dip"
            android:layout_marginRight="-5dip"
            android:layout_marginBottom="-5dip"
            android:layout_weight="1"
            android:autoSizeMaxTextSize="60dp"
            android:autoSizeTextType="uniform"
            android:padding="0dp"
            android:text="2" />

        <Button
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginLeft="-5dip"
            android:layout_marginTop="-5dip"
            android:layout_marginRight="-5dip"
            android:layout_marginBottom="-5dip"
            android:layout_weight="1"
            android:autoSizeMaxTextSize="60dp"
            android:autoSizeTextType="uniform"
            android:padding="0dp"
            android:text="3" />

        <Button
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginLeft="-5dip"
            android:layout_marginTop="-5dip"
            android:layout_marginRight="-5dip"
            android:layout_marginBottom="-5dip"
            android:layout_weight="1"
            android:autoSizeMaxTextSize="60dp"
            android:autoSizeTextType="uniform"
            android:padding="0dp"
            android:text="-" />

        <Button
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginLeft="-5dip"
            android:layout_marginTop="-5dip"
            android:layout_marginRight="-5dip"
            android:layout_marginBottom="-5dip"
            android:layout_weight="1"
            android:autoSizeMaxTextSize="60dp"
            android:autoSizeTextType="uniform"
            android:padding="0dp"
            android:text="+" />


    </LinearLayout>

    <LinearLayout

        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="3"
        android:orientation="horizontal"
        android:weightSum="5">

        <Button
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginLeft="-5dip"
            android:layout_marginTop="-5dip"
            android:layout_marginRight="-5dip"
            android:layout_marginBottom="-5dip"
            android:layout_weight="1"
            android:autoSizeMaxTextSize="60dp"
            android:autoSizeTextType="uniform"
            android:padding="0dp"
            android:text="." />

        <Button
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginLeft="-5dip"
            android:layout_marginTop="-5dip"
            android:layout_marginRight="-5dip"
            android:layout_marginBottom="-5dip"
            android:layout_weight="1"
            android:autoSizeMaxTextSize="60dp"
            android:autoSizeTextType="uniform"
            android:padding="0dp"
            android:text="0" />

        <Button
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginLeft="-5dip"
            android:layout_marginTop="-5dip"
            android:layout_marginRight="-5dip"
            android:layout_marginBottom="-5dip"
            android:layout_weight="3"
            android:autoSizeMaxTextSize="100dp"
            android:autoSizeTextType="uniform"
            android:padding="0dp"
            android:text="=" />


        />
    </LinearLayout>

</LinearLayout>
Al-Amin
  • 1,369
  • 1
  • 9
  • 26
  • Thank you, it worked. By the way, 1. At the begging of the project, I did not get a margin around each button, do you know why does that happen? 2. Is there a quick way to add a line/lines to all buttons in the file? – Uri Amiel Jun 12 '19 at 15:13
  • 1. My assumption: You might be added support design library or material design library. 2. You can create a custom style for buttons so that each and every button looks same Here is the source - https://stackoverflow.com/questions/26346727/android-material-design-button-styles – Al-Amin Jun 12 '19 at 16:16
0

The simplest solution is to give a background image to the buttons, for example

 <Button
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:autoSizeMaxTextSize="60dp"
        android:autoSizeTextType="uniform"
        android:background="@android:drawable/progress_horizontal"
        android:text=")" />

This way you have not to compensate the 5dp standard margin of Android Buttons, because if you try to compensate with -5dp in any direction, Buttons can compenetrate each other and it can result in a incorrect behaviour.

You can also refer to this link.

Andrea Caruso
  • 180
  • 1
  • 6