2. Introduction
• Creating a dynamic and multi-pane user interface on
Android, need to encapsulate UI components and
activity behaviors into modules that you can swap into
and out of your activities.
• Fragment class can be used to create these modules,
which behaves somewhat like a nested activity that
can define its own layout and manage its own
lifecycle.
– It represents a behavior or a portion of user interface in
an Activity.
2
3. Introduction
• Developer can combine multiple fragments in a single
activity to build a multi-pane UI and reuse a fragment
in multiple activities.
– Fragment can be considered as a modular section of an
activity, which has its own lifecycle, receives its own
input events
– Fragment can be added or removed while the activity is
running
– Fragment introduced primarily to support more
dynamic and flexible UI designs on large screens, such
as tablets.
3
5. Fragment Support Library
• The Support Library provides a version of the
Fragment APIs that you can use on Android 1.6 (API
level 4) and higher.
– Adding Support library to project
• Right click-> Android tools -> Add Support Library
– To be sure that you don't accidentally use new APIs on
an older system version, import the Fragment class and
related APIs from the android.support.v4.app package:
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
5
6. Using Fragments
• The main activity must extends the FragmentActivity class
• The main activity’s layout should has a space, ViewGroup,
to display the fragments
– If there is more than one fragment appropriate way must be
used to call these fragments
• The fragment activity must extends the Fragment class
– Also all the other fragment activities too.
• Don’t forget that the fragment activity has its own
lifecycle.
6
7. Using Fragments
• In the MainActivity, do the following steps:
– Create a FragmentManager “fmgr"
• returned by getSupportFragmentManager()
– Create a FragmentTransaction “ftrans”
• returned by fmgr. beginTransaction();
– Add fragment object to FragmentTransaction
• ftrans.add(R.id.fragContainer, FragObj);
– Commit the FragmentTransaction to start the fragment.
• ftrans.commit();
7
8. Using Fragments
MainActivity
<LinearLayout …>
<LinearLayout
android:layout_weight="1"
android:layout_width="0dp">
<Button
android:id="@+id/btnFrag00"
android:text="Frag 00"
android:onClick="selectFragment"
/>
</LinearLayout>
<!-- the fragment container -->
<LinearLayout
android:id="@+id/fragContainer"
android:layout_weight="3"
android:layout_width="0dp"
…>
</LinearLayout>
</LinearLayout>
public class MainActivity extends FragmentActivity {
@Override
protected void onCreate(Bundle savedInstanceState){
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
FragmentManager fmgr =
getSupportFragmentManager();
FragmentTransaction ftrans =
fmgr.beginTransaction();
StartFragment startFrag = new StartFragment();
ftrans.add(R.id.fragContainer, startFrag);
ftrans.commit();
}
//handling fragments switching by using
//selectFragment method
} 8
9. Using Fragments
fragmentActivity
<LinearLayout
android:layout_height="…"
android:layout_width="...“
android:orientation="…" >
< TextView
android:id="@+id/txtV"
android:text="Frag 00"
android:onClick="selectFragment"
/>
…
…
</LinearLayout>
public class StartFragment extends Fragment {
@Override
public View onCreateView(LayoutInflater inflater,
ViewGroup container,
Bundle savedInstanceState)
{
return inflater.inflate(R.layout.fragment_start,
container, false);
}
} 9
onCreateView() is the only method that
needed in order to get a fragment
running.
10. Handling fragments switching
public void selectFragment(View v){
Fragment newFrag = new Fragment();
if(v == findViewById(R.id.btnFrag00))
newFrag = new Fragment00();
else if(v == findViewById(R.id.btnFrag01))
newFrag = new Fragment01();
else if(v == findViewById(R.id.btnFrag02))
newFrag = new Fragment02();
else if(v == findViewById(R.id.btnStartFrag))
newFrag = new StartFragment();
//switching the fragment
FragmentTransaction trans = getSupportFragmentManager().beginTransaction();
trans.replace(R.id.fragContainer,newFrag);
trans.addToBackStack(null);//used to put the previous fragment in pause mode
trans.commit();
} 10
11. Using XML fragment attribute
• The XML fragment attribute can be used to represent
the two or more fragments together in an activity.
11
<fragment
android:id="@+id/frag_list"
android:layout_weight="1"
android:layout_height="match_parent"
class="edu.itf.usingfragments.ListFrag"
/>
<fragment
android:id="@+id/frag_details"
android:layout_weight="1"
android:layout_height="match_parent"
class="edu.itf.usingfragments.DetailFrag"
/>
12. public class ListFrag extends ListFragment {
@Override
public void onCreate(Bundle
savedInstanceState) {
super.onCreate(savedInstanceState);
String[] positions = {"Dean", "ViceDean",
"CS", "IS", "MW" };
setListAdapter(…);
}
@Override
public void onListItemClick(ListView l, View v,
int position, long id) {
String selectedItem = (String)
getListAdapter().getItem(position);
DetailFrag frag = (DetailFrag)
getFragmentManager().
findFragmentById(R.id.frag_details);
if (frag != null && frag.isInLayout()) {
frag.setText(getPerson(selectedItem));
}
}
private String getPerson(String pos) {
if (pos.equals("Dean"))
return "Dr. Tawfiq";
if (pos.equals("ViceDean"))
return "Dr. Ribhi";
if (pos.equals("CS"))
return "Dr. Ashraf";
if (pos.equals("IS"))
return "Mr. Ehab";
if (pos.equals("MW"))
return "Mr. Ramzi";
return "???";
}
12
