Android Development Steps: 2015

Saturday, November 14, 2015

203 Android Studio Replace Fragments

This tutorial demonstrates how to replace a fragment (main) with another fragment (sub).

1) START UP

Follow the previous tutorial or download startup file here.

It is recommended that you follow and understand the steps in the previous tutorial before attempting this tutorial.

2) DUPLICATE FILES

2.1) Duplicate fragment_main.xml as fragment_sub.xml

Edit as follows (delete the EditText and Button view objects)

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout

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"

android:paddingLeft="@dimen/activity_horizontal_margin"

android:paddingRight="@dimen/activity_horizontal_margin"

android:paddingTop="@dimen/activity_vertical_margin"

android:paddingBottom="@dimen/activity_vertical_margin"

tools:context=".MainActivity"

android:orientation="horizontal">

<TextView android:text="This is Sub"

android:layout_width="wrap_content"

android:layout_height="wrap_content" />

</LinearLayout>

2.2) Duplicate MainActivityFragment.java as SubActivityFragment.java

Edit as follows (Delete all methods except onCreateView() and SubActivityFragment() and change the layout reference to fragment_sub)

package com.notarazi.myfragments2;

import android.os.Bundle;

import android.support.v4.app.Fragment;

import android.view.LayoutInflater;

import android.view.View;

import android.view.ViewGroup;

/**

* A placeholder fragment containing a simple view.

public class SubActivityFragment extends Fragment {

public SubActivityFragment() {

}

@Override

public View onCreateView(LayoutInflater inflater, ViewGroup container,

Bundle savedInstanceState) {

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

}

2.3) Edit MainActivity.java

(We want the application to display the second fragment when the user tap the Action Button)

package com.notarazi.myfragments2;

import android.os.Bundle;

import android.support.design.widget.FloatingActionButton;

import android.support.design.widget.Snackbar;

import android.support.v4.app.Fragment;

import android.support.v4.app.FragmentManager;

import android.support.v4.app.FragmentTransaction;

import android.support.v7.app.AppCompatActivity;

import android.support.v7.widget.Toolbar;

import android.view.Menu;

import android.view.MenuItem;

import android.view.View;

public class MainActivity extends AppCompatActivity {

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

setFragment(new MainActivityFragment());

Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);

setSupportActionBar(toolbar);

FloatingActionButton fab = (FloatingActionButton) findViewById(R.id.fab);

fab.setOnClickListener(new View.OnClickListener() {

@Override

public void onClick(View view) {

Snackbar.make(view, "Replace with your own action", Snackbar.LENGTH_LONG)

.setAction("Action", null).show();

}

});

}

@Override

public boolean onCreateOptionsMenu(Menu menu) {

// Inflate the menu; this adds items to the action bar if it is present.

getMenuInflater().inflate(R.menu.menu_main, menu);

return true;

}

@Override

public boolean onOptionsItemSelected(MenuItem item) {

// Handle action bar item clicks here. The action bar will

// automatically handle clicks on the Home/Up button, so long

// as you specify a parent activity in AndroidManifest.xml.

int id = item.getItemId();

//noinspection SimplifiableIfStatement

if (id == R.id.action_settings) {

return true;

}

if (id == R.id.action_send) {

//Call setFragment to replace the fragment

setFragment(new SubActivityFragment());

return true;

}

return super.onOptionsItemSelected(item);

}

protected void setFragment(Fragment fragment) {

FragmentManager fragmentManager = getSupportFragmentManager();

FragmentTransaction fragmentTransaction = fragmentManager.beginTransaction();

fragmentTransaction.replace(R.id.FragmentContainer, fragment);

fragmentTransaction.commit();

}

OUTCOME.

At this stage, if the user presses Back Button after second fragment is displayed, Android System will return to Home Screen.

We can add a flag to set the BackStack property so that when the user presses Back Button, the application returns to the first fragment.

MainActivity.java

package com.notarazi.myfragments2;

import android.os.Bundle;

import android.support.design.widget.FloatingActionButton;

import android.support.design.widget.Snackbar;

import android.support.v4.app.Fragment;

import android.support.v4.app.FragmentManager;

import android.support.v4.app.FragmentTransaction;

import android.support.v7.app.AppCompatActivity;

import android.support.v7.widget.Toolbar;

import android.view.Menu;

import android.view.MenuItem;

import android.view.View;

public class MainActivity extends AppCompatActivity {

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

setFragment(new MainActivityFragment(),0);

Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);

setSupportActionBar(toolbar);

FloatingActionButton fab = (FloatingActionButton) findViewById(R.id.fab);

fab.setOnClickListener(new View.OnClickListener() {

@Override

public void onClick(View view) {

Snackbar.make(view, "Replace with your own action", Snackbar.LENGTH_LONG)

.setAction("Action", null).show();

}

});

}

@Override

public boolean onCreateOptionsMenu(Menu menu) {

// Inflate the menu; this adds items to the action bar if it is present.

getMenuInflater().inflate(R.menu.menu_main, menu);

return true;

}

@Override

public boolean onOptionsItemSelected(MenuItem item) {

// Handle action bar item clicks here. The action bar will

// automatically handle clicks on the Home/Up button, so long

// as you specify a parent activity in AndroidManifest.xml.

int id = item.getItemId();

//noinspection SimplifiableIfStatement

if (id == R.id.action_settings) {

return true;

}

if (id == R.id.action_send) {

setFragment(new SubActivityFragment(), 1);

return true;

}

return super.onOptionsItemSelected(item);

}

protected void setFragment(Fragment fragment, int backstackyes) {

FragmentManager fragmentManager = getSupportFragmentManager();

FragmentTransaction fragmentTransaction = fragmentManager.beginTransaction();

if (backstackyes==1) {fragmentTransaction.addToBackStack(null);}

fragmentTransaction.replace(R.id.FragmentContainer, fragment);

fragmentTransaction.commit();

}

OUTCOME.

Tap the Action Button. (The user sees the second fragment)

Tap the Back Button. (The user gets back the first fragment)

DOWNLOAD

MyFragments2_ReplaceFragments.zip

202 Android Studio Fragments

This tutorial demonstrates the manual set up of fragments.

This tutorial is designed for Android Studio Version 1.4

1) GETTING STARTED

1.1) Create a new project.

Name: MyFragments2

1.2) Form Factors.

Phone and Tablet. API 14.

1.3) Activity Template.

Blank Activity.

1.4) Customize Activity.

Accept Defaults

DO NOT SELECT “Use a Fragment”

1.5) Done.

2) ADD A FRAGMENT

2.1) Edit content_main.xml

res/layout/content_main.xml

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"

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

xmlns:app="http://schemas.android.com/apk/res-auto"

android:id="@+id/FragmentContainer"

android:layout_width="match_parent"

android:layout_height="match_parent"

app:layout_behavior="@string/appbar_scrolling_view_behavior"

tools:layout="@layout/fragment_main"

2.2) Add fragment_main.xml

res/layout/fragment_main.xml

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout

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"

android:paddingLeft="@dimen/activity_horizontal_margin"

android:paddingRight="@dimen/activity_horizontal_margin"

android:paddingTop="@dimen/activity_vertical_margin"

android:paddingBottom="@dimen/activity_vertical_margin"

tools:context=".MainActivity"

android:orientation="horizontal">

<TextView android:text="Name:"

android:layout_width="wrap_content"

android:layout_height="wrap_content" />

<EditText

android:id="@+id/edit_message"

android:layout_width="0dp"

android:layout_weight="1"

android:layout_height="wrap_content"

android:hint="Type name here..." />

<Button

android:id="@+id/send_message"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="Send"

</LinearLayout>

2.2) Edit fragment controller

MainActivityFragment.java

package com.notarazi.myfragments2;

import android.os.Bundle;

import android.support.v4.app.Fragment;

import android.view.LayoutInflater;

import android.view.Menu;

import android.view.MenuInflater;

import android.view.MenuItem;

import android.view.View;

import android.view.ViewGroup;

import android.widget.Button;

import android.widget.EditText;

import android.widget.Toast;

/**

* A placeholder fragment containing a simple view.

public class MainActivityFragment extends Fragment {

public MainActivityFragment() {

}

@Override

public void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setHasOptionsMenu(true);

}

@Override

public void onCreateOptionsMenu(Menu menu, MenuInflater inflater) {

inflater.inflate(R.menu.menu_fragment, menu);

}

@Override

public boolean onOptionsItemSelected(MenuItem item) {

int id = item.getItemId();

if(id == R.id.action_send){

//Do whatever you want to do

EditText editText = (EditText) getActivity().findViewById(R.id.edit_message);

Toast.makeText(getActivity().getApplicationContext(), "You have entered,\n" + editText.getText().toString(), Toast.LENGTH_LONG).show();

return true;

}

return super.onOptionsItemSelected(item);

}

@Override

public View onCreateView(LayoutInflater inflater, ViewGroup container,

Bundle savedInstanceState) {

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

}

@Override

public void onActivityCreated(Bundle savedInstanceState)

{

// TODO Auto-generated method stub

super.onActivityCreated(savedInstanceState);

Button sendButton = (Button) getActivity().findViewById(R.id.send_message);

sendButton.setOnClickListener(new View.OnClickListener() {

@Override

public void onClick(View v) {

sendMessage(v);

}

});

}

public void sendMessage(View view) {

EditText editText = (EditText) getActivity().findViewById(R.id.edit_message);

Toast.makeText(getActivity().getApplicationContext(), "You have entered, \n" + editText.getText().toString(), Toast.LENGTH_LONG).show();

}

2.3) Add fragment menu

res/layout/menu_fragment.xml

<menu 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" tools:context=".MainActivity">

<item

android:id="@+id/action_send"

android:title="fragment action"

android:icon="@android:drawable/ic_menu_send"

android:orderInCategory="10"

app:showAsAction="always" />

</menu>

2.4) Edit Main Controller

MainActivity.java

package com.notarazi.myfragments2;

import android.os.Bundle;

import android.support.design.widget.FloatingActionButton;

import android.support.design.widget.Snackbar;

import android.support.v4.app.Fragment;

import android.support.v4.app.FragmentManager;

import android.support.v4.app.FragmentTransaction;

import android.support.v7.app.AppCompatActivity;

import android.support.v7.widget.Toolbar;

import android.view.Menu;

import android.view.MenuItem;

import android.view.View;

public class MainActivity extends AppCompatActivity {

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

setFragment(new MainActivityFragment());

Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);

setSupportActionBar(toolbar);

FloatingActionButton fab = (FloatingActionButton) findViewById(R.id.fab);

fab.setOnClickListener(new View.OnClickListener() {

@Override

public void onClick(View view) {

Snackbar.make(view, "Replace with your own action", Snackbar.LENGTH_LONG)

.setAction("Action", null).show();

}

});

}

// This could be moved into an abstract BaseActivity

// class for being re-used by several instances

protected void setFragment(Fragment fragment) {

FragmentManager fragmentManager = getSupportFragmentManager();

FragmentTransaction fragmentTransaction = fragmentManager.beginTransaction();

fragmentTransaction.replace(R.id.FragmentContainer, fragment);

fragmentTransaction.commit();

}

@Override

public boolean onCreateOptionsMenu(Menu menu) {

// Inflate the menu; this adds items to the action bar if it is present.

getMenuInflater().inflate(R.menu.menu_main, menu);

return true;

}

@Override

public boolean onOptionsItemSelected(MenuItem item) {

// Handle action bar item clicks here. The action bar will

// automatically handle clicks on the Home/Up button, so long

// as you specify a parent activity in AndroidManifest.xml.

int id = item.getItemId();

//noinspection SimplifiableIfStatement

if (id == R.id.action_settings) {

return true;

}

OUTCOME

DOWNLOAD

MyFragments2_setFragment.zip