Membuat Fragment [62] ~ In My Post 33

A. Fragment

Fragment merupakan salah satu dari berbagai macam komponen yang ada di antar muka(interface) android. Fragment merupakan sub activity yang berada didalam activity. Fragment memberikan sebuah Activity memiliki banyak tampilan, fragment juga dapat diganti, ditambahkan atau bahkan dapat digunakan kembali. Berikut ialah perbedaan antara activity dan fragment :

Fragmet by developer.android.com

B. Fragment Lifecycle

Fragment1 by developer.android.com

Pada gambar disamping ialah Lifecycle yang dilakukan oleh sebuah fragment. Mari kita pelajari apa maksud dari lifecycle ini :

§onAttach(Activity) : digunakan untuk memanggil 1 kali ketika menempel di Activity.

§onCreate(Bundle) : digunakan untuk mempersiapkan fragment.

§onCreateView(LayoutInflater, ViewGroup, Bundle) : menciptakan dan menampilkan kembali secara hirarki View.

§onActivityCreated(Bundle) : method ini dipanggil setelah method onCreate().

§onViewStateRestored(Bundle) : digunakan untuk menyatakan informasi kepada fragment bahwa semua akan disimpan ke dalam state (layar) dari tampilan fragment secara hirarki yang telah dipulihkan.

§onStart() : digunakan untuk membuat fragment terlihat.

§onResume() : digunakan untuk membuat fragment interaktif.

§onPause() : digunakan jika fragment tidak lagi interaktif.

§onStop() :digunakan jika fragment tidak lagi terlihat.

§onDestroyView() : digunakan untuk membersihkan resources (sumber daya.

§onDestroy() : digunakan untuk membersihkan akhir resources (sumber daya )dari layar fragment.

§onDetach() : digunakan ketika fragment ,tidak lagi ada di Activity.

C. Membuat Project Menggunakan Fragmnet

Kali ini kita akan membuat project tentang fragmet. Project ini akan hanya membutuhkan 1 mainactivity dengan 4 fragment. Fragment ini akan menggunakan Fragment Transaction dan FragmentManager. Fragment Transaction digunakan untuk antarmuka yang menghubungkan object fragment kedalam activity. Fragment Transaction juga mengatur refrensi yang terkait dengan fragment.

Sedangkan FragmentManager memilki banyak kegunaan yang penting untuk fragment :

Menambah Fragment
Mengganti Fragment
Menyimpan fragment kedalam state ketika tombol back diklik
Menghapus fragment
Mengeksekusi fragment transaction
Transmisi animasi fragment

Berikut langkah-langkah menambah fragment kedalam activity:

Pastikan kita memiliki project yang sudah siap digunakan. (Empty Activity)
Buat 4 Fragment (Blank) dengan cara New =>Fragment =>Fragment (Blank) klik finish :
Berikutnya kita akan memasukkan sebuah kode kedalam sebuah file layout yang telah kita buat buka direktori res/layout, terlihat banyak layout yang telah dibuat(buat sebanyak 4 kali sebuah blank_fragment):

Kemudian kita akan edit file xml dan java satu persatu dengan cara :

Pada file activity_main.xml isikan kode berikut

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/frame_content"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">
</FrameLayout>

2.      Lalu pada file fragment_pertma.xml isikan kode 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="match_parent"
    android:background="#43A047"
    >
    <Button
        android:text="Masuk ke FragmentKedua"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerVertical="true"
        android:layout_centerHorizontal="true"
        android:id="@+id/button1"
        android:textAllCaps="false"/>

    <TextView
        android:text="Disini Fragment Pertama"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="78dp"
        android:id="@+id/textView"
        android:textSize="24sp"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"/>
</RelativeLayout>

3.      Kemudian dalam file fragment_kedua.xml di isi kode berikut ini :

<?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="match_parent"
    android:background="#D32F2F"
    >
    <Button
        android:text="Masuk ke FragmentKetiga"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerVertical="true"
        android:layout_centerHorizontal="true"
        android:id="@+id/button1"
        android:textAllCaps="false"/>

    <TextView
        android:text="Disini Fragment Kedua"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="78dp"
        android:id="@+id/textView"
        android:textSize="24sp"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        />
</RelativeLayout>

4.      Selanjutnya edit file fragment_ketiga.xml lalu isikan kode berikut ini :

<?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="match_parent"
    android:background="#1A237E"
    >

    <Button
        android:text="Masuk ke FragmentKeempat"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerVertical="true"
        android:layout_centerHorizontal="true"
        android:id="@+id/button1"
        android:textAllCaps="false"/>

    <TextView
        android:text="Disni Fragment Ketiga"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="78dp"
        android:id="@+id/textView"
        android:textSize="24sp"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        />

</RelativeLayout>

5.      Kemudian isi fragment_keempat dengan kode berikut ini :

<?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="match_parent"
    android:background="#FF5722"
    >

    <TextView
        android:text="Selamat datang- - In Fragment Ke-4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="217dp"
        android:id="@+id/textview1"
        android:textSize="30sp"
        android:textStyle="normal|bold"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"/>

    <TextView
        android:text="Disini Fragment Keempat"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="78dp"
        android:id="@+id/textView"
        android:textSize="24sp"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        />

</RelativeLayout>

6.      Kemudian saatnya kita edit file java. Isikan file MainActivity.java dengan kode berikut.

package com.blogspot.iu33.belajarfragment;

import android.os.Bundle;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentTransaction;
import android.support.v7.app.AppCompatActivity;

public class MainActivity extends AppCompatActivity {
    /*
    Fathurrahman(okedroid.com)

     */
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        FragmentManager fragmentManager = getSupportFragmentManager();
       /* *getSupportFragmentManager = inisialisasi nilai FragmentManager untuk berinteraksi
            dengan Activity saat ini
       */
        FragmentTransaction transaction = fragmentManager.beginTransaction();
        //memulai transaction fragment manager

        FragmentPertama fragmentPertama = new FragmentPertama();
        //membuat object fragmentPertama
        transaction.add(R.id.frame_content, fragmentPertama);
        //menambahkan fragment
        transaction.addToBackStack("fragmentPertama");
        //dapat menyimpan fragment ke dalam state ,ketika tombol back diklik
        transaction.commit();
        //mengeksekusi fragment transaction

    }

}

7.      Sekarang kita isikan file java FragmentPertama.java dengan kode berikut ini :

package com.blogspot.iu33.belajarfragment;

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentTransaction;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.Button;

/**
* A simple {@link Fragment} subclass.
*/
public class FragmentPertama extends Fragment {

    private Button buttonSatu;

    public FragmentPertama() {
        // Required empty public constructor
    }

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        // Inflate the layout for this fragment
        View view = inflater.inflate(R.layout.fragment_fragment_pertama, container, false);
        ((MainActivity) getActivity()).getSupportActionBar().setSubtitle("fragment pertama");
        ((MainActivity) getActivity()).getSupportActionBar().setSubtitle("(fragment_pertama.xml)");
        ((MainActivity)getActivity()).getSupportActionBar().setDisplayHomeAsUpEnabled(false);
        buttonSatu = (Button) view.findViewById(R.id.button1    );

        return view;
    }

    @Override
    public void onActivityCreated(Bundle savedInstanceState) {
        super.onActivityCreated(savedInstanceState);

        buttonSatu.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                FragmentKedua fragmentKedua = new FragmentKedua();
                getFragmentManager().beginTransaction().replace(R.id.frame_content, fragmentKedua)
                        .addToBackStack(null)
                        .setTransition(FragmentTransaction.TRANSIT_FRAGMENT_OPEN).commit();

            }
        });
    }
}

8.      Isikan file java FragmentKedua.java dengan kode berikut :

package com.blogspot.iu33.belajarfragment;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentTransaction;
import android.view.LayoutInflater;
import android.view.MenuItem;
import android.view.View;
import android.view.ViewGroup;
import android.widget.Button;

/**
* A simple {@link Fragment} subclass.
*/
public class FragmentKedua extends Fragment {

    private Button buttonSatu;
    public FragmentKedua() {
        // Required empty public constructor
    }

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.fragment_kedua, container, false);
        ((MainActivity) getActivity()).getSupportActionBar().setTitle("Fragment Kedua");
        ((MainActivity) getActivity()).getSupportActionBar().setSubtitle("(fragment_kedua.xml)");
        ((MainActivity)getActivity()).getSupportActionBar().setDisplayHomeAsUpEnabled(true);
        buttonSatu = (Button) view.findViewById(R.id.button1);
        setHasOptionsMenu(true);

        // Inflate the layout for this fragment
        return view;

    }

    @Override
    public void onActivityCreated(Bundle savedInstanceState) {
        super.onActivityCreated(savedInstanceState);
        buttonSatu.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                FragmentKetiga fragmentKetiga = new FragmentKetiga();
                getFragmentManager().beginTransaction().replace(R.id.frame_content, fragmentKetiga)
                        .addToBackStack(null)
                        .setTransition(FragmentTransaction.TRANSIT_FRAGMENT_OPEN)
                        .commit();
            }
        });
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        if (item.getItemId()== android.R.id.home) {
            getFragmentManager().popBackStack();
        }
        return super.onOptionsItemSelected(item);
    }
}

9.      Lalu isi file FragmentKetiga.java , isikan kode berikut ini :

package com.blogspot.iu33.belajarfragment;

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentTransaction;
import android.view.LayoutInflater;
import android.view.MenuItem;
import android.view.View;
import android.view.ViewGroup;
import android.widget.Button;

/**
* A simple {@link Fragment} subclass.
*/
public class FragmentKetiga extends Fragment {

    private Button buttonSatu;
    public FragmentKetiga() {
        // Required empty public constructor
    }

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
       View view = inflater.inflate(R.layout.fragment_ketiga, container, false);
        ((MainActivity) getActivity()).getSupportActionBar().setTitle("Fragment Ketiga");
        ((MainActivity) getActivity()).getSupportActionBar().setSubtitle("(fragment_ketiga.xml)");
        ((MainActivity)getActivity()).getSupportActionBar().setDisplayHomeAsUpEnabled(true);
        buttonSatu = (Button) view.findViewById(R.id.button1);
        setHasOptionsMenu(true);

        // Inflate the layout for this fragment
        return view;

    }

    @Override
    public void onActivityCreated(Bundle savedInstanceState) {
        super.onActivityCreated(savedInstanceState);
        buttonSatu.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                FragmentKeempat fragmentKeempat = new FragmentKeempat();
                getFragmentManager().beginTransaction().replace(R.id.frame_content, fragmentKeempat)
                        .addToBackStack(null)
                        .setTransition(FragmentTransaction.TRANSIT_FRAGMENT_OPEN)
                        .commit();
            }
        });
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        if (item.getItemId()== android.R.id.home) {
            getFragmentManager().popBackStack();
        }
        return super.onOptionsItemSelected(item);
    }
}

10. Selanjtnya isi FragmentKeempat di isikan kode berikut ini :

package com.blogspot.iu33.belajarfragment;

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.MenuItem;
import android.view.View;
import android.view.ViewGroup;
import android.widget.Button;

public class FragmentKeempat extends Fragment {

    private Button buttonSatu;
    public FragmentKeempat() {
        // Required empty public constructor
    }

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.fragment_keempat, container, false);
        ((MainActivity) getActivity()).getSupportActionBar().setTitle("Fragment Keempat");
        ((MainActivity) getActivity()).getSupportActionBar().setSubtitle("(fragment_keempat.xml)");
        ((MainActivity)getActivity()).getSupportActionBar().setDisplayHomeAsUpEnabled(true);
        buttonSatu = (Button) view.findViewById(R.id.button1);
        setHasOptionsMenu(true);

        // Inflate the layout for this fragment
        return view;

    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        if (item.getItemId()== android.R.id.home) {
            getFragmentManager().popBackStack();
        }
        return super.onOptionsItemSelected(item);
    }
}

Dan berikut ialah hasil dari project diatas:

Sekian untuk postingan kali ini. Mohon maaf apabila tampilan kurang memuaskan. Terima Kasih

About Admin

This is dummy text. It is not meant to be read. Accordingly, it is difficult to figure out when to end it. But then, this is dummy text. It is not meant to be read. Period.

In My Post 33

Membuat Fragment [62]

About Admin

Related Post