Creating Fragments Using Android Studio

Creating Fragments Using Android Studio

Think of a fragment as a modular application section that has it on inputs and life cycle.You can refer it as a sub-activity.
This subactivity can be reused in another application.This article will show you how to extend Fragment class and using support library so that the application will be compatible with other devices running an Android version below 1.6.

Create new Android Project

Open Android Studio,go to File ,New Android Project.

Enter Android Project name.

Minimum required SDK for this project is Android 3.0 or higher. I selected 4.0

Create Empty Activity.

Enter Activity Name

Your final created Object should look like this.

Create Main Activity Layout

We are going to create two Buttons, fragment and add them to LinearLayout. Go to res>layout>activity_main.xml.  Open activity_main.xml and paste below code.

<?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"

    xmlns:tools="http://schemas.android.com/tools"

    android:layout_width="match_parent"

    android:layout_height="match_parent"

    android:orientation="vertical"

    tools:context="com.example.acer.fragmentexample.MainActivity">

    <Button

        android:id="@+id/button1"

        android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:text="Fragment No 1"

        android:onClick="selectFragment"

        />

    <Button

        android:id="@+id/button2"

        android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:text="Fragment No 2"

        android:onClick="selectFragment"

        />

    <fragment

        android:name="com.example.acer.fragmentexample.FragmentOne"

        android:layout_width="match_parent"

        android:layout_height="match_parent"

        android:id="@+id/fragment_location"

/>

</LinearLayout>

In design, View You should see this.

Creating Fragments

Open com.example.acer.fragmentexample  package and create a New Fragment.Specify Blank Fragment.

Click Fragment(Blank) and Then Specify Fragment name as OneFragment.

This will automatically create Fragment Layout and Fragment Java files.OneFragment.java  file

package com.example.acer.fragmentexample;

import android.os.Bundle;

import android.app.Fragment;

import android.view.LayoutInflater;

import android.view.View;

import android.view.ViewGroup;

/**

 * A simple {@link Fragment} subclass.

 */

public class OneFragment extends Fragment {

    public OneFragment() {

        // Required empty public constructor

    }

    @Override

    public View onCreateView(LayoutInflater inflater, ViewGroup container,

                             Bundle savedInstanceState) {

        // Inflate the layout for this fragment

        return inflater.inflate(R.layout.fragment_one, container, false);

    }

}

   Fragment_one.xml

<FrameLayout 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"

    tools:context="com.example.acer.fragmentexample.OneFragment">

    <!-- TODO: Update blank fragment layout -->

    <TextView

        android:layout_width="match_parent"

        android:layout_height="match_parent"

        android:text="Hello...This is Fragment one" />

</FrameLayout>

TwoFragment.java

package com.example.acer.fragmentexample;

import android.os.Bundle;

import android.app.Fragment;

import android.view.LayoutInflater;

import android.view.View;

import android.view.ViewGroup;

/**

 * A simple {@link Fragment} subclass.

 */

public class TwoFragment extends Fragment {

    public TwoFragment() {

        // Required empty public constructor

    }

    @Override

    public View onCreateView(LayoutInflater inflater, ViewGroup container,

                             Bundle savedInstanceState) {

        // Inflate the layout for this fragment

        return inflater.inflate(R.layout.fragment_two, container, false);

    }

}

   fragment_two.xml

<FrameLayout 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"

    tools:context="com.example.acer.fragmentexample.TwoFragment">

    <!-- TODO: Update blank fragment layout -->

    <TextView

        android:layout_width="match_parent"

        android:layout_height="match_parent"

        android:text="Hello..this is Fragment two" />

</FrameLayout>

Coding the MainActivity.

We will implement selectFragment method in the mainactivity that is responsible for interchanging between the two fragments when we click the two buttons.

package com.example.acer.fragmentexample;

import android.support.v7.app.AppCompatActivity;

import android.os.Bundle;

import android.view.View;

import android.app.Fragment;

import android.app.FragmentTransaction;

import android.app.FragmentManager;

public class MainActivity extends AppCompatActivity {

    @Override

    protected void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_main);

    }

    public void selectFragment(View view) {

        Fragment fragment;

        if (view == findViewById(R.id.button1)) {

            fragment = new OneFragment();

        } else {

            fragment = new TwoFragment();

        }

        FragmentManager fm = getFragmentManager();

        FragmentTransaction ft = fm.beginTransaction();

        ft.replace(R.id.fragment_location, fragment);

        ft.commit();

    }}

Running Application

How application is now complete. Run it and you should see below window.   Downloadthe whole application code here.