Hello Guys, Hopes You are Doing Well.
Today I am going to discuss Fragment and it use in Android. Fragment introduced in Android Version 3.0 (HoneyComb). To use the larger screen size device(Tablet). But now it is used actively in responsive design and reuse-ability of code. Before proceeding in depth the first basic question?
What is Fragment? and what is the benefit to use it?
A fragment is simply a block of UI, with its own life cycle, that can be reused within different activities. Fragments allow developers to create highly modular user interface components that can change dramatically based on screen sizes, orientation, and other aspects of the display that might be relevant to the design.
What is the inter-dependency between Activity and Fragment ?
A fragment must always be embedded in an activity and the fragment's life cycle is directly affected by the host activity's lifecycle. For example, when the activity is paused, so are all fragments in it, and when the activity is destroyed, so are all fragments. However, while an activity is running, you can manipulate each fragment independently, such as add or remove them.
When you perform such a fragment transaction, you can also add it to a back stack that's managed by the activity—each back stack entry in the activity is a record of the fragment transaction that occurred. The back stack allows the user to reverse a fragment transaction (navigate backwards), by pressing the Back button.
How We can add fragment and what is the process?
When you add a fragment as a part of your activity layout, it lives in a ViewGroup inside the activity's view hierarchy and the fragment defines its own view layout. You can insert a fragment into your activity layout by declaring the fragment in the activity's layout file, as a <fragment> element, or from your application code by adding it to an existing ViewGroup.
However, a fragment is not required to be a part of the activity layout; you may also use a fragment without its own UI as an invisible worker for the activity.
To define a new fragment you extend either the android.app.Fragment class or one of its subclasses, for example ListFragment, DialogFragment, PreferenceFragment or WebViewFragment. The following code shows an example implementation.
In that code I am showing two pan layout for tablet and single pan layout for device(Just like above given Images). There are 4 java class file and two xml file under layout folder and one xml file under layout-large.
Here is following java and xml file name:-
/src folder
1. HomeActivity .java
2. HeaderFragment.java
3. ArticleFragment.java
4. DataCenter.java
/layout folder
1. activity_home.xml
2. article_view.xml
/layout-large folder
1. news_articles.xml
I have putted the detailed description of individual function in comment. So please going through this code have a look on that comments. It help you to understand this code thoroughly.
2. HeadlineFragment
4. package com.sks.fragment;
Now xml file, at first under layout folder
2. article_view.xml
Today I am going to discuss Fragment and it use in Android. Fragment introduced in Android Version 3.0 (HoneyComb). To use the larger screen size device(Tablet). But now it is used actively in responsive design and reuse-ability of code. Before proceeding in depth the first basic question?
What is Fragment? and what is the benefit to use it?
A fragment is simply a block of UI, with its own life cycle, that can be reused within different activities. Fragments allow developers to create highly modular user interface components that can change dramatically based on screen sizes, orientation, and other aspects of the display that might be relevant to the design.
What is the inter-dependency between Activity and Fragment ?
A fragment must always be embedded in an activity and the fragment's life cycle is directly affected by the host activity's lifecycle. For example, when the activity is paused, so are all fragments in it, and when the activity is destroyed, so are all fragments. However, while an activity is running, you can manipulate each fragment independently, such as add or remove them.
When you perform such a fragment transaction, you can also add it to a back stack that's managed by the activity—each back stack entry in the activity is a record of the fragment transaction that occurred. The back stack allows the user to reverse a fragment transaction (navigate backwards), by pressing the Back button.
How We can add fragment and what is the process?
When you add a fragment as a part of your activity layout, it lives in a ViewGroup inside the activity's view hierarchy and the fragment defines its own view layout. You can insert a fragment into your activity layout by declaring the fragment in the activity's layout file, as a <fragment> element, or from your application code by adding it to an existing ViewGroup.
However, a fragment is not required to be a part of the activity layout; you may also use a fragment without its own UI as an invisible worker for the activity.
To define a new fragment you extend either the android.app.Fragment class or one of its subclasses, for example ListFragment, DialogFragment, PreferenceFragment or WebViewFragment. The following code shows an example implementation.
In that code I am showing two pan layout for tablet and single pan layout for device(Just like above given Images). There are 4 java class file and two xml file under layout folder and one xml file under layout-large.
Here is following java and xml file name:-
/src folder
1. HomeActivity .java
2. HeaderFragment.java
3. ArticleFragment.java
4. DataCenter.java
/layout folder
1. activity_home.xml
2. article_view.xml
/layout-large folder
1. news_articles.xml
I have putted the detailed description of individual function in comment. So please going through this code have a look on that comments. It help you to understand this code thoroughly.
package com.sks.fragment;
import android.os.Bundle;
import android.app.Activity;
import
android.support.v4.app.FragmentActivity;
import
android.support.v4.app.FragmentTransaction;
import android.view.Menu;
public class HomeActivity extends FragmentActivity
implements
HeadlineFragment.OnHeadlineSelectedListener {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_home);
//
Check whether the activity is using the layout version with
//
the fragment_container FrameLayout. If so, we must add the first fragment
if (findViewById(R.id.fragment_container) != null) {
// However, if we're being restored from a
previous state,
// then we don't need to do anything and
should return or else
// we could end up with overlapping
fragments.
if (savedInstanceState != null) {
return;
}
// Create an instance of ExampleFragment
HeadlineFragment firstFragment = new HeadlineFragment();
// In case this activity was started with
special instructions from an Intent,
// pass the Intent's extras to the fragment
as arguments
firstFragment.setArguments(getIntent().getExtras());
// Add the fragment to the
'fragment_container' FrameLayout
getSupportFragmentManager().beginTransaction()
.add(R.id.fragment_container,
firstFragment).commit();
}
}
public void onArticleSelected(int position) {
//
The user selected the headline of an article from the HeadlinesFragment
//
Capture the article fragment from the activity layout
ArticleFragment articleFrag = (ArticleFragment)
getSupportFragmentManager().findFragmentById(R.id.article_fragment);
if (articleFrag != null) {
// If article frag is available,
we're in two-pane layout...
// Call a method in the ArticleFragment to
update its content
articleFrag.updateArticleView(position);
} else {
// If the frag is not available,
we're in the one-pane layout and must swap frags...
// Create fragment and give it an argument
for the selected article
ArticleFragment newFragment = new ArticleFragment();
Bundle args = new Bundle();
args.putInt(ArticleFragment.ARG_POSITION, position);
newFragment.setArguments(args);
FragmentTransaction transaction =
getSupportFragmentManager().beginTransaction();
// Replace whatever is in the
fragment_container view with this fragment,
// and add the
transaction to the back stack so the user can navigate back
transaction.replace(R.id.fragment_container, newFragment);
transaction.addToBackStack(null);
// Commit the transaction
transaction.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.home, menu);
return true;
}
}
package com.sks.fragment;
import
android.app.Activity;
import
android.support.v4.app.ListFragment;
import android.os.Build;
import android.os.Bundle;
import android.view.View;
import
android.widget.ArrayAdapter;
import
android.widget.ListView;
public class HeadlineFragment extends ListFragment {
OnHeadlineSelectedListener mCallback;
//
The container Activity must implement this interface so the frag can
deliver messages
public interface
OnHeadlineSelectedListener {
/**
Called by HeadlinesFragment when a list item is selected */
public void onArticleSelected(int position);
}
@Override
public void onCreate(Bundle
savedInstanceState) {
super.onCreate(savedInstanceState);
//
We need to use a different list item layout for devices older than Honeycomb
int layout =
Build.VERSION.SDK_INT >= Build.VERSION_CODES.HONEYCOMB ?
android.R.layout.simple_list_item_activated_1 : android.R.layout.simple_list_item_1;
//
Create an array adapter for the list view, using the Ipsum headlines
array
setListAdapter(new ArrayAdapter<String>(getActivity(), layout, DataContainer.Headlines));
}
@Override
public void onStart() {
super.onStart();
//
When in two-pane layout, set the listview to highlight the selected list
item
//
(We do this during onStart because at the point the listview is
available.)
if
(getFragmentManager().findFragmentById(R.id.article_fragment) != null) {
getListView().setChoiceMode(ListView.CHOICE_MODE_SINGLE);
}
}
@Override
public void onAttach(Activity
activity) {
super.onAttach(activity);
//
This makes sure that the container activity has implemented
//
the callback interface. If not, it throws an exception.
try {
mCallback = (OnHeadlineSelectedListener)
activity;
} catch (ClassCastException e) {
throw new
ClassCastException(activity.toString()
+ " must
implement OnHeadlineSelectedListener");
}
}
@Override
public void
onListItemClick(ListView l, View v, int position, long id) {
//
Notify the parent activity of selected item
mCallback.onArticleSelected(position);
//
Set the item as checked to be highlighted when in two-pane layout
getListView().setItemChecked(position, true);
}
}
3. public class ArticleFragment extends Fragment {
final static String ARG_POSITION = "position";
int mCurrentPosition = -1;
@Override
public View
onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
//
If activity recreated (such as from screen rotate), restore
//
the previous article selection set by onSaveInstanceState().
//
This is primarily necessary when in the two-pane layout.
if (savedInstanceState
!= null) {
mCurrentPosition =
savedInstanceState.getInt(ARG_POSITION);
}
//
Inflate the layout for this fragment
return
inflater.inflate(R.layout.article_view, container, false);
}
@Override
public void onStart() {
super.onStart();
//
During startup, check if there are arguments passed to the fragment.
//
onStart is a good place to do this because the layout has already been
//
applied to the fragment at this point so we can safely call the method
//
below that sets the article text.
Bundle args = getArguments();
if (args != null) {
// Set article based on argument passed in
updateArticleView(args.getInt(ARG_POSITION));
} else if (mCurrentPosition != -1) {
// Set article based on saved instance
state defined during onCreateView
updateArticleView(mCurrentPosition);
}
}
public void updateArticleView(int position) {
TextView article = (TextView) getActivity().findViewById(R.id.article);
article.setText(DataContainer.Articles[position]);
mCurrentPosition = position;
}
@Override
public void
onSaveInstanceState(Bundle outState) {
super.onSaveInstanceState(outState);
//
Save the current article selection in case we need to recreate the fragment
outState.putInt(ARG_POSITION, mCurrentPosition);
}
}
public class DataContainer {
static String[] Headlines = {
"Android",
"java",
"Database"
};
static String[] Articles = {
"Android\n\nExcepteur
pour-over occaecat squid biodiesel umami gastropub, nulla laborum salvia
dreamcatcher fanny pack. Ullamco culpa retro ea, trust fund excepteur eiusmod
direct trade banksy nisi lo-fi cray messenger bag. Nesciunt esse carles selvage
put a bird on it gluten-free, wes anderson ut trust fund twee occupy viral.
Laboris small batch scenester pork belly, leggings ut farm-to-table aliquip yr
nostrud iphone viral next level. Craft beer dreamcatcher pinterest truffaut
ethnic, authentic brunch. Esse single-origin coffee banksy do next level
tempor. Velit synth dreamcatcher, magna shoreditch in american apparel messenger
bag narwhal PBR ennui farm-to-table.",
"javao\n\nVinyl
williamsburg non velit, master cleanse four loko banh mi. Enim kogi keytar
trust fund pop-up portland gentrify. Non ea typewriter dolore deserunt Austin.
Ad magna ethical kogi mixtape next level. Aliqua pork belly thundercats, ut
pop-up tattooed dreamcatcher kogi accusamus photo booth irony portland.
Semiotics brunch ut locavore irure, enim etsy laborum stumptown carles gentrify
post-ironic cray. Butcher 3 wolf moon blog synth, vegan carles odd
future.",
"DataBase\n\nsgshuishuihsuish89
ugishuhs huisuihs8uh , huihsuihj. gfuyghuygh HGUygh bhuih8ihun dHJAGDSYUGS7GBV
. ftF6TYF76TGF78YGH78 YUG7GUKBHUIH H78UH78H87UH.YUG78Y87YU9KHNUIY,HIHU "
};
}
1. activity_home.xml
<?xml version="1.0"
encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/fragment_container"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<?xml version="1.0"
encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/article"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="16dp"
android:textSize="18sp" />
lastly
3. news_articles.xml
<?xml version="1.0"
encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:baselineAligned="false"
android:orientation="horizontal" >
<fragment
android:id="@+id/headlines_fragment"
android:name="com.example.android.fragments.HeadlinesFragment"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1" />
<fragment
android:id="@+id/article_fragment"
android:name="com.example.android.fragments.ArticleFragment"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="2" />
</LinearLayout>
this is the starting code for Fragment. In next blog I will put more light on Fragment LifeCycle and different type of fragment and Its uses.
Happy Coding !!!