Membuat Tampilan Beranda dengan Table Layout di Android Studio

Salah satu layout yang bisa digunakan untuk membuat tampilan di Android Studio adalah Table Layout. Penulis suka memakai layout ini karena cukup mudah dimengerti kalau mentusun banyak konten.

Untuk membuat tampilan berikut, jangan lupa menyimpan 1 file gambar dengan nama logo di folder drawable di project kamu ya:

Sintaks / coding yang diperlukan untuk membuat tampilan seperti diatas adalah:

<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".CobaTabel">

    <TableRow
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginTop="20dp"
        android:gravity="center">
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Solusiweb.my.id"
            android:textAlignment="center"
            android:textColor="@color/black"
            android:textSize="24sp" />
    </TableRow>

    <TableRow
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginTop="30dp"
        android:gravity="center">
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Belajar Android"
            android:textAlignment="center" />
    </TableRow>

    <TableRow
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginTop="50dp"
        android:gravity="center">
        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/logo" />
    </TableRow>

    <TableRow
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginTop="40dp"
        android:gravity="center">
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:backgroundTint="#2196F3"
            android:text="Masuk" />
    </TableRow>

    <TableRow
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginTop="70dp"
        android:gravity="center">
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="RPL\n2021"
            android:textAlignment="center"
            android:textColor="@color/black"
            android:textSize="24sp" />
    </TableRow>
</TableLayout>

Selamat Mencoba Ya.

Leave a Reply