Android LinearLayout Tutorial/Example
In this Tutorial, I will tell how to use LinearLayout and Its attribute to create proper layouts for your application.
So, Let’s Start and get to know about various attributes:-
1.orientation=”vertical”
<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:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity" android:orientation="vertical"> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@mipmap/ic_launcher"/> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@mipmap/ic_launcher"/> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@mipmap/ic_launcher"/> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@mipmap/ic_launcher"/> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@mipmap/ic_launcher"/> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@mipmap/ic_launcher"/> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@mipmap/ic_launcher"/> </LinearLayout>
Output
2. orientation=”horizontal”
layout.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:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity" android:orientation="horizontal"> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@mipmap/ic_launcher"/> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@mipmap/ic_launcher"/> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@mipmap/ic_launcher"/> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@mipmap/ic_launcher"/> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@mipmap/ic_launcher"/> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@mipmap/ic_launcher"/> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@mipmap/ic_launcher"/> </LinearLayout>
Output
3. layout_gravity=”center”
layout.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:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity" android:orientation="vertical"> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@mipmap/ic_launcher" android:layout_gravity="center"/> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@mipmap/ic_launcher" android:layout_gravity="center"/> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@mipmap/ic_launcher" android:layout_gravity="center"/> </LinearLayout>
Output
4. layout_gravity=”start” or layout_gravity=”left”
layout.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:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity" android:orientation="vertical"> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@mipmap/ic_launcher" android:layout_gravity="start"/> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@mipmap/ic_launcher" android:layout_gravity="start"/> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@mipmap/ic_launcher" android:layout_gravity="start"/> </LinearLayout>
Output
5. layout_gravity=”end” or layout_gravity=”right”
layout.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:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity" android:orientation="vertical"> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@mipmap/ic_launcher" android:layout_gravity="end"/> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@mipmap/ic_launcher" android:layout_gravity="end"/> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@mipmap/ic_launcher" android:layout_gravity="end"/> </LinearLayout>
Output
6. android:gravity= “center” or android:foregroundGravity= “center” this works when width=”fill_parent” or width=”match_parent”
layout_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:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity" android:orientation="vertical"> <ImageView android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@mipmap/ic_launcher" android:foregroundGravity="center"/> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@mipmap/ic_launcher" android:gravity="center"/> <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@mipmap/ic_launcher" android:layout_gravity="clip_horizontal"/> </LinearLayout>
Output
7. layout_weight=”1″. equally distribute the height within all views of parent layout in orientation=”vertical” and vice-versa
layout.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:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity" android:orientation="vertical" android:weightSum="3"> <ImageView android:layout_width="wrap_content" android:layout_height="0dp" android:layout_weight="1" android:background="@mipmap/ic_launcher" /> <ImageView android:layout_width="wrap_content" android:layout_height="0dp" android:layout_weight="1" android:background="@mipmap/ic_launcher" /> <ImageView android:layout_width="wrap_content" android:layout_height="0dp" android:layout_weight="1" android:background="@mipmap/ic_launcher" /> </LinearLayout>
Output