Membuat layout xml 3 kolom di android studio

Bismillahirrohmaanirrohiim…

Setelah kesana kemari mencari cara bagaimana Membuat layout xml tiga (3) kolom di android studio, akhirnya ketemu, yaitu menggunakan RelativeLayout.

Berikut kode xml nya:

<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="88dp">

    <ImageView
        android:id="@+id/image_view"
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:layout_alignParentTop="true"
        android:layout_centerVertical="true"
        android:layout_marginLeft="16dp"
        android:layout_marginStart="16dp"
        android:layout_marginTop="20dp"
        tools:src="@drawable/ic_skip_previous_black_24dp"/>

    <TextView
        android:id="@+id/text_view1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true"
        android:layout_alignParentTop="true"
        android:layout_marginLeft="72dp"
        android:layout_marginStart="72dp"
        android:layout_marginRight="56dp"
        android:layout_marginEnd="56dp"
        android:layout_marginTop="16dp"
        android:maxLines="1"
        android:textSize="16sp"
        android:textColor="?android:attr/textColorPrimary"
        tools:text="This is the title line"/>

    <TextView
        android:id="@+id/text_view2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true"
        android:layout_below="@+id/text_view1"
        android:layout_marginLeft="72dp"
        android:layout_marginStart="72dp"
        android:layout_marginRight="56dp"
        android:layout_marginEnd="56dp"
        android:maxLines="1"
        android:textSize="14sp"
        android:textColor="?android:attr/textColorSecondary"
        tools:text="This is the second line"/>

    <TextView
        android:id="@+id/text_view3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true"
        android:layout_below="@+id/text_view2"
        android:layout_marginLeft="72dp"
        android:layout_marginStart="72dp"
        android:layout_marginRight="56dp"
        android:layout_marginEnd="56dp"
        android:maxLines="1"
        android:textSize="14sp"
        android:textColor="?android:attr/textColorSecondary"
        tools:text="This is the third line"/>

    <ImageView
        android:id="@+id/image_view_2"
        android:layout_width="24dp"
        android:layout_height="24dp"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true"
        android:layout_alignParentTop="true"
        android:layout_marginRight="16dp"
        android:layout_marginEnd="16dp"
        android:layout_marginTop="20dp"
        tools:src="@drawable/ic_skip_next_black_24dp"/>

</RelativeLayout>

 

Kode xml yang lain, yang menggunakan posisi ID, sebagai berikut:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:paddingBottom="8dp"
    android:paddingLeft="16dp"
    android:paddingRight="16dp"
    android:paddingTop="8dp">

    <ImageView
        android:id="@+id/user_image"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_centerVertical="true"
        android:src="@drawable/ic_action_name"/>

    <ImageView
        android:id="@+id/action_image"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_centerVertical="true"
        android:src="@drawable/ic_action_name"/>

    <TextView
        android:id="@+id/name_tv"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:layout_toLeftOf="@+id/action_image"
        android:layout_toRightOf="@+id/user_image"
        android:padding="5dp"
        android:text="XYZ"/>

    <TextView
        android:id="@+id/number_tv"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/name_tv"
        android:layout_toLeftOf="@+id/action_image"
        android:layout_toRightOf="@+id/user_image"
        android:padding="5dp"
        android:text="12345"/>

</RelativeLayout>

Silahkan dicoba dan hasilnya bisa langsung dilihat.