In Android, Fragment is used to create dynamic user interface and multi-pane applications. It allows you to use interface components and activities� behaviors in different modules. The modules can be swapped in and out.
In this Android tip, I am going to show you how to use the Fragment to create a simple dynamic UI application that has two fragments or modules. The first module contains a TextView to display text and the second module contains an ImageView to display an image. You can navigate between the modules by clicking the Next/Previous button. Now create a new Android project. Then modify the activity_main.xml to add a FrameLayout and one Button as shown below.
<RelativeLayout 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:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context=".MainActivity" >
<FrameLayout
android:id="@+id/fragment_container1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="@+id/bt_next"
/>
<Button
android:id="@+id/bt_next"
android:layout_alignParentBottom="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Next"
/>
</RelativeLayout>
package com.example.androidproject;
import android.app.Activity;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;
public class FirstFragment extends Fragment {
Activity context;
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
context=getActivity();
//Inflate the layout for this fragment
return inflater.inflate(R.layout.first_fragment, container, false);
}
public void onStart(){
super.onStart();
TextView tv=(TextView)context.findViewById(R.id.txtview);
tv.setText("This is the TextView in the first fragment or module.");
}
}
first_fragment.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:orientation="vertical" >
<TextView
android:id="@+id/txtview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="20sp"
android:gravity="center"
/>
</LinearLayout>
package com.example.androidproject;
import android.app.Activity;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
public class SecondFragment extends Fragment {
Activity context;
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
context=getActivity();
//Inflate the layout for this fragment
return inflater.inflate(R.layout.second_fragment, container, false);
}
public void onStart(){
super.onStart();
ImageView iv=(ImageView)context.findViewById(R.id.imgview);
iv.setImageResource(R.drawable.ic_launcher);
}
}
second_fragment.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:orientation="vertical" >
<ImageView
android:id="@+id/imgview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
/>
</LinearLayout>
package com.example.androidproject;
import java.util.Calendar;
import android.os.Bundle;
import android.content.Context;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentTransaction;
import android.view.Menu;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;
public class MainActivity extends FragmentActivity {
FirstFragment ffr;
SecondFragment sfr;
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ffr=new FirstFragment();
sfr=new SecondFragment();
//add the first fragment to the container
FragmentTransaction transact=getSupportFragmentManager().beginTransaction();
transact.add(R.id.fragment_container1,ffr,"first_fragment");
transact.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.main, menu);
scheduleAlarm();
return true;
}
public void onStart(){
super.onStart();
Button bt=(Button)findViewById(R.id.bt_next);
bt.setOnClickListener(new OnClickListener(){
public void onClick(View view){
Button button=(Button)view;
String button_text=button.getText().toString();
if(button_text.equals("Next")){
showSecondFragment();
button.setText("Previous");
}
else{
showFirstFragment();
button.setText("Next");
}
}
});
}
public void showFirstFragment(){
FragmentTransaction transact=getSupportFragmentManager().beginTransaction();
transact.replace(R.id.fragment_container1, ffr,"first_fragment");
transact.addToBackStack(null);
transact.commit();
}
public void showSecondFragment(){
FragmentTransaction transact=getSupportFragmentManager().beginTransaction();
transact.replace(R.id.fragment_container1, sfr,"second_fragment");
transact.addToBackStack(null);
transact.commit();
}
}
Posted by: Dara | post date: 07-20-2014 | Subject: Android Apps Development
|
This website intents to provide free and high quality tutorials, examples, exercises and solutions, questions and answers of programming and scripting languages:
C, C++, C#, Java, VB.NET, Python, VBA,PHP & Mysql, SQL, JSP, ASP.NET,HTML, CSS, JQuery, JavaScript and other applications such as MS Excel, MS Access, and MS Word. However, we don't guarantee all things of the web are accurate. If you find any error, please report it then we will take actions to correct it as soon as possible.