I am learning to create UI in XML now, and I'm struggling with such a problem.
I create UI which looks like this: UI in Android Studio
And on the phone it looks like this: How it looks in reality (screenshot from a phone)
How to reduce these vertical spaces?
I want to get rid of this: These marked spaces
This is LinearLayout, and these are much bigger than I want them to be.
Here's my XML code for this UI:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="16dp">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="101dp"
android:layout_marginBottom="10dp"
android:layout_weight="0"
android:orientation="horizontal">
<TextView
android:id="#+id/textView3"
android:layout_width="wrap_content"
android:layout_height="80dp"
android:layout_marginTop="16dp"
android:layout_marginRight="10dp"
android:layout_marginBottom="16dp"
android:layout_weight="1"
android:paddingTop="16dp"
android:text="Yooooo"
android:textAlignment="textEnd"
android:textSize="50sp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="80dp"
android:layout_weight="0"
android:layout_marginTop="10dp"
android:orientation="horizontal">
<Button
android:layout_marginTop="16dp"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:textColor="#color/md_theme_dark_error"
android:text="CLEAR ALL"
android:backgroundTint="#color/md_theme_dark_onPrimary"
android:textStyle="bold"
android:textSize="20sp"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_weight="1"
android:orientation="horizontal">
<Button
android:layout_width="0dp"
android:layout_height="75dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="10dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary"
android:gravity="center"
android:text="/"
android:textAlignment="center"
android:textColor="#color/md_theme_dark_primary"
android:textSize="20sp"
android:textStyle="bold" />
<Button
android:layout_width="0dp"
android:layout_height="75dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="10dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary"
android:gravity="center"
android:text="*"
android:textAlignment="center"
android:textColor="#color/md_theme_dark_primary"
android:textSize="20sp"
android:textStyle="bold" />
<Button
android:layout_width="0dp"
android:layout_height="75dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="10dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary"
android:gravity="center"
android:text="+"
android:textAlignment="center"
android:textColor="#color/md_theme_dark_primary"
android:textSize="20sp"
android:textStyle="bold" />
<Button
android:layout_width="0dp"
android:layout_height="75dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="10dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary"
android:gravity="center"
android:text="-"
android:textAlignment="center"
android:textColor="#color/md_theme_dark_primary"
android:textSize="20sp"
android:textStyle="bold" />
<Button
android:layout_width="0dp"
android:layout_height="75dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="10dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary"
android:gravity="center"
android:text="="
android:textAlignment="center"
android:textColor="#color/md_theme_dark_primary"
android:textSize="20sp"
android:textStyle="bold" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="250dp"
android:layout_weight="1"
android:orientation="horizontal">
<Button
android:layout_marginTop="1dp"
android:layout_width="1dp"
android:layout_height="120dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary"
android:gravity="center"
android:text="7"
android:textAlignment="center"
android:textSize="30sp"
android:textStyle="bold" />
<Button
android:layout_width="0dp"
android:layout_height="120dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary"
android:gravity="center"
android:text="8"
android:textAlignment="center"
android:textSize="30sp"
android:textStyle="bold"
android:layout_marginTop="1dp"/>
<Button
android:layout_width="0dp"
android:layout_height="120dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary"
android:gravity="center"
android:text="9"
android:textAlignment="center"
android:textSize="30sp"
android:textStyle="bold"
android:layout_marginTop="1dp"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="245dp"
android:layout_weight="1"
android:orientation="horizontal">
<Button
android:layout_width="1dp"
android:layout_height="120dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary"
android:text="4"
android:textSize="30sp"
android:textStyle="bold"
android:layout_marginTop="1dp"/>
<Button
android:layout_width="0dp"
android:layout_height="120dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary"
android:gravity="center"
android:text="5"
android:textAlignment="center"
android:textSize="30sp"
android:textStyle="bold"
android:layout_marginTop="1dp"/>
<Button
android:layout_width="0dp"
android:layout_height="120dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary"
android:gravity="center"
android:text="6"
android:textAlignment="center"
android:textSize="30sp"
android:textStyle="bold"
android:layout_marginTop="1dp"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="265dp"
android:layout_weight="1"
android:orientation="horizontal">
<Button
android:layout_width="1dp"
android:layout_height="120dp"
android:layout_marginRight="3dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary"
android:gravity="center"
android:text="1"
android:textAlignment="center"
android:textSize="30sp"
android:textStyle="bold"
android:layout_marginTop="1dp"/>
<Button
android:layout_width="0dp"
android:layout_height="120dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary"
android:gravity="center"
android:text="2"
android:textAlignment="center"
android:textSize="30sp"
android:textStyle="bold"
android:layout_marginTop="1dp"/>
<Button
android:layout_width="0dp"
android:layout_height="120dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary"
android:gravity="center"
android:text="6"
android:textAlignment="center"
android:textSize="30sp"
android:textStyle="bold"
android:layout_marginTop="1dp"/>
</LinearLayout>
</LinearLayout>
</LinearLayout>
Thanks very much for every helpful hint/answer!!!
I tried changing the weight, reducing DPI spaces, and setting the android:layout_marginTop/Bottom to 10 dpi, I thought it would stop it from increasing the spaces.
You need to reduce the layout_height property for the Linear Layout and for the Button .
And as an advice if you want to learn UI creation using XML just try playing around with the editor and test different things it will be much easier to learn & memorise this way.
Related
I've created a calculator app, and it works fine, but there's one question - why the background becomes transparent when i close the app by performing home gesture? Here's how it looks:
how to repair this? Thanks, any help appreciated.
Here's the code for this UI, MDC Android:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="16dp">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_gravity="bottom"
android:layout_weight="1">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="130dp"
android:layout_marginBottom="5dp"
android:layout_weight="0"
android:layout_gravity="bottom"
android:orientation="horizontal"
>
<TextView
android:id="#+id/textViewResult"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_marginRight="10dp"
android:layout_marginBottom="1dp"
android:layout_weight="2"
android:text=""
android:textAlignment="textEnd"
android:textSize="50sp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0"
android:layout_marginTop="0dp"
android:orientation="horizontal"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_gravity="bottom"
android:layout_marginBottom="5dp"
android:orientation="horizontal">
<Button
android:id="#+id/buttonDivide"
android:layout_width="wrap_content"
android:layout_height="75dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="10dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary2"
android:gravity="center"
android:text="/"
android:textAlignment="center"
android:textColor="#color/md_theme_dark_primary"
android:textSize="30sp"
android:textStyle="bold" />
<Button
android:id="#+id/buttonMultiply"
android:layout_width="wrap_content"
android:layout_height="75dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="10dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary2"
android:gravity="center"
android:text="*"
android:textAlignment="center"
android:textColor="#color/md_theme_dark_primary"
android:textSize="30sp"
android:textStyle="bold" />
<Button
android:id="#+id/buttonMinus"
android:layout_width="wrap_content"
android:layout_height="75dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="10dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary2"
android:gravity="center"
android:text="-"
android:textAlignment="center"
android:textColor="#color/md_theme_dark_primary"
android:textSize="30sp"
android:textStyle="bold" />
<Button
android:id="#+id/buttonPlus"
android:layout_width="wrap_content"
android:layout_height="75dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="10dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary2"
android:gravity="center"
android:text="+"
android:textAlignment="center"
android:textColor="#color/md_theme_dark_primary"
android:textSize="30sp"
android:textStyle="bold" />
<Button
android:id="#+id/buttonEquality"
android:layout_width="wrap_content"
android:layout_height="75dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="10dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary2"
android:gravity="center"
android:text="="
android:textAlignment="center"
android:textColor="#color/md_theme_dark_primary"
android:textSize="30sp"
android:textStyle="bold" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="horizontal"
android:layout_gravity="bottom"
>
<Button
android:id="#+id/button7"
android:text="7"
android:layout_marginTop="1dp"
android:layout_width="wrap_content"
android:layout_height="120dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary"
android:gravity="center"
android:textAlignment="center"
android:textSize="30sp"
android:textStyle="bold"
android:padding="8dp" />
<Button
android:id="#+id/button8"
android:layout_width="wrap_content"
android:layout_height="120dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary"
android:gravity="center"
android:text="8"
android:textAlignment="center"
android:textSize="30sp"
android:textStyle="bold"
android:layout_marginTop="1dp"
android:padding="8dp" />
<Button
android:id="#+id/button9"
android:layout_width="wrap_content"
android:layout_height="120dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary"
android:gravity="center"
android:text="9"
android:textAlignment="center"
android:textSize="30sp"
android:textStyle="bold"
android:layout_marginTop="1dp"
android:padding="8dp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="horizontal"
android:layout_gravity="bottom">
<Button
android:id="#+id/button4"
android:text="4"
android:layout_marginTop="1dp"
android:layout_width="wrap_content"
android:layout_height="120dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary"
android:gravity="center"
android:textAlignment="center"
android:textSize="30sp"
android:textStyle="bold"
android:padding="8dp"
/>
<Button
android:id="#+id/button5"
android:layout_width="wrap_content"
android:layout_height="120dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary"
android:gravity="center"
android:text="5"
android:textAlignment="center"
android:textSize="30sp"
android:textStyle="bold"
android:layout_marginTop="1dp"
android:padding="8dp" />
<Button
android:id="#+id/button6"
android:layout_width="wrap_content"
android:layout_height="120dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary"
android:gravity="center"
android:text="6"
android:textAlignment="center"
android:textSize="30sp"
android:textStyle="bold"
android:layout_marginTop="1dp"
android:padding="8dp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="horizontal"
android:layout_gravity="bottom">
<Button
android:id="#+id/button1"
android:text="1"
android:layout_marginTop="1dp"
android:layout_width="wrap_content"
android:layout_height="120dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary"
android:gravity="center"
android:textAlignment="center"
android:textSize="30sp"
android:textStyle="bold"
android:padding="8dp" />
<Button
android:id="#+id/button2"
android:text="2"
android:layout_width="wrap_content"
android:layout_height="120dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary"
android:gravity="center"
android:textAlignment="center"
android:textSize="30sp"
android:textStyle="bold"
android:layout_marginTop="1dp"
android:padding="8dp" />
<Button
android:id="#+id/button3"
android:layout_width="wrap_content"
android:layout_height="120dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary"
android:gravity="center"
android:text="3"
android:textAlignment="center"
android:textSize="30sp"
android:textStyle="bold"
android:layout_marginTop="1dp"
android:padding="8dp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="horizontal"
android:layout_gravity="bottom"
android:layout_marginBottom="5dp">
<Button
android:id="#+id/buttonPoint"
android:text="."
android:layout_marginTop="1dp"
android:layout_width="wrap_content"
android:layout_height="120dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary2"
android:gravity="center"
android:textAlignment="center"
android:textSize="30sp"
android:textStyle="bold"
android:padding="8dp" />
<Button
android:id="#+id/button0"
android:text="0"
android:layout_width="wrap_content"
android:layout_height="120dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary"
android:gravity="center"
android:textAlignment="center"
android:textSize="30sp"
android:textStyle="bold"
android:layout_marginTop="1dp"
android:padding="8dp" />
<Button
android:id="#+id/buttonDelete"
android:layout_width="wrap_content"
android:layout_height="120dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary2"
android:gravity="center"
android:text="DEL"
android:textAlignment="center"
android:textSize="30sp"
android:textStyle="bold"
android:textColor="#color/md_theme_dark_error"
android:layout_marginTop="1dp"
android:padding="8dp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_marginBottom="60dp"
android:orientation="horizontal"
android:layout_gravity="bottom">
<Button
android:id="#+id/buttonClear"
android:layout_width="wrap_content"
android:layout_height="75dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary2"
android:gravity="center"
android:text="CLEAR"
android:textAlignment="center"
android:textSize="30sp"
android:textStyle="bold"
android:textColor="#color/md_theme_dark_error"
android:layout_marginTop="1dp"
android:padding="8dp" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
I tried disabling the night mode of the system, and apparently in white mode the problem doesn't appear. So the dark mode is causing the problem.
If the dark mode from your phone does that, then you can check res->values->themes->themes.xml(night) and set the default background color.
Another fix is to set the background in the LinearLayout.
"android:background="#ffffff"" / "android:background="#color/your_color""
Example:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/your_color"
android:padding="16dp">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_gravity="bottom"
android:layout_weight="1">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="130dp"
android:layout_marginBottom="5dp"
android:layout_weight="0"
android:layout_gravity="bottom"
android:orientation="horizontal"
>
<TextView
android:id="#+id/textViewResult"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_marginRight="10dp"
android:layout_marginBottom="1dp"
android:layout_weight="2"
android:text=""
android:textAlignment="textEnd"
android:textSize="50sp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0"
android:layout_marginTop="0dp"
android:orientation="horizontal"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_gravity="bottom"
android:layout_marginBottom="5dp"
android:orientation="horizontal">
<Button
android:id="#+id/buttonDivide"
android:layout_width="wrap_content"
android:layout_height="75dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="10dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary2"
android:gravity="center"
android:text="/"
android:textAlignment="center"
android:textColor="#color/md_theme_dark_primary"
android:textSize="30sp"
android:textStyle="bold" />
<Button
android:id="#+id/buttonMultiply"
android:layout_width="wrap_content"
android:layout_height="75dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="10dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary2"
android:gravity="center"
android:text="*"
android:textAlignment="center"
android:textColor="#color/md_theme_dark_primary"
android:textSize="30sp"
android:textStyle="bold" />
<Button
android:id="#+id/buttonMinus"
android:layout_width="wrap_content"
android:layout_height="75dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="10dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary2"
android:gravity="center"
android:text="-"
android:textAlignment="center"
android:textColor="#color/md_theme_dark_primary"
android:textSize="30sp"
android:textStyle="bold" />
<Button
android:id="#+id/buttonPlus"
android:layout_width="wrap_content"
android:layout_height="75dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="10dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary2"
android:gravity="center"
android:text="+"
android:textAlignment="center"
android:textColor="#color/md_theme_dark_primary"
android:textSize="30sp"
android:textStyle="bold" />
<Button
android:id="#+id/buttonEquality"
android:layout_width="wrap_content"
android:layout_height="75dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="10dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary2"
android:gravity="center"
android:text="="
android:textAlignment="center"
android:textColor="#color/md_theme_dark_primary"
android:textSize="30sp"
android:textStyle="bold" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="horizontal"
android:layout_gravity="bottom"
>
<Button
android:id="#+id/button7"
android:text="7"
android:layout_marginTop="1dp"
android:layout_width="wrap_content"
android:layout_height="120dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary"
android:gravity="center"
android:textAlignment="center"
android:textSize="30sp"
android:textStyle="bold"
android:padding="8dp" />
<Button
android:id="#+id/button8"
android:layout_width="wrap_content"
android:layout_height="120dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary"
android:gravity="center"
android:text="8"
android:textAlignment="center"
android:textSize="30sp"
android:textStyle="bold"
android:layout_marginTop="1dp"
android:padding="8dp" />
<Button
android:id="#+id/button9"
android:layout_width="wrap_content"
android:layout_height="120dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary"
android:gravity="center"
android:text="9"
android:textAlignment="center"
android:textSize="30sp"
android:textStyle="bold"
android:layout_marginTop="1dp"
android:padding="8dp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="horizontal"
android:layout_gravity="bottom">
<Button
android:id="#+id/button4"
android:text="4"
android:layout_marginTop="1dp"
android:layout_width="wrap_content"
android:layout_height="120dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary"
android:gravity="center"
android:textAlignment="center"
android:textSize="30sp"
android:textStyle="bold"
android:padding="8dp"
/>
<Button
android:id="#+id/button5"
android:layout_width="wrap_content"
android:layout_height="120dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary"
android:gravity="center"
android:text="5"
android:textAlignment="center"
android:textSize="30sp"
android:textStyle="bold"
android:layout_marginTop="1dp"
android:padding="8dp" />
<Button
android:id="#+id/button6"
android:layout_width="wrap_content"
android:layout_height="120dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary"
android:gravity="center"
android:text="6"
android:textAlignment="center"
android:textSize="30sp"
android:textStyle="bold"
android:layout_marginTop="1dp"
android:padding="8dp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="horizontal"
android:layout_gravity="bottom">
<Button
android:id="#+id/button1"
android:text="1"
android:layout_marginTop="1dp"
android:layout_width="wrap_content"
android:layout_height="120dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary"
android:gravity="center"
android:textAlignment="center"
android:textSize="30sp"
android:textStyle="bold"
android:padding="8dp" />
<Button
android:id="#+id/button2"
android:text="2"
android:layout_width="wrap_content"
android:layout_height="120dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary"
android:gravity="center"
android:textAlignment="center"
android:textSize="30sp"
android:textStyle="bold"
android:layout_marginTop="1dp"
android:padding="8dp" />
<Button
android:id="#+id/button3"
android:layout_width="wrap_content"
android:layout_height="120dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary"
android:gravity="center"
android:text="3"
android:textAlignment="center"
android:textSize="30sp"
android:textStyle="bold"
android:layout_marginTop="1dp"
android:padding="8dp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="horizontal"
android:layout_gravity="bottom"
android:layout_marginBottom="5dp">
<Button
android:id="#+id/buttonPoint"
android:text="."
android:layout_marginTop="1dp"
android:layout_width="wrap_content"
android:layout_height="120dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary2"
android:gravity="center"
android:textAlignment="center"
android:textSize="30sp"
android:textStyle="bold"
android:padding="8dp" />
<Button
android:id="#+id/button0"
android:text="0"
android:layout_width="wrap_content"
android:layout_height="120dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary"
android:gravity="center"
android:textAlignment="center"
android:textSize="30sp"
android:textStyle="bold"
android:layout_marginTop="1dp"
android:padding="8dp" />
<Button
android:id="#+id/buttonDelete"
android:layout_width="wrap_content"
android:layout_height="120dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary2"
android:gravity="center"
android:text="DEL"
android:textAlignment="center"
android:textSize="30sp"
android:textStyle="bold"
android:textColor="#color/md_theme_dark_error"
android:layout_marginTop="1dp"
android:padding="8dp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_marginBottom="60dp"
android:orientation="horizontal"
android:layout_gravity="bottom">
<Button
android:id="#+id/buttonClear"
android:layout_width="wrap_content"
android:layout_height="75dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:backgroundTint="#color/md_theme_dark_onPrimary2"
android:gravity="center"
android:text="CLEAR"
android:textAlignment="center"
android:textSize="30sp"
android:textStyle="bold"
android:textColor="#color/md_theme_dark_error"
android:layout_marginTop="1dp"
android:padding="8dp" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
Fragment with scrollview
Hi guys. Here is my current design. Linear layout with scroll view on left side with buttons keeps on expanding depending how many buttons i put. What i'm trying to do is it keep it fix size and let the scroll view do it work. I keep on changing the minWidth and minHeigth and even the layout_width and layout_height in fix size but it still keeps on expanding. Any idea what im doing wrong?.Thanks
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:minWidth="800dp"
android:minHeight="600dp"
android:weightSum="100">
<!--Top Title Bar-->
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="15"
android:weightSum="100"
android:background="#drawable/AppBarBackground">
<TextView
android:id="#+id/tvCompanyName"
android:fontFamily="#string/fontFamily"
android:text="Reports"
android:textColor="#color/white"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="15"
android:gravity="center|left"
android:textSize="#dimen/textSizeSmall"
android:textStyle="bold"
android:paddingLeft="20dp"
android:paddingRight="10dp" />
</LinearLayout>
<!--Content Layout-->
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="85"
android:weightSum="100">
<!--Buttons Left Size-->
<ScrollView
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="30"
android:fillViewport="false">
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#drawable/BackgroundWhite">
<Button
android:id="#+id/btnXReadRpt"
android:textAllCaps="false"
android:fontFamily="#string/fontFamily"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:layout_gravity="center"
android:gravity="center"
android:background="#drawable/ButtonSelectorBorderBaseColor"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:textColor="#color/blue"
android:text="X-Read"
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp"
android:layout_weight="5" />
<Button
android:id="#+id/btnZReadRpt"
android:textAllCaps="false"
android:fontFamily="#string/fontFamily"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:layout_gravity="center"
android:gravity="center"
android:background="#drawable/ButtonSelectorBorderBaseColor"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:textColor="#color/blue"
android:text="Z-Read"
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp"
android:layout_weight="5" />
<Button
android:id="#+id/btnSalesRpt"
android:textAllCaps="false"
android:fontFamily="#string/fontFamily"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:layout_gravity="center"
android:gravity="center"
android:background="#drawable/ButtonSelectorBorderBaseColor"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:textColor="#color/blue"
android:text="Sales"
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp"
android:layout_weight="5" />
<Button
android:id="#+id/btnDiscountRpt"
android:textAllCaps="false"
android:fontFamily="#string/fontFamily"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:layout_gravity="center"
android:gravity="center"
android:background="#drawable/ButtonSelectorBorderBaseColor"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:textColor="#color/blue"
android:text="Discount"
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp"
android:layout_weight="5" />
<Button
android:id="#+id/btnItemVoidRpt"
android:textAllCaps="false"
android:fontFamily="#string/fontFamily"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:layout_gravity="center"
android:gravity="center"
android:background="#drawable/ButtonSelectorBorderBaseColor"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:textColor="#color/blue"
android:text="Item Void"
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp"
android:layout_weight="5" />
<Button
android:id="#+id/btnTransVoidRpt"
android:textAllCaps="false"
android:fontFamily="#string/fontFamily"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:layout_gravity="center"
android:gravity="center"
android:background="#drawable/ButtonSelectorBorderBaseColor"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:textColor="#color/blue"
android:text="Transaction Void"
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp"
android:layout_weight="5" />
<Button
android:id="#+id/btnZReadRpt"
android:textAllCaps="false"
android:fontFamily="#string/fontFamily"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:layout_gravity="center"
android:gravity="center"
android:background="#drawable/ButtonSelectorBorderBaseColor"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:textColor="#color/blue"
android:text="Z-Read"
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp"
android:layout_weight="5" />
<Button
android:id="#+id/btnSalesRpt"
android:textAllCaps="false"
android:fontFamily="#string/fontFamily"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:layout_gravity="center"
android:gravity="center"
android:background="#drawable/ButtonSelectorBorderBaseColor"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:textColor="#color/blue"
android:text="Sales"
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp"
android:layout_weight="5" />
<Button
android:id="#+id/btnDiscountRpt"
android:textAllCaps="false"
android:fontFamily="#string/fontFamily"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:layout_gravity="center"
android:gravity="center"
android:background="#drawable/ButtonSelectorBorderBaseColor"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:textColor="#color/blue"
android:text="Discount"
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp"
android:layout_weight="5" />
<Button
android:id="#+id/btnItemVoidRpt"
android:textAllCaps="false"
android:fontFamily="#string/fontFamily"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:layout_gravity="center"
android:gravity="center"
android:background="#drawable/ButtonSelectorBorderBaseColor"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:textColor="#color/blue"
android:text="Item Void"
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp"
android:layout_weight="5" />
<Button
android:id="#+id/btnTransVoidRpt"
android:textAllCaps="false"
android:fontFamily="#string/fontFamily"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:layout_gravity="center"
android:gravity="center"
android:background="#drawable/ButtonSelectorBorderBaseColor"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:textColor="#color/blue"
android:text="Transaction Void"
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp"
android:layout_weight="5" />
</LinearLayout>
</ScrollView>
<LinearLayout
android:orientation="vertical"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="70"
android:weightSum="100"
android:background="#drawable/BackgroundWhite" />
</LinearLayout>
</LinearLayout>
What i'm trying to do is it keep it fix size and let the scroll view do it work.
Try to set a fixed size to ScrollView instead of using match_parent.
For example:
<ScrollView
android:layout_width="0dp"
android:layout_height="200dp"
android:layout_weight="30"
android:fillViewport="false">
...
</ScrollView>
And the result is:
If you want your layout to be fixed sized You need to set your height width fixed
i.e.
android:layout_width="YOUR WIDTH"
android:layout_height="YOUR_HEIGHT"
I have used Relative layout with some views. I need to align the views in horizontally, but the views are not displaying same in all the screen size devices?
<RelativeLayout
android:id="#+id/layout_relative"
android:layout_width="fill_parent"
android:layout_height="90dp"
android:layout_marginTop="-5dp"
android:background="#007DD7">
<TextView
android:id="#+id/text1_login"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_gravity="center"
android:layout_marginLeft="45dp"
android:layout_marginTop="10dp"
android:background="#drawable/circle"
android:backgroundTint="#color/white"
android:gravity="center"
android:shadowRadius="10.0"
android:text="1"
android:textColor="#android:color/holo_blue_dark"
android:textSize="18sp" />
<TextView
android:id="#+id/text2_login"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/text1_login"
android:layout_marginTop="5dp"
android:layout_marginBottom="10dp"
android:layout_marginLeft="45dp"
android:paddingLeft="3dp"
android:paddingRight="3dp"
android:text="Login"
android:textColor="#color/white"
android:textSize="20sp" />
<View
android:id="#+id/1_line"
android:layout_centerHorizontal="#+id/text1_login"
android:layout_width="70dp"
android:layout_height="2dp"
android:layout_marginLeft="90dp"
android:layout_marginTop="30dp"
android:background="#android:color/white"
android:backgroundTint="#color/add_contact_selected"/>
<TextView
android:id="#+id/text1_delivery"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_gravity="center"
android:layout_marginLeft="170dp"
android:layout_marginTop="10dp"
android:background="#drawable/circle"
android:shadowRadius="10.0"
android:text="2"
android:gravity="center"
android:textColor="#android:color/holo_blue_dark"
android:textSize="18sp"
android:backgroundTint="#color/add_contact_selected"/>
<TextView
android:id="#+id/text2_delivery"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/text1_delivery"
android:layout_marginTop="5dp"
android:layout_marginBottom="10dp"
android:layout_marginLeft="25dp"
android:gravity="center_horizontal"
android:maxLines="2"
android:paddingLeft="3dp"
android:paddingRight="3dp"
android:text="Delivery"
android:textColor="#color/add_contact_selected"
android:textSize="20sp" />
<View
android:id="#+id/2_line"
android:layout_centerHorizontal="#+id/text1_delivery"
android:layout_width="80dp"
android:layout_height="2dp"
android:layout_marginLeft="215dp"
android:layout_marginTop="30dp"
android:background="#android:color/white"
android:backgroundTint="#color/add_contact_selected"/>
<TextView
android:id="#+id/text1_payment"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_gravity="center"
android:layout_marginLeft="300dp"
android:layout_marginTop="10dp"
android:background="#drawable/circle"
android:gravity="center"
android:shadowRadius="10.0"
android:text="3"
android:textColor="#android:color/holo_blue_dark"
android:textSize="18sp"
android:backgroundTint="#color/add_contact_selected"/>
<TextView
android:id="#+id/text2_payment"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/text1_payment"
android:gravity="center_horizontal"
android:layout_marginTop="5dp"
android:layout_marginBottom="10dp"
android:layout_marginLeft="260dp"
android:maxLines="2"
android:paddingLeft="3dp"
android:paddingRight="3dp"
android:text="Payment"
android:textColor="#color/add_contact_selected"
android:textSize="20sp"
/>
</RelativeLayout>
You need to use LinearLayout with android:orientation="horizontal" and play with android:layout_weight to allign your views.
I've edited your code:
<LinearLayout
android:id="#+id/layout_linear"
android:layout_width="fill_parent"
android:layout_height="90dp"
android:layout_marginTop="-5dp"
android:background="#007DD7"
android:orientation="horizontal">
<LinearLayout
android:orientation="vertical"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center">
<TextView
android:id="#+id/text1_login"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_gravity="center"
android:layout_marginTop="10dp"
android:background="#drawable/circle"
android:backgroundTint="#color/white"
android:gravity="center"
android:shadowRadius="10.0"
android:text="1"
android:textColor="#android:color/holo_blue_dark"
android:textSize="18sp" />
<TextView
android:id="#+id/text2_login"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/text1_login"
android:layout_marginTop="5dp"
android:layout_marginBottom="10dp"
android:paddingLeft="3dp"
android:paddingRight="3dp"
android:text="Login"
android:textColor="#color/white"
android:textSize="20sp" />
<View
android:id="#+id/1_line"
android:layout_width="fill_parent"
android:layout_height="2dp"
android:background="#android:color/white"
android:backgroundTint="#color/add_contact_selected"/>
</LinearLayout>
<LinearLayout
android:orientation="vertical"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center">
<TextView
android:id="#+id/text1_delivery"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_gravity="center"
android:layout_marginTop="10dp"
android:background="#drawable/circle"
android:shadowRadius="10.0"
android:text="2"
android:gravity="center"
android:textColor="#android:color/holo_blue_dark"
android:textSize="18sp"
android:backgroundTint="#color/add_contact_selected"/>
<TextView
android:id="#+id/text2_delivery"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/text1_delivery"
android:layout_marginTop="5dp"
android:layout_marginBottom="10dp"
android:gravity="center_horizontal"
android:maxLines="2"
android:paddingLeft="3dp"
android:paddingRight="3dp"
android:text="Delivery"
android:textColor="#color/add_contact_selected"
android:textSize="20sp" />
</LinearLayout>
<LinearLayout
android:orientation="vertical"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center">
<TextView
android:id="#+id/text1_payment"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_gravity="center"
android:layout_marginTop="10dp"
android:background="#drawable/circle"
android:gravity="center"
android:shadowRadius="10.0"
android:text="3"
android:textColor="#android:color/holo_blue_dark"
android:textSize="18sp"
android:backgroundTint="#color/add_contact_selected"/>
<TextView
android:id="#+id/text2_payment"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/text1_payment"
android:gravity="center_horizontal"
android:layout_marginTop="5dp"
android:layout_marginBottom="10dp"
android:maxLines="2"
android:paddingLeft="3dp"
android:paddingRight="3dp"
android:text="Payment"
android:textColor="#color/add_contact_selected"
android:textSize="20sp"
/>
</LinearLayout>
</LinearLayout>
Update: add the horizontal line between circles:
<RelativeLayout
android:orientation="vertical"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1">
<TextView
android:id="#+id/text1_login"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_gravity="center"
android:layout_marginTop="10dp"
android:background="#drawable/circle"
android:backgroundTint="#color/white"
android:gravity="center"
android:shadowRadius="10.0"
android:text="1"
android:textColor="#android:color/holo_blue_dark"
android:textSize="18sp"
android:layout_centerHorizontal="true" />
<TextView
android:id="#+id/text2_login"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/text1_login"
android:layout_marginTop="5dp"
android:layout_marginBottom="10dp"
android:paddingLeft="3dp"
android:paddingRight="3dp"
android:text="Login"
android:textColor="#color/white"
android:textSize="20sp"
android:layout_centerHorizontal="true" />
<View
android:id="#+id/1_line"
android:layout_width="match_parent"
android:layout_height="2dp"
android:background="#android:color/white"
android:backgroundTint="#color/add_contact_selected"
android:layout_marginTop="30dp"
android:layout_toRightOf="#+id/text1_login" />
</RelativeLayout>
<RelativeLayout
android:orientation="vertical"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1">
<View
android:id="#+id/2_line"
android:layout_width="match_parent"
android:layout_height="2dp"
android:background="#android:color/white"
android:backgroundTint="#color/add_contact_selected"
android:layout_marginTop="30dp"
android:layout_toLeftOf="#+id/text1_delivery" />
<TextView
android:id="#+id/text1_delivery"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_gravity="center"
android:layout_marginTop="10dp"
android:background="#drawable/circle"
android:shadowRadius="10.0"
android:text="2"
android:textColor="#android:color/holo_blue_dark"
android:textSize="18sp"
android:backgroundTint="#color/add_contact_selected"
android:gravity="center"
android:layout_centerHorizontal="true" />
<View
android:id="#+id/22_line"
android:layout_width="match_parent"
android:layout_height="2dp"
android:background="#android:color/white"
android:backgroundTint="#color/add_contact_selected"
android:layout_marginTop="30dp"
android:layout_toRightOf="#+id/text1_delivery" />
<TextView
android:id="#+id/text2_delivery"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/text1_delivery"
android:layout_marginTop="5dp"
android:layout_marginBottom="10dp"
android:gravity="center_horizontal"
android:maxLines="2"
android:paddingLeft="3dp"
android:paddingRight="3dp"
android:text="Delivery"
android:textColor="#color/add_contact_selected"
android:textSize="20sp"
android:layout_centerHorizontal="true" />
</RelativeLayout>
<RelativeLayout
android:orientation="vertical"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1">
<View
android:id="#+id/3_line"
android:layout_width="match_parent"
android:layout_height="2dp"
android:background="#android:color/white"
android:backgroundTint="#color/add_contact_selected"
android:layout_marginTop="30dp"
android:layout_toLeftOf="#+id/text1_payment" />
<TextView
android:id="#+id/text1_payment"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_gravity="center"
android:layout_marginTop="10dp"
android:background="#drawable/circle"
android:gravity="center"
android:shadowRadius="10.0"
android:text="3"
android:textColor="#android:color/holo_blue_dark"
android:textSize="18sp"
android:backgroundTint="#color/add_contact_selected"
android:layout_centerHorizontal="true" />
<TextView
android:id="#+id/text2_payment"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/text1_payment"
android:gravity="center_horizontal"
android:layout_marginTop="5dp"
android:layout_marginBottom="10dp"
android:maxLines="2"
android:paddingLeft="3dp"
android:paddingRight="3dp"
android:text="Payment"
android:textColor="#color/add_contact_selected"
android:textSize="20sp"
android:layout_centerHorizontal="true" />
</RelativeLayout>
To align views horizontally , you should use Linear Layout with horizontal orientation and assign weights to each child views.
Check this example which i have written using your layout -
<LinearLayout
android:id="#+id/layout_relative"
android:layout_width="fill_parent"
android:layout_height="90dp"
android:layout_marginTop="-5dp"
android:orientation="horizontal"
android:background="#007DD7">
<TextView
android:id="#+id/text1_login"
android:layout_width="0dp"
android:layout_height="40dp"
android:layout_gravity="center"
android:layout_marginLeft="45dp"
android:layout_marginTop="10dp"
android:background="#drawable/circle"
android:backgroundTint="#color/white"
android:gravity="center"
android:shadowRadius="10.0"
android:text="1"
android:layout_weight="1"
android:textColor="#android:color/holo_blue_dark"
android:textSize="18sp" />
<TextView
android:id="#+id/text2_login"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_marginTop="5dp"
android:layout_marginBottom="10dp"
android:layout_marginLeft="45dp"
android:paddingLeft="3dp"
android:paddingRight="3dp"
android:text="Login"
android:textColor="#color/white"
android:textSize="20sp" />
<TextView
android:id="#+id/text1_delivery"
android:layout_width="0dp"
android:layout_height="40dp"
android:layout_weight="1"
android:layout_gravity="center"
android:layout_marginLeft="170dp"
android:layout_marginTop="10dp"
android:background="#drawable/circle"
android:shadowRadius="10.0"
android:text="2"
android:gravity="center"
android:textColor="#android:color/holo_blue_dark"
android:textSize="18sp"
android:backgroundTint="#color/add_contact_selected"/>
</LinearLayout>
I saw all the answers people who has suggest to use LinearLayout.One thing you have to know very clearly.By using the Relative or Linear we can achieve all the layout design.
First you have to analyse which design will be good.Implementation may be depends on three things.
1.Easy designing
2.Layout performance
3.How much you know about attributes of layout.
My suggestion also Linear only for your implementation but some times multiple inner linear layout will cause performance issue and this also you should aware of it.
How we are developing the code is not important,how we are optimizing the code is very important.
This question already has answers here:
How to support different screen size in android
(9 answers)
Closed 8 years ago.
I've made an android app and spent quite a bit of time making it fit perfectly on my screen (specifically part marked as "this part" on xml). To my surprise, everything appears out of place in other screens. How do I make sure that it looks the same in all screens?
XML:
<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:background="#drawable/wood"
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.luanca.charangomaster.ChordActivity"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="3">
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_weight="1">
<TextView
android:id="#+id/chordintip"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="#string/choose_root" />
<Button
android:id="#+id/chordin"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/dark_plank"
android:text=""
android:textColor="#ffffff" />
</LinearLayout>
<LinearLayout
android:id="#+id/emptymiddle"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_weight="1">
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_toRightOf="#+id/emptymiddle"
android:layout_weight="1">
<TextView
android:id="#+id/chordintip2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="#string/choose_type" />
<Button
android:id="#+id/chordin2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/dark_plank"
android:text=""
android:textColor="#ffffff" />
</LinearLayout>
</LinearLayout>
<TextView
android:id="#+id/tip1"
android:layout_width="match_parent"
android:layout_height="30dp"
android:gravity="center"
android:text="#string/help" />
<!--This part doesn't fill all screens -->
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:scaleType="fitCenter"
android:src="#drawable/chord_box1"
/>
<LinearLayout
android:id="#+id/tabgrid"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignBottom="#+id/imageView1"
android:layout_alignTop="#+id/imageView1"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:gravity="center_horizontal"
android:orientation="vertical"
android:weightSum="10" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="10dp"
android:layout_weight="1"
android:gravity="center_horizontal"
android:orientation="horizontal"></LinearLayout>
<LinearLayout
android:id="#+id/firstrow"
android:layout_width="match_parent"
android:layout_height="10dp"
android:layout_weight="1.15"
android:gravity="center_horizontal"
android:orientation="horizontal" >
<Button
android:id="#+id/empty1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text=""
android:visibility="invisible" />
<TextView
android:id="#+id/fretposition1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_weight="1"
android:gravity="center"
android:text="1"
android:textColor="#000000"/>
<TextView
android:id="#+id/fretposition2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_weight="1"
android:gravity="center"
android:text="2"
android:textColor="#000000"/>
<TextView
android:id="#+id/fretposition3"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_weight="1"
android:gravity="center"
android:text="3"
android:textColor="#000000"/>
<TextView
android:id="#+id/fretposition4"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_weight="1"
android:gravity="center"
android:text="4"
android:textColor="#000000"/>
<TextView
android:id="#+id/fretposition5"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_weight="1"
android:gravity="center"
android:text="5"
android:textColor="#000000"/>
<Button
android:id="#+id/empty2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button"
android:visibility="invisible" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="10dp"
android:layout_alignTop="#+id/firstrow"
android:layout_weight="1.15"
android:gravity="center_horizontal"
android:orientation="horizontal" >
<Button
android:id="#+id/empty4"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.55"
android:text=""
android:visibility="invisible" />
<Button
android:id="#+id/fret10"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginRight="-20dp"
android:layout_weight="1"
android:background="#drawable/no_press1"
android:text=""
android:textColor="#ffffff" />
<Button
android:id="#+id/fret11"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="1"
android:textColor="#ffffff" />
<Button
android:id="#+id/fret12"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="2"
android:textColor="#ffffff" />
<Button
android:id="#+id/fret13"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="3"
android:textColor="#ffffff" />
<Button
android:id="#+id/fret14"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="4"
android:textColor="#ffffff" />
<Button
android:id="#+id/fret15"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="1"
android:textColor="#ffffff" />
<Button
android:id="#+id/empty3"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button"
android:visibility="invisible" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="10dp"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_weight="1.15"
android:gravity="center_horizontal"
android:orientation="horizontal" >
<Button
android:id="#+id/empty5"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.55"
android:text=""
android:visibility="invisible" />
<Button
android:id="#+id/fret20"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginRight="-20dp"
android:layout_weight="1"
android:background="#drawable/no_press1"
android:text=""
android:textColor="#ffffff" />
<Button
android:id="#+id/fret21"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="1"
android:textColor="#ffffff" />
<Button
android:id="#+id/fret22"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="2"
android:textColor="#ffffff" />
<Button
android:id="#+id/fret23"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="3"
android:textColor="#ffffff" />
<Button
android:id="#+id/fret24"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="4"
android:textColor="#ffffff" />
<Button
android:id="#+id/fret25"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="1"
android:textColor="#ffffff" />
<Button
android:id="#+id/empty6"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button"
android:visibility="invisible" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="10dp"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_weight="1.15"
android:gravity="center_horizontal"
android:orientation="horizontal" >
<Button
android:id="#+id/empty7"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.55"
android:text=""
android:visibility="invisible" />
<Button
android:id="#+id/fret30"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginRight="-20dp"
android:layout_weight="1"
android:background="#drawable/no_press1"
android:text=""
android:textColor="#ffffff" />
<Button
android:id="#+id/fret31"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="1"
android:textColor="#ffffff" />
<Button
android:id="#+id/fret32"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="2"
android:textColor="#ffffff" />
<Button
android:id="#+id/fret33"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="3"
android:textColor="#ffffff" />
<Button
android:id="#+id/fret34"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="4"
android:textColor="#ffffff" />
<Button
android:id="#+id/fret35"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="1"
android:textColor="#ffffff" />
<Button
android:id="#+id/empty8"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button"
android:visibility="invisible" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="10dp"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_weight="1.15"
android:gravity="center_horizontal"
android:orientation="horizontal" >
<Button
android:id="#+id/empty9"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.55"
android:text=""
android:visibility="invisible" />
<Button
android:id="#+id/fret40"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginRight="-20dp"
android:layout_weight="1"
android:background="#drawable/no_press1"
android:text=""
android:textColor="#ffffff" />
<Button
android:id="#+id/fret41"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="1"
android:textColor="#ffffff" />
<Button
android:id="#+id/fret42"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="2"
android:textColor="#ffffff" />
<Button
android:id="#+id/fret43"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="3"
android:textColor="#ffffff" />
<Button
android:id="#+id/fret44"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="4"
android:textColor="#ffffff" />
<Button
android:id="#+id/fret45"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="1"
android:textColor="#ffffff" />
<Button
android:id="#+id/empty10"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text=""
android:visibility="invisible" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="10dp"
android:layout_marginBottom="10dp"
android:layout_weight="1.15"
android:gravity="center_horizontal"
android:orientation="horizontal" >
<Button
android:id="#+id/empty11"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.55"
android:text=""
android:visibility="invisible" />
<Button
android:id="#+id/fret50"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginRight="-20dp"
android:layout_weight="1"
android:background="#drawable/no_press1"
android:text=""
android:textColor="#ffffff" />
<Button
android:id="#+id/fret51"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="1"
android:textColor="#ffffff" />
<Button
android:id="#+id/fret52"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="2"
android:textColor="#ffffff" />
<Button
android:id="#+id/fret53"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="3"
android:textColor="#ffffff" />
<Button
android:id="#+id/fret54"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="4"
android:textColor="#ffffff" />
<Button
android:id="#+id/fret55"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="1"
android:textColor="#ffffff" />
<Button
android:id="#+id/empty12"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text=""
android:visibility="invisible" />
</LinearLayout>
<Button
android:id="#+id/empty13"
android:layout_width="0dp"
android:layout_height="10dp"
android:layout_weight="1.15"
android:text=""
android:visibility="invisible" />
</LinearLayout>
</RelativeLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal">
<RadioButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=""
android:id="#+id/radioButton"
android:clickable="false"
android:checked="false"
android:visibility="gone" />
<RadioButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=""
android:id="#+id/radioButton2"
android:clickable="false"
android:visibility="gone" />
<RadioButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=""
android:id="#+id/radioButton3"
android:clickable="false"
android:visibility="gone" />
<RadioButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=""
android:id="#+id/radioButton4"
android:clickable="false"
android:visibility="gone" />
<RadioButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=""
android:id="#+id/radioButton5"
android:clickable="false"
android:visibility="gone" />
</LinearLayout>
</LinearLayout>
My drawables:
You can move all your dp values to dimen.xml, dimen.xml(large), etc. , and set different values for all screensizes.
You have to create different layouts (.xmls) for different different screen resolutions and place it in layout folder accordingly
res/layout/my_layout.xml // layout for normal screen size ("default")
res/layout-small/my_layout.xml // layout for small screen size
res/layout-large/my_layout.xml // layout for large screen size
res/layout-xlarge/my_layout.xml // layout for extra large screen size
res/layout-xlarge-land/my_layout.xml // layout for extra large in landscape orientation
Or else you have to create layout without hardcoded heights or widths and with the help of scrollViews you can access that view
I am making an app in which I am doing the following:
25 buttons (the red, 5x5) that are equally distributed throughout an image in the background and on the left side 5 buttons (brown) a bit closer to the edge.
I have looked at a few similar questions here, with relative layout, but the problem is that as soon as I adjust for one screen size, it doesn't fit with another any more...
Here is how it looks on my phone screen:
On other screensizes:
Here is my code:
(a bunch of code before that, but part about the image):
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:scaleType="fitXY"
android:src="#drawable/chord_box1" />
<LinearLayout
android:id="#+id/firstrow"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/imageView1"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:gravity="center_horizontal"
android:orientation="vertical"
android:weightSum="10" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_weight="4"
android:gravity="center_horizontal"
android:orientation="horizontal" >
<Button
android:id="#+id/empty1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button"
android:visibility="invisible" />
<TextView
android:id="#+id/fretposition1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_weight="1"
android:gravity="center"
android:text="1" />
<TextView
android:id="#+id/fretposition2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_weight="1"
android:gravity="center"
android:text="2" />
<TextView
android:id="#+id/fretposition3"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_weight="1"
android:gravity="center"
android:text="3" />
<TextView
android:id="#+id/fretposition4"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_weight="1"
android:gravity="center"
android:text="4" />
<TextView
android:id="#+id/fretposition5"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_weight="1"
android:gravity="center"
android:text="5" />
<Button
android:id="#+id/empty2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button"
android:visibility="invisible" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_weight="1.1"
android:gravity="center_horizontal"
android:orientation="horizontal" >
<Button
android:id="#+id/empty4"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.55"
android:text=""
android:visibility="invisible" />
<Button
android:id="#+id/fret10"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginRight="-20dp"
android:layout_weight="1"
android:background="#drawable/no_press1"
android:text=""
android:textColor="#ffffff" />
<Button
android:id="#+id/fret11"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="1"
android:textColor="#ffffff" />
<Button
android:id="#+id/fret12"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="2"
android:textColor="#ffffff" />
<Button
android:id="#+id/fret13"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="3"
android:textColor="#ffffff" />
<Button
android:id="#+id/fret14"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="4"
android:textColor="#ffffff" />
<Button
android:id="#+id/fret15"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="1"
android:textColor="#ffffff" />
<Button
android:id="#+id/empty3"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button"
android:visibility="invisible" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_weight="1"
android:gravity="center_horizontal"
android:orientation="horizontal" >
<Button
android:id="#+id/empty5"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.55"
android:text=""
android:visibility="invisible" />
<Button
android:id="#+id/fret20"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginRight="-20dp"
android:layout_weight="1"
android:background="#drawable/no_press1"
android:text=""
android:textColor="#ffffff" />
<Button
android:id="#+id/fret21"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="1"
android:textColor="#ffffff" />
<Button
android:id="#+id/fret22"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="2"
android:textColor="#ffffff" />
<Button
android:id="#+id/fret23"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="3"
android:textColor="#ffffff" />
<Button
android:id="#+id/fret24"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="4"
android:textColor="#ffffff" />
<Button
android:id="#+id/fret25"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="1"
android:textColor="#ffffff" />
<Button
android:id="#+id/empty6"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button"
android:visibility="invisible" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_weight="1"
android:gravity="center_horizontal"
android:orientation="horizontal" >
<Button
android:id="#+id/empty7"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.55"
android:text=""
android:visibility="invisible" />
<Button
android:id="#+id/fret30"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginRight="-20dp"
android:layout_weight="1"
android:background="#drawable/no_press1"
android:text=""
android:textColor="#ffffff" />
<Button
android:id="#+id/fret31"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="1"
android:textColor="#ffffff" />
<Button
android:id="#+id/fret32"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="2"
android:textColor="#ffffff" />
<Button
android:id="#+id/fret33"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="3"
android:textColor="#ffffff" />
<Button
android:id="#+id/fret34"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="4"
android:textColor="#ffffff" />
<Button
android:id="#+id/fret35"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="1"
android:textColor="#ffffff" />
<Button
android:id="#+id/empty8"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button"
android:visibility="invisible" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_weight="1"
android:gravity="center_horizontal"
android:orientation="horizontal" >
<Button
android:id="#+id/empty9"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.55"
android:text=""
android:visibility="invisible" />
<Button
android:id="#+id/fret40"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginRight="-20dp"
android:layout_weight="1"
android:background="#drawable/no_press1"
android:text=""
android:textColor="#ffffff" />
<Button
android:id="#+id/fret41"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="1"
android:textColor="#ffffff" />
<Button
android:id="#+id/fret42"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="2"
android:textColor="#ffffff" />
<Button
android:id="#+id/fret43"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="3"
android:textColor="#ffffff" />
<Button
android:id="#+id/fret44"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="4"
android:textColor="#ffffff" />
<Button
android:id="#+id/fret45"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="1"
android:textColor="#ffffff" />
<Button
android:id="#+id/empty10"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text=""
android:visibility="invisible" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:layout_weight="1"
android:gravity="center_horizontal"
android:orientation="horizontal" >
<Button
android:id="#+id/empty11"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.55"
android:text=""
android:visibility="invisible" />
<Button
android:id="#+id/fret50"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginRight="-20dp"
android:layout_weight="1"
android:background="#drawable/no_press1"
android:text=""
android:textColor="#ffffff" />
<Button
android:id="#+id/fret51"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="1"
android:textColor="#ffffff" />
<Button
android:id="#+id/fret52"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="2"
android:textColor="#ffffff" />
<Button
android:id="#+id/fret53"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="3"
android:textColor="#ffffff" />
<Button
android:id="#+id/fret54"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="4"
android:textColor="#ffffff" />
<Button
android:id="#+id/fret55"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/finger1"
android:text="1"
android:textColor="#ffffff" />
<Button
android:id="#+id/empty12"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text=""
android:visibility="invisible" />
</LinearLayout>
<Button
android:id="#+id/empty13"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text=""
android:visibility="invisible" />
</LinearLayout>
</RelativeLayout>
I've made the first row and tried to make it fit, but I'm not sure how to make it fit on different screens. Is this the right way to do it, or should it maybe be done on the java code instead of the xml?
Change the layout_height of your top-level LinearLayout to "match_parent". Then it will cover the entire screen vertically.
<LinearLayout
android:id="#+id/firstrow"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignBottom="#+id/imageView1"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:gravity="center_horizontal"
android:orientation="vertical"
android:weightSum="10" >
You might need to re-adjust the weights to make it look exactly as it did before.