Membuat TabLayout Untuk Navigasi Antar Halaman
Dalam pengembangan aplikasi Android, navigasi antar halaman adalah salah satu fitur yang paling penting. Salah satu cara untuk mengimplementasikan navigasi antar halaman adalah dengan menggunakan TabLayout. Pada artikel ini, kita akan membahas cara membuat TabLayout untuk navigasi antar halaman pada aplikasi Android.
Apa itu TabLayout?
TabLayout adalah sebuah komponen UI yang dapat digunakan untuk menavigasi antar halaman pada aplikasi Android. TabLayout dapat menampilkan beberapa tab yang dapat dipilih oleh pengguna untuk menavigasi ke halaman yang berbeda. Setiap tab dapat memiliki label dan ikon yang unik.
Komponen yang Dibutuhkan
Untuk membuat TabLayout, kita membutuhkan beberapa komponen berikut:
- Activity: Activity adalah komponen dasar pada aplikasi Android yang dapat menampilkan UI dan menerima input dari pengguna.
- TabLayout: TabLayout adalah komponen UI yang dapat digunakan untuk menavigasi antar halaman.
- ViewPager: ViewPager adalah komponen UI yang dapat digunakan untuk menampilkan konten halaman yang berbeda.
- PagerAdapter: PagerAdapter adalah adapter yang dapat digunakan untuk mengisi konten halaman pada ViewPager.
Langkah-Langkah Membuat TabLayout
Berikut adalah langkah-langkah membuat TabLayout untuk navigasi antar halaman pada aplikasi Android:
Langkah 1: Buat Proyek Baru
Buka Android Studio dan buat proyek baru. Pilih "Empty Activity" sebagai template proyek.
Langkah 2: Tambahkan Komponen TabLayout
Buka file layout activity_main.xml dan tambahkan komponen TabLayout seperti berikut:
<?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">
<com.google.android.material.tabs.TabLayout
android:id="@+id/tab_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabIndicatorColor="@color/white"
app:tabTextColor="@color/white" />
<androidx.viewpager.widget.ViewPager
android:id="@+id/view_pager"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
Langkah 3: Tambahkan PagerAdapter
Buat class baru yang bernama PagerAdapter
dan tambahkan kode berikut:
import androidx.fragment.app.Fragment;
import androidx.fragment.app.FragmentManager;
import androidx.fragment.app.FragmentPagerAdapter;
public class PagerAdapter extends FragmentPagerAdapter
private Fragment[] fragments;
private String[] titles;
public PagerAdapter(FragmentManager fragmentManager, Fragment[] fragments, String[] titles)
super(fragmentManager);
this.fragments = fragments;
this.titles = titles;
@Override
public Fragment getItem(int position)
return fragments[position];
@Override
public int getCount()
return fragments.length;
@Override
public CharSequence getPageTitle(int position)
return titles[position];
Langkah 4: Tambahkan Fragment
Buat class baru yang bernama Fragment1
, Fragment2
, dan Fragment3
yang mewarisi class Fragment
. Tambahan kode berikut pada setiap class fragment:
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
public class Fragment1 extends Fragment
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState)
View view = inflater.inflate(R.layout.fragment1, container, false);
return view;
Langkah 5: Tambahkan Kode pada Activity
Buka file MainActivity.java
dan tambahkan kode berikut:
import androidx.appcompat.app.AppCompatActivity;
import androidx.fragment.app.Fragment;
import androidx.fragment.app.FragmentManager;
import androidx.viewpager.widget.ViewPager;
import android.os.Bundle;
import com.google.android.material.tabs.TabLayout;
public class MainActivity extends AppCompatActivity
private TabLayout tabLayout;
private ViewPager viewPager;
private Fragment[] fragments;
private String[] titles;
@Override
protected void onCreate(Bundle savedInstanceState)
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
tabLayout = findViewById(R.id.tab_layout);
viewPager = findViewById(R.id.view_pager);
fragments = new Fragment[] new Fragment1(), new Fragment2(), new Fragment3();
titles = new String[] "TAB 1", "TAB 2", "TAB 3";
PagerAdapter pagerAdapter = new PagerAdapter(getSupportFragmentManager(), fragments, titles);
viewPager.setAdapter(pagerAdapter);
tabLayout.setupWithViewPager(viewPager);
Hasil
Jalankan aplikasi dan hasilnya akan seperti berikut:
Kesimpulan
Membuat TabLayout untuk navigasi antar halaman pada aplikasi Android dapat dilakukan dengan beberapa langkah sederhana. Dengan menggunakan komponen TabLayout, ViewPager, dan PagerAdapter, kita dapat membuat navigasi antar halaman yang mudah dan efisien.