'Dividing Layout vertically in two equal parts
I have to divide the screen into 2 equal parts vertically.But i am not able to find where I am doing wrong!! I have used layout_height="0dp" and layout_weight="1" for both LinearLayout but still result is same.
I checked this post also
How to split the screen with two equal LinearLayouts?
How to divide screen into three parts vertically?
Still I was not able to achieve it.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="@color/profileImBg"
android:orientation="horizontal"
>
<ImageView
android:id="@+id/profileIm"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:src="@drawable/profileImage" />
</LinearLayout>
<android.support.v7.widget.CardView
android:id="@+id/card_view"
style="@style/cardStyle"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<android.support.v7.widget.GridLayout
android:id="@+id/buttonGrid"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginBottom="16dp"
android:layout_marginLeft="16dp"
android:layout_marginRight="16dp"
android:layout_marginTop="16dp"
app:columnCount="2"
app:rowCount="2">
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_marginBottom="8dp"
android:layout_marginRight="8dp"
android:text="Name"
android:textColor="#757575"
android:textSize="16sp"
app:layout_column="0"
app:layout_columnWeight="1"
app:layout_row="0"
/>
<TextView
android:id="@+id/name"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginBottom="8dp"
android:layout_marginLeft="8dp"
android:textColor="#757575"
android:textSize="20sp"
app:layout_column="1"
app:layout_columnWeight="1"
app:layout_row="0" />
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_marginBottom="8dp"
android:layout_marginRight="8dp"
android:text="Contact Number"
android:textColor="#757575"
android:textSize="16sp"
app:layout_column="0"
app:layout_columnWeight="1"
app:layout_row="1"
/>
<TextView
android:id="@+id/contactNumber"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginBottom="8dp"
android:layout_marginLeft="8dp"
android:textColor="#757575"
android:textSize="20sp"
app:layout_column="1"
app:layout_columnWeight="2"
app:layout_row="1" />
</android.support.v7.widget.GridLayout>
</android.support.v7.widget.CardView>
</LinearLayout>
Solution 1:[1]
Using Weight attribute you can achieve, use below code for same.
<LinearLayout android:orientation="horizontal" android:layout_height="fill_parent" android:layout_width="fill_parent">
<LinearLayout android:layout_weight="1" android:layout_height="fill_parent" android:layout_width="0dp"/>
<LinearLayout android:layout_weight="1" android:layout_height="fill_parent" android:layout_width="0dp"/>
</LinearLayout>
Solution 2:[2]
try using the new Library from the Percent Support Library:
dependencies{
compile 'com.android.support:percent:23.1.0'
}
Then:
<?xml version="1.0" encoding="utf-8">
<android.support.percent.PercentRelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<FrameLayout
android:id="@+id/frame1"
app:layout_heightPercent="50%"
android:layout_height="wrap_content"
android:layout_width="match_parent">
</FrameLayout>
<FrameLayout
android:layout_below="@+id/frame1"
app:layout_heightPercent="50%"
android:layout_height="wrap_content"
android:layout_width="match_parent">
</FrameLayout>
</android.support.percent.PercentRelativeLayout>
This also has support for PercentFrameLayout
So in your case this would look like:
<?xml version="1.0" encoding="utf-8">
<android.support.percent.PercentRelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<FrameLayout
android:id="@+id/frame1"
app:layout_heightPercent="50%"
android:layout_height="wrap_content"
android:layout_width="match_parent">
<ImageView
android:id="@+id/profileIm"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="center_vertical"
android:src="@drawable/profileImage" />
</FrameLayout>
<FrameLayout
app:layout_heightPercent="50%"
android:layout_below="@+id/frame1"
android:layout_height="wrap_content"
android:layout_width="match_parent">
<android.support.v7.widget.CardView
android:id="@+id/card_view"
style="@style/cardStyle"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v7.widget.GridLayout
... and so on ...>
</android.support.v7.widget.GridLayout>
</android.support.v7.widget.CardView>
</FrameLayout>
</android.support.percent.PercentRelativeLayout>
Solution 3:[3]
Use android:layout_weight and android:weightSum to divide layouts into equal parts. It is important to set layout_width as 0dp on children to make it work as intended.
On parent layout:
Set weightSum of parent Layout as 2 (android:weightSum="2")
On the child layout:
Set layout_width as 0dp (android:layout_width="0dp")
Set layout_weight as 1 [half of weight sum] (android:layout_weight="1")
<!-- Parent layout -->
<LinearLayout
android:id="@+id/layout_top"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="2">
<!-- Child layout -->
<LinearLayout
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_weight="1">
...
</LinearLayout>
</LinearLayout>
Solution 4:[4]
Try this
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:weightSum="2"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
......
>
</LinearLayout>
<android.support.v7.widget.CardView
android:id="@+id/card_view"
style="@style/cardStyle"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
....
</android.support.v7.widget.CardView>
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|---|
| Solution 1 | Asif Ghanchi |
| Solution 2 | |
| Solution 3 | Codemaker |
| Solution 4 | Vishavjeet Singh |