layout_weight not adjusting size properly

layout_weight not adjusting size properly - java

I am trying to make a calculator app. I have a outer linearlayout which is vertical orientation and then have nested linear layouts which have a horizontal orientation where my buttons will go. Only the last nested linear layout is not adjusting the width properly of the buttons as I want the '0' button to take half the width and the '.' and '=' button to take a quarter of the width. I gave the '=' button a layout weight of 0.5 and the '.' & '=' button a layout weight of 0.25 but it still won't work properly.
Here is a screenshot of the graphical layout:
XML code:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:background="#000000"
android:weightSum="1">
<TextView
android:text="0"
android:layout_width="wrap_content"
android:layout_weight = "0.25"
android:layout_height="0dp"
android:textSize="40sp"
android:layout_gravity="right"
android:textColor="#FFFFFF"
android:id="#+id/tvDisplay"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:orientation="horizontal"
android:layout_weight="0.15"
android:weightSum="1">
<Button
android:id="#+id/bClear"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_margin="0.2dp"
android:layout_weight="0.25"
android:background="#FFFFFF"
android:text="C"
android:textSize="30sp" />
<Button
android:id="#+id/bChangeSign"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_margin="0.2dp"
android:layout_weight="0.25"
android:background="#FFFFFF"
android:text="+/-"
android:textSize="30sp" />
<Button
android:id="#+id/bPercent"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_margin="0.2dp"
android:layout_weight="0.25"
android:background="#FFFFFF"
android:text="%"
android:textSize="30sp" />
<Button
android:id="#+id/bDivide"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_margin="0.2dp"
android:layout_weight="0.25"
android:background="#FF9900"
android:text="/"
android:textSize="30sp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:orientation="horizontal"
android:layout_weight="0.15">
<Button
android:text="7"
android:background="#FFFFFF"
android:textSize="30sp"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_margin="0.2dp"
android:layout_weight="0.25"
android:id="#+id/b7"/>
<Button
android:text="8"
android:background="#FFFFFF"
android:textSize="30sp"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_margin="0.2dp"
android:layout_weight="0.25"
android:id="#+id/b8"/>
<Button
android:text="9"
android:background="#FFFFFF"
android:textSize="30sp"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_margin="0.2dp"
android:layout_weight="0.25"
android:id="#+id/b9"/>
<Button
android:id="#+id/bMultiply"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_margin="0.2dp"
android:layout_weight="0.25"
android:background="#FF9900"
android:text="x"
android:textSize="30sp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:orientation="horizontal"
android:layout_weight="0.15">
<Button
android:text="4"
android:background="#FFFFFF"
android:textSize="30sp"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_margin="0.2dp"
android:layout_weight="0.25"
android:id="#+id/b4"/>
<Button
android:text="5"
android:background="#FFFFFF"
android:textSize="30sp"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_margin="0.2dp"
android:layout_weight="0.25"
android:id="#+id/b5" />
<Button
android:text="6"
android:background="#FFFFFF"
android:textSize="30sp"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_margin="0.2dp"
android:layout_weight="0.25"
android:id="#+id/b6" />
<Button
android:text="-"
android:background="#FF9900"
android:textSize="30sp"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_margin="0.2dp"
android:layout_weight="0.25"
android:id="#+id/bSubtract"
/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:orientation="horizontal"
android:layout_weight="0.15">
<Button
android:text="1"
android:background="#FFFFFF"
android:textSize="30sp"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_margin="0.2dp"
android:layout_weight="0.25"
android:id="#+id/b1" />
<Button
android:text="2"
android:background="#FFFFFF"
android:textSize="30sp"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_margin="0.2dp"
android:layout_weight="0.25"
android:id="#+id/b2" />
<Button
android:text="3"
android:background="#FFFFFF"
android:textSize="30sp"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_margin="0.2dp"
android:layout_weight="0.25"
android:id="#+id/b3" />
<Button
android:text="+"
android:background="#FF9900"
android:textSize="30sp"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_margin="0.2dp"
android:layout_weight="0.25"
android:id="#+id/bPlus" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.15"
android:orientation="horizontal"
<Button
android:id="#+id/b0"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_margin="0.2dp"
android:layout_weight="0.5"
android:background="#FFFFFF"
android:text="0"
android:textSize="30sp" />
<Button
android:id="#+id/bDecimal"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_margin="0.2dp"
android:layout_weight="0.25"
android:background="#FFFFFF"
android:text="."
android:textSize="30sp" />
<Button
android:id="#+id/bEquals"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_margin="0.2dp"
android:layout_weight="0.25"
android:background="#FF9900"
android:text="="
android:textSize="30sp" />
</LinearLayout>

The solution to this problem is remarkably simple.
Android is great, and the tools for developing it are great, but then you come across behaviors like this and you realize that it certainly isn't perfect yet.
Go ahead and change the android:layout_width in your 3 buttons at the bottom to
android:layout_width="0dp"
Now, this was the way this was explained to me. The layout_weight attribute tries to balance out the widths to be in the correct ratios, but it takes into account the widths of the buttons it is trying to balance. By setting the width to absolutely nothing (0dp), you're taking away any sort of widths that may have interfered with layout_weigth's attempts to balance the ratios. Basically, so that there are no other values that could throw off the shifting of the widths.
I hope that helps. Good luck :)

test well
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#000000"
android:orientation="vertical"
android:weightSum="1" >
<TextView
android:id="#+id/tvDisplay"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_gravity="right"
android:layout_weight="0.25"
android:text="0"
android:textColor="#FFFFFF"
android:textSize="40sp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.15"
android:orientation="horizontal"
android:weightSum="1" >
<Button
android:id="#+id/bClear"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margin="0.1dp"
android:layout_weight="0.25"
android:background="#FFFFFF"
android:text="C"
android:textSize="30sp" />
<Button
android:id="#+id/bChangeSign"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margin="0.1dp"
android:layout_weight="0.25"
android:background="#FFFFFF"
android:text="+/-"
android:textSize="30sp" />
<Button
android:id="#+id/bPercent"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margin="0.1dp"
android:layout_weight="0.25"
android:background="#FFFFFF"
android:text="%"
android:textSize="30sp" />
<Button
android:id="#+id/bDivide"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margin="0.1dp"
android:layout_weight="0.25"
android:background="#FF9900"
android:text="/"
android:textSize="30sp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.15"
android:orientation="horizontal"
android:weightSum="1" >
<Button
android:id="#+id/b7"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margin="0.1dp"
android:layout_weight="0.25"
android:background="#FFFFFF"
android:text="7"
android:textSize="30sp" />
<Button
android:id="#+id/b8"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margin="0.1dp"
android:layout_weight="0.25"
android:background="#FFFFFF"
android:text="8"
android:textSize="30sp" />
<Button
android:id="#+id/b9"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margin="0.1dp"
android:layout_weight="0.25"
android:background="#FFFFFF"
android:text="9"
android:textSize="30sp" />
<Button
android:id="#+id/bMultiply"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margin="0.1dp"
android:layout_weight="0.25"
android:background="#FF9900"
android:text="x"
android:textSize="30sp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.15"
android:orientation="horizontal"
android:weightSum="1" >
<Button
android:id="#+id/b4"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margin="0.1dp"
android:layout_weight="0.25"
android:background="#FFFFFF"
android:text="4"
android:textSize="30sp" />
<Button
android:id="#+id/b5"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margin="0.1dp"
android:layout_weight="0.25"
android:background="#FFFFFF"
android:text="5"
android:textSize="30sp" />
<Button
android:id="#+id/b6"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margin="0.1dp"
android:layout_weight="0.25"
android:background="#FFFFFF"
android:text="6"
android:textSize="30sp" />
<Button
android:id="#+id/bSubtract"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margin="0.1dp"
android:layout_weight="0.25"
android:background="#FF9900"
android:text="-"
android:textSize="30sp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.15"
android:orientation="horizontal"
android:weightSum="1" >
<Button
android:id="#+id/b1"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margin="0.1dp"
android:layout_weight="0.25"
android:background="#FFFFFF"
android:text="1"
android:textSize="30sp" />
<Button
android:id="#+id/b2"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margin="0.1dp"
android:layout_weight="0.25"
android:background="#FFFFFF"
android:text="2"
android:textSize="30sp" />
<Button
android:id="#+id/b3"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margin="0.1dp"
android:layout_weight="0.25"
android:background="#FFFFFF"
android:text="3"
android:textSize="30sp" />
<Button
android:id="#+id/bPlus"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margin="0.1dp"
android:layout_weight="0.25"
android:background="#FF9900"
android:text="+"
android:textSize="30sp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.15"
android:orientation="horizontal"
android:weightSum="1" >
<Button
android:id="#+id/b0"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margin="0.1dp"
android:layout_weight="0.5"
android:background="#FFFFFF"
android:text="0"
android:textSize="30sp" />
<Button
android:id="#+id/bDecimal"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margin="0.1dp"
android:layout_weight="0.25"
android:background="#FFFFFF"
android:text="."
android:textSize="30sp" />
<Button
android:id="#+id/bEquals"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margin="0.1dp"
android:layout_weight="0.25"
android:background="#FF9900"
android:text="="
android:textSize="30sp" />
</LinearLayout>

Related

LinearLayout with fixed buttons width

Firsty, I've created something like that:
BadLayout
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="30dp"
android:paddingRight="30dp"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context=".MainActivity">
<LinearLayout
android:id="#+id/LinearLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="76dp"
android:orientation="horizontal"
android:weightSum="2">
<Button
android:id="#+id/button1"
style="#style/Widget.AppCompat.Button.Colored"
android:layout_width="120dp"
android:layout_height="140dp"
android:layout_marginEnd="10dp"
android:layout_weight="1"
android:backgroundTint="#color/colorPrimary"
android:text="Button1"
android:textSize="18sp"/>
<Button
android:id="#+id/button2"
style="#style/Widget.AppCompat.Button.Colored"
android:layout_width="120dp"
android:layout_height="140dp"
android:layout_marginStart="10dp"
android:layout_weight="1"
android:backgroundTint="#color/colorPrimary"
android:text="Button2"
android:textSize="18sp" />
</LinearLayout>
<LinearLayout
android:id="#+id/LinearLayout2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/LinearLayout1"
android:layout_marginTop="20dp"
android:orientation="horizontal"
android:weightSum="2">
<Button
android:id="#+id/button3"
style="#style/Widget.AppCompat.Button.Colored"
android:layout_width="120dp"
android:layout_height="140dp"
android:layout_marginEnd="10dp"
android:layout_weight="1"
android:backgroundTint="#color/colorPrimary"
android:text="Button3"
android:textSize="18sp" />
<Button
android:id="#+id/button4"
style="#style/Widget.AppCompat.Button.Colored"
android:layout_width="120dp"
android:layout_height="140dp"
android:layout_marginStart="10dp"
android:layout_weight="1"
android:backgroundTint="#color/colorPrimary"
android:text="Button4"
android:textSize="18sp" />
</LinearLayout>
But this layout doesn't work properly. Buttons don't have fixed width. The wider the screen is, the wider buttons are. It doesn't look good for me, because I want buttons to be perfect squares (e.g. 120dp x 120dp). I also want them to be centered. It should looks like that: GoodLayout. How to do that?

you can try this code to manage your view according to image you added:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="30dp"
android:paddingRight="30dp"
android:paddingTop="#dimen/activity_vertical_margin">
<LinearLayout
android:id="#+id/LinearLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:layout_marginTop="76dp"
android:orientation="horizontal">
<Button
android:id="#+id/button1"
style="#style/Widget.AppCompat.Button.Colored"
android:layout_width="170dp"
android:layout_height="170dp"
android:layout_marginEnd="10dp"
android:backgroundTint="#color/colorPrimary"
android:text="Button1"
android:textSize="18sp"/>
<Button
android:id="#+id/button2"
style="#style/Widget.AppCompat.Button.Colored"
android:layout_width="170dp"
android:layout_height="170dp"
android:layout_marginStart="10dp"
android:backgroundTint="#color/colorPrimary"
android:text="Button2"
android:textSize="18sp" />
</LinearLayout>
<LinearLayout
android:id="#+id/LinearLayout2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/LinearLayout1"
android:layout_marginTop="20dp"
android:gravity="center_horizontal"
android:orientation="horizontal">
<Button
android:id="#+id/button3"
style="#style/Widget.AppCompat.Button.Colored"
android:layout_width="170dp"
android:layout_height="170dp"
android:layout_marginEnd="10dp"
android:backgroundTint="#color/colorPrimary"
android:text="Button3"
android:textSize="18sp" />
<Button
android:id="#+id/button4"
style="#style/Widget.AppCompat.Button.Colored"
android:layout_width="170dp"
android:layout_height="170dp"
android:layout_marginStart="10dp"
android:backgroundTint="#color/colorPrimary"
android:text="Button4"
android:textSize="18sp" />
</LinearLayout>

Try this code
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="30dp"
android:paddingRight="30dp"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context=".MainActivity">
<LinearLayout
android:id="#+id/LinearLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="76dp"
android:orientation="horizontal"
android:gravity="center"
android:weightSum="2">
<Button
android:id="#+id/button1"
style="#style/Widget.AppCompat.Button.Colored"
android:layout_width="120dp"
android:layout_height="140dp"
android:layout_marginRight="10dp"
android:layout_weight="1"
android:backgroundTint="#color/colorPrimary"
android:text="Button1"
android:textSize="18sp"/>
<Button
android:id="#+id/button2"
style="#style/Widget.AppCompat.Button.Colored"
android:layout_width="120dp"
android:layout_height="140dp"
android:layout_marginLeft="10dp"
android:layout_weight="1"
android:backgroundTint="#color/colorPrimary"
android:text="Button2"
android:textSize="18sp" />
</LinearLayout>
<LinearLayout
android:id="#+id/LinearLayout2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/LinearLayout1"
android:layout_marginTop="20dp"
android:orientation="horizontal"
android:gravity="center"
android:weightSum="2">
<Button
android:id="#+id/button3"
style="#style/Widget.AppCompat.Button.Colored"
android:layout_width="120dp"
android:layout_height="140dp"
android:layout_marginRight="10dp"
android:layout_weight="1"
android:backgroundTint="#color/colorPrimary"
android:text="Button3"
android:textSize="18sp" />
<Button
android:id="#+id/button4"
style="#style/Widget.AppCompat.Button.Colored"
android:layout_width="120dp"
android:layout_height="140dp"
android:layout_marginLeft="10dp"
android:layout_weight="1"
android:backgroundTint="#color/colorPrimary"
android:text="Button4"
android:textSize="18sp" />
</LinearLayout>

Try this answer it will surely work on any sreen size without changing size of button
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="30dp"
android:paddingRight="30dp"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context=".MainActivity">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:orientation="vertical"
>
<LinearLayout
android:id="#+id/LinearLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
>
<Button
android:id="#+id/button1"
style="#style/Widget.AppCompat.Button.Colored"
android:layout_width="120dp"
android:layout_height="120dp"
android:backgroundTint="#color/colorPrimary"
android:text="Button1"
android:textSize="18sp"
/>
<Button
android:id="#+id/button2"
style="#style/Widget.AppCompat.Button.Colored"
android:layout_width="120dp"
android:layout_height="120dp"
android:layout_marginLeft="20dp"
android:backgroundTint="#color/colorPrimary"
android:text="Button2"
android:textSize="18sp"
/>
</LinearLayout>
<LinearLayout
android:id="#+id/LinearLayout2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/LinearLayout1"
android:layout_marginTop="20dp"
android:orientation="horizontal"
>
<Button
android:id="#+id/button3"
style="#style/Widget.AppCompat.Button.Colored"
android:layout_width="120dp"
android:layout_height="120dp"
android:backgroundTint="#color/colorPrimary"
android:text="Button3"
android:textSize="18sp" />
<Button
android:id="#+id/button4"
style="#style/Widget.AppCompat.Button.Colored"
android:layout_width="120dp"
android:layout_height="120dp"
android:layout_marginLeft="20dp"
android:layout_gravity="center_vertical"
android:backgroundTint="#color/colorPrimary"
android:text="Button4"
android:textSize="18sp" />
</LinearLayout>
</LinearLayout>

Table layout cutting out 4th column on android app

I am tried to creating a simple calculate app for android. I used a table layout and add 4 rows and 4 columns. In each column I add a button . My problem is the 4th column cuts out as shown in the image below,
Here is my code below
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context="com.tashtoons.calculator.Calculator">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentTop="true"
android:weightSum="1"
android:layout_alignParentRight="false"
android:layout_alignParentEnd="false">
<TextView
android:layout_width="343dp"
android:layout_height="77dp"
android:id="#+id/answerScreen"
android:layout_gravity="center_horizontal" />
<TableLayout
android:layout_width="371dp"
android:shrinkColumns="1"
android:layout_height="match_parent"
android:baselineAligned="true">
<TableRow
android:layout_width="match_parent"
android:layout_height="match_parent">
<Button
android:text="1"
android:id="#+id/button"
android:layout_column="0"
android:width="5px" />
<Button
android:text="2"
android:id="#+id/button2"
android:layout_column="1"
android:width="5px" />
<Button
android:text="3"
android:id="#+id/button3"
android:layout_column="2"
android:width="5px" />
<Button
android:text="+"
android:id="#+id/button4"
android:layout_column="3"
android:width="5px" />
</TableRow>
<TableRow
android:layout_width="match_parent"
android:layout_height="match_parent">
<Button
android:text="4"
android:id="#+id/button5"
android:layout_column="0"
android:width="5px" />
<Button
android:text="4"
android:id="#+id/button6"
android:layout_column="1"
android:width="5px" />
<Button
android:text="5"
android:id="#+id/button7"
android:layout_column="2"
android:width="5px" />
<Button
android:text="-"
android:id="#+id/button8"
android:layout_column="3"
android:width="5px" />
</TableRow>
<TableRow
android:layout_width="match_parent"
android:layout_height="match_parent">
<Button
android:text="6"
android:id="#+id/button9"
android:layout_column="0"
android:width="5px" />
<Button
android:text="7"
android:id="#+id/button10"
android:layout_column="1"
android:width="5px" />
<Button
android:text="8"
android:id="#+id/button11"
android:layout_column="2"
android:width="5px" />
<Button
android:text="X"
android:id="#+id/button12"
android:layout_column="3"
android:width="5px" />
</TableRow>
<TableRow
android:layout_width="match_parent"
android:layout_height="match_parent">
<Button
android:text="9"
android:id="#+id/button13"
android:layout_column="0"
android:width="5px" />
<Button
android:text="0"
android:id="#+id/button14"
android:layout_column="1"
android:width="5px" />
<Button
android:text="%"
android:id="#+id/button15"
android:layout_column="2"
android:width="5px" />
<Button
android:text="/"
android:id="#+id/button16"
android:layout_column="3"
android:width="5px" />
</TableRow>
</TableLayout>
</LinearLayout>
</RelativeLayout>
How can I stop it from cutting out?

Instead of your code Use below code.
Whenever you have to give same width of all Button or TextView or etc.
There is property of LinearLayout is WeightSum . This can equal divided the part.
so change your xml code to below format.
xml code :
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context="com.example.softeng.xxy.ThirdActivity">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="50dp"
android:id="#+id/firstRow">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:weightSum="4">
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="1" />
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="2" />
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="3" />
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="+" />
</LinearLayout>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/secondRow"
android:layout_below="#+id/firstRow">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:weightSum="4">
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="4" />
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="4" />
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="5" />
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="-" />
</LinearLayout>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/thirdRow"
android:layout_below="#+id/secondRow">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:weightSum="4">
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="6" />
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="7" />
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="8" />
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="X" />
</LinearLayout>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/forthRow"
android:layout_below="#+id/thirdRow">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:weightSum="4">
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="9" />
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="0" />
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="%" />
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="/" />
</LinearLayout>
</RelativeLayout>
</RelativeLayout>
Output :

Try this it may be help to you
Use
android:layout_width="match_parent"
in your TableLayout
instead of
android:layout_width="371dp"

Where a view has weight = 1 you should set the layout_width to be 0dp to make them have an even amount or space on your screen

Image in layout is not completely on top, where I want it

Edit, it's on top, now it's zoomed in
If it's possible, i would want it to fill the entire screen, width wise, with the image, completely on top, leaving no space between the top and the image. This is not working for me.
This is the main.xml code that I have, it could be completely wrong, please tell me if that's the case.
This is how it looks in the emulator, I want it to fill the entire top side from left to right, completely on the top.
Any help would be appreciated, i'm pretty new to this, so don't be scared to tell me i'm wrong :)
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context="com.example.rodekruis.MainActivity">
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true">
<ImageView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:src="#drawable/rkz_logo"
/>
</RelativeLayout>
<Button
android:id="#+id/button2"
style="?android:attr/buttonStyleSmall"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#+id/button9"
android:layout_alignLeft="#+id/button10"
android:layout_marginBottom="30dp"
android:layout_gravity="top"
android:clickable="true"
android:text="Nieuws" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_marginBottom="20dp"
android:orientation="horizontal">
<Button
android:id="#+id/button10"
style="?android:attr/buttonStyleSmall"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_alignTop="#+id/button8"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:text=" Afspraak maken" />
<Button
android:id="#+id/button8"
style="?android:attr/buttonStyleSmall"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:text=" Bezoek tijden" />
<Button
android:id="#+id/button9"
style="?android:attr/buttonStyleSmall"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_marginLeft="5dp"
android:layout_weight="1"
android:text="Contact" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_marginTop="10dp"
android:layout_marginBottom="20dp"
android:orientation="horizontal">
<Button
android:id="#+id/button3"
style="?android:attr/buttonStyleSmall"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:text=" Geef je mening!" />
<Button
android:id="#+id/button4"
style="?android:attr/buttonStyleSmall"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:text=" Route begeleiding" />
<Button
android:id="#+id/button1"
style="?android:attr/buttonStyleSmall"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_alignLeft="#+id/button5"
android:layout_below="#+id/button8"
android:layout_marginLeft="5dp"
android:layout_weight="1"
android:text="Specia-listen" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_marginTop="10dp"
android:orientation="horizontal">
<Button
android:id="#+id/button5"
style="?android:attr/buttonStyleSmall"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:text="BWC" />
<Button
android:id="#+id/button6"
style="?android:attr/buttonStyleSmall"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:text="Agenda" />
<Button
android:id="#+id/button7"
style="?android:attr/buttonStyleSmall"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_marginLeft="5dp"
android:layout_weight="1"
android:text="Praktische
informatie" />
</LinearLayout>
</LinearLayout>

try this,
<ImageView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:scaleType="centerCrop"
android:src="#drawable/rkz_logo"
/>

just remove your paddings. I hope it will help
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"

Remove two line in layout root
android:gravity="center"
android:paddingTop="#dimen/activity_vertical_margin"
Try this.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
tools:context=".MainActivity">
<ImageView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:src="#mipmap/ic_launcher" />
<Button
android:id="#+id/button2"
style="?android:attr/buttonStyleSmall"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="top"
android:layout_marginBottom="30dp"
android:clickable="true"
android:text="Nieuws" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_marginBottom="20dp"
android:orientation="horizontal">
<Button
android:id="#+id/button10"
style="?android:attr/buttonStyleSmall"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:text=" Afspraak maken" />
<Button
android:id="#+id/button8"
style="?android:attr/buttonStyleSmall"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:text=" Bezoek tijden" />
<Button
android:id="#+id/button9"
style="?android:attr/buttonStyleSmall"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_marginLeft="5dp"
android:layout_weight="1"
android:text="Contact" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_marginBottom="20dp"
android:layout_marginTop="10dp"
android:orientation="horizontal">
<Button
android:id="#+id/button3"
style="?android:attr/buttonStyleSmall"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:text=" Geef je mening!" />
<Button
android:id="#+id/button4"
style="?android:attr/buttonStyleSmall"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:text=" Route begeleiding" />
<Button
android:id="#+id/button1"
style="?android:attr/buttonStyleSmall"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_alignLeft="#+id/button5"
android:layout_below="#+id/button8"
android:layout_marginLeft="5dp"
android:layout_weight="1"
android:text="Specia-listen" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_marginTop="10dp"
android:orientation="horizontal">
<Button
android:id="#+id/button5"
style="?android:attr/buttonStyleSmall"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:text="BWC" />
<Button
android:id="#+id/button6"
style="?android:attr/buttonStyleSmall"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:text="Agenda" />
<Button
android:id="#+id/button7"
style="?android:attr/buttonStyleSmall"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_marginLeft="5dp"
android:layout_weight="1"
android:text="Praktische informatie" />
</LinearLayout>

android:layout_alignParentTop="true" on the parent of the ImageView is ignored because its parent (the root view) is not a RelativeLayout. Try changing the root view to RelativeLayout, and remove its padding (at least the top one).

layout looks different on real device than how shows in graphical layout of eclipse

I am working on the UI of my app.
The graphical layout I get in Eclipse while coding looks perfect and as that should be.
But when I launch the app either on an emulator or on a device, it gets distorted.
Every UI component, like Buttons, EditTexts and TextViews.
All the margins and paddings just get lost.
<LinearLayout
android:id="#+id/ll_grand_parent"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:gravity="fill_horizontal"
android:orientation="vertical"
android:weightSum="10" >
<LinearLayout
android:id="#+id/ll_button_signin_create_account"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="fill"
android:layout_marginLeft="7dp"
android:layout_marginTop="29dp"
android:layout_weight="2"
android:orientation="horizontal"
android:visibility="visible"
>
<Button
android:id="#+id/button_common_singin"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/transparent_button"
android:gravity="center"
android:text="Sign In"
android:textColor="#FFFFFF"
android:textSize="13sp" />
<Button
android:id="#+id/button_common_create_account"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/colored_button"
android:gravity="center"
android:text="Create Account"
android:textColor="#FFFFFF"
android:textSize="13sp" />
</LinearLayout>
<LinearLayout
android:id="#+id/signin_main"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="5.24"
android:orientation="vertical"
android:visibility="gone" >
<LinearLayout
android:id="#+id/ll_parent_signin_email_password"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_marginTop="20sp"
android:layout_weight=".8"
android:background="#drawable/border"
android:orientation="vertical"
android:visibility="visible" >
<LinearLayout
android:id="#+id/ll_signin_email"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_gravity="center"
android:layout_weight="2"
android:orientation="horizontal"
android:visibility="visible"
android:weightSum="10" >
<TextView
android:id="#+id/textview_space_signin_email"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="2" />
<TextView
android:id="#+id/textview_signin_email"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="3"
android:gravity="center"
android:text="Email"
android:textColor="#FFFFFF" />
<EditText
android:id="#+id/edittext_signin_email"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="3"
android:background="#android:color/transparent"
android:gravity="center"
android:hint="john#hotmail.com"
android:textColorHint="#FFFFFF"
android:textSize="13dp" />
</LinearLayout>
<View
android:id="#+id/view_line_signin_email_password"
android:layout_width="fill_parent"
android:layout_height="1dip"
android:background="#FFFFFF" />
<LinearLayout
android:id="#+id/ll_signin_password"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_gravity="center"
android:layout_weight="2"
android:orientation="horizontal"
android:visibility="visible"
android:weightSum="10" >
<TextView
android:id="#+id/textview_space_signin_password"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="1" />
<TextView
android:id="#+id/textview_signin_password"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="3"
android:gravity="center"
android:text="Password"
android:textColor="#FFFFFF" />
<EditText
android:id="#+id/edittext_signin_password"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="4.49"
android:background="#android:color/transparent"
android:gravity="center"
android:hint="*********"
android:password="true"
android:textColorHint="#FFFFFF" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:id="#+id/ll_signin_logme_parent_button"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_marginTop="20dp"
android:layout_weight="1"
android:orientation="horizontal"
android:visibility="visible"
android:weightSum="10" >
<TextView
android:id="#+id/textview_space_signin_loginme_button_lhs"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="1" />
<Button
android:id="#+id/button_signin_loginme"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="7"
android:background="#219AC7"
android:gravity="center"
android:text="Login Me"
android:textColor="#FFFFFF" />
<ImageView
android:id="#+id/textview_space_signin_logmebutton_rhs"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight=".7" />
</LinearLayout>
<RelativeLayout
android:id="#+id/relative_layout_signin_parent_forgetpassword"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right"
android:layout_marginLeft="14dp"
android:layout_marginTop="9dp"
android:visibility="visible" >
<TextView
android:id="#+id/textview_signin_forget_password"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="forget password"
android:textColor="#000000" />
</RelativeLayout>
<LinearLayout
android:id="#+id/ll_signin_orline_draw_parent"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_gravity="center"
android:layout_weight="1"
android:orientation="horizontal"
android:visibility="visible"
android:weightSum="10" >
<View
android:layout_width="fill_parent"
android:layout_height="1dip"
android:layout_gravity="center"
android:layout_weight="4"
android:background="#000000"
android:padding="20dp" />
<ImageView
android:id="#+id/imageview_signin_or_drawline"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_weight="2"
android:src="#drawable/or" />
<View
android:layout_width="fill_parent"
android:layout_height="1dip"
android:layout_gravity="center"
android:layout_weight="4"
android:background="#000000"
android:padding="20dp" />
</LinearLayout>
<LinearLayout
android:id="#+id/ll_signin_parent_loginwith_facebook"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_marginTop="13dp"
android:layout_weight="1"
android:orientation="horizontal"
android:visibility="visible"
android:weightSum="10" >
<TextView
android:id="#+id/textview_space_signin_facebook_lhs"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1" />
<ImageView
android:id="#+id/imageview_signin_facebook_logo"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="2"
android:background="#drawable/fb" />
<Button
android:id="#+id/button_singin_facebook"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="6"
android:background="#3B5998"
android:text="login with facebook"
android:textColor="#FFFFFF" />
<TextView
android:id="#+id/textview_space_sigin_facebook_rhs"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:id="#+id/signup_main"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="6"
android:orientation="vertical"
android:visibility="visible" >
<LinearLayout
android:id="#+id/ll_signup_parentlayout_name"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_marginTop="20sp"
android:layout_weight=".8"
android:background="#drawable/border"
android:orientation="vertical"
android:visibility="visible" >
<LinearLayout
android:id="#+id/ll_singnup_firstname"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_gravity="center"
android:layout_weight="2"
android:orientation="horizontal"
android:visibility="visible"
android:weightSum="10" >
<TextView
android:id="#+id/textview_signup_firstname"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="3"
android:gravity="center"
android:text="First Name"
android:textColor="#FFFFFF" />
<EditText
android:id="#+id/edittext_signup_firstname"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="3"
android:background="#android:color/transparent"
android:gravity="center"
android:hint="John"
android:singleLine="true"
android:textColor="#FFFFFF"
android:textColorHint="#FFFFFF"
/>
<EditText
android:id="#+id/edittext_singup_email"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="3"
android:background="#android:color/transparent"
android:gravity="center"
android:hint="john#xyz.com"
android:singleLine="true"
android:textColor="#FFFFFF"
android:textColorHint="#FFFFFF"
android:textSize="13dp"
android:visibility="gone" >
</EditText>
</LinearLayout>
<View
android:id="#+id/view_signup_line_draw_name_first_last_name"
android:layout_width="fill_parent"
android:layout_height="1dip"
android:background="#FFFFFF" />
<LinearLayout
android:id="#+id/ll_signup_lastname"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_gravity="center"
android:layout_weight="2"
android:orientation="horizontal"
android:visibility="visible"
android:weightSum="10" >
<TextView
android:id="#+id/textview_signup_lastname"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="3"
android:gravity="center"
android:text="Last Name"
android:textColor="#FFFFFF" />
<EditText
android:id="#+id/edittext_signup_lastname"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="4.47"
android:background="#android:color/transparent"
android:gravity="center"
android:hint="Smith"
android:password="false"
android:singleLine="true"
android:textColor="#FFFFFF"
android:textColorHint="#FFFFFF" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:id="#+id/ll_singnup_email_parent"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_marginTop="20sp"
android:layout_weight=".8"
android:background="#drawable/border"
android:orientation="vertical"
android:visibility="visible" >
<LinearLayout
android:id="#+id/ll_signup_email_address"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_gravity="center"
android:layout_weight="2"
android:orientation="horizontal"
android:weightSum="10" >
<TextView
android:id="#+id/textview_signup_email"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="3"
android:gravity="center"
android:text="Email Address"
android:textColor="#FFFFFF" />
<EditText
android:id="#+id/edittext_signup_enteremail"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="4.49"
android:background="#android:color/transparent"
android:gravity="center"
android:hint="john#xyz.com"
android:password="false"
android:singleLine="true"
android:textColor="#FFFFFF"
android:textColorHint="#FFFFFF" />
</LinearLayout>
<View
android:id="#+id/view_signup_draw_line_email"
android:layout_width="fill_parent"
android:layout_height="1dip"
android:background="#FFFFFF" />
<LinearLayout
android:id="#+id/ll_signup_reenter_email"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_gravity="center"
android:layout_weight="2"
android:orientation="horizontal"
android:visibility="visible"
android:weightSum="10" >
<TextView
android:id="#+id/textview_signup_reenteremail"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="3"
android:gravity="center"
android:singleLine="true"
android:text="Re Enter Email Address"
android:textColor="#FFFFFF" />
<EditText
android:id="#+id/edittext_signup_reenteremail"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="4.49"
android:background="#android:color/transparent"
android:gravity="center"
android:hint="john#xyz.com"
android:password="false"
android:singleLine="true"
android:textColor="#FFFFFF"
android:textColorHint="#FFFFFF" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:id="#+id/ll_signup_dob_button_parent"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="13dp"
android:divider="#drawable/divider"
android:gravity="center"
android:orientation="horizontal"
android:showDividers="middle"
android:visibility="visible"
android:weightSum="3" >
<Button
android:id="#+id/button_signup_day"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/round_button"
android:text="BirthDate"
android:textColor="#000000"
android:textSize="10sp" />
<Button
android:id="#+id/button_signup_month"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/round_button"
android:divider="#drawable/divider"
android:showDividers="middle"
android:text="BirthMonth"
android:textColor="#000000"
android:textSize="10sp" />
<Button
android:id="#+id/button_singup_year"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/round_button"
android:singleLine="true"
android:text="BirthYear"
android:textColor="#000000"
android:textSize="10sp" />
</LinearLayout>
<LinearLayout
android:id="#+id/ll_singup_radio_gender_parent"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left"
android:layout_marginTop="10dp"
android:orientation="horizontal"
android:visibility="visible" >
<RadioGroup
android:id="#+id/radio_signup_radiogroup"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<RadioButton
android:id="#+id/radiobutton_signup_male"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:cursorVisible="true"
android:text="male "
android:textColor="#FFFFFF"
android:textColorHighlight="#ED933E" />
<RadioButton
android:id="#+id/radiobutton_signup_female"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="female"
android:textColor="#FFFFFF" />
</RadioGroup>
</LinearLayout>
<Button
android:id="#+id/button_signup_createaccount"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="13dp"
android:layout_marginRight="13dp"
android:layout_weight=".003"
android:background="#drawable/colored_button"
android:text="Create My Account"
android:visibility="visible" />
</LinearLayout>

These are the causes of your issue
android:weightSum="10"
You have to fill parent on every view and give each one a weight to just to make this work. You can achieve a good looking app that way but it is quite labor intensive and we have not even discussed text size among different devices.
Also other stuff like
android:layout_marginLeft="7dp"
Imagine a 10 inch tablet and a normal sized phone. Think of the different dimensions of the two and how your application will stretch . What happens if your turn your app sideways? How would it look then?
Go here and when your done reading it read it again.
http://developer.android.com/training/basics/supporting-devices/screens.html

How to design a grid layout which will fit whole screen?

I like to design a layout like in the image below. What would be the best way to design this layout, so the icon will be centered in the box and if we load it in big screen the whole screen should fit those 8 boxes?

Here's an example on how you might do that layout:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/layout_main"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<View
android:id="#+id/middle_separator"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_centerHorizontal="true" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_alignRight="#id/middle_separator"
android:orientation="vertical" >
<FrameLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#000000" >
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:src="#drawable/ic_launcher" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Stuff"
android:textColor="#ffffff" />
</FrameLayout>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#220000" >
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:src="#drawable/ic_launcher" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Stuff"
android:textColor="#ffffff" />
</FrameLayout>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#440000" >
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:src="#drawable/ic_launcher" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Stuff"
android:textColor="#ffffff" />
</FrameLayout>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#660000" >
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:src="#drawable/ic_launcher" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Stuff"
android:textColor="#ffffff" />
</FrameLayout>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#id/middle_separator"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:orientation="vertical" >
<FrameLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#880000" >
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:src="#drawable/ic_launcher" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Stuff"
android:textColor="#ffffff" />
</FrameLayout>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#aa0000" >
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:src="#drawable/ic_launcher" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Stuff"
android:textColor="#ffffff" />
</FrameLayout>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#cc0000" >
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:src="#drawable/ic_launcher" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Stuff"
android:textColor="#ffffff" />
</FrameLayout>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#ee0000" >
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:src="#drawable/ic_launcher" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Stuff"
android:textColor="#ffffff" />
</FrameLayout>
</LinearLayout>
</RelativeLayout>

We Keep Coding

Java is a programming language and computing platform first released by Sun Microsystems in 1995.

layout_weight not adjusting size properly - java

Related

LinearLayout with fixed buttons width

Table layout cutting out 4th column on android app

Image in layout is not completely on top, where I want it

layout looks different on real device than how shows in graphical layout of eclipse

How to design a grid layout which will fit whole screen?

Categories

Resources