6.TAB LAYOUT
To
create a tabbed UI, you need to use a TabHost and a TabWidget. The TabHost must
be the root node for the layout, which contains both the TabWidget for
displaying the tabs and a FrameLayout for
displaying the tab content. While doing your application you need to extend TabActivity in your activity.
TabHost
is container for a tabbed window view. This object holds two children: a set of
tab labels that the user clicks to select a specific tab, and a FrameLayout
object that displays the contents of that page. The individual elements are
typically controlled using this container object, rather than setting values on
the child elements themselves.
TabWidget
helps displays a list of tab labels representing each page in the parent's tab
collection. The container object for this widget is TabHost. When
the user selects a tab, this object sends a message to the parent container,
TabHost, to tell it to switch the displayed page. You typically won't use many
methods directly on this object. The container TabHost is used to add labels,
add the callback handler, and manage callbacks. You might call this object to
iterate the list of tabs, or to tweak the layout of the tab list, but most
methods should be called on the containing TabHost object.
An example of tab is given below
First activity
package a.b.c;
import android.app.Activity;
import android.app.TabActivity;
import android.content.Intent;
import
android.content.res.Resources;
import android.os.Bundle;
import android.widget.TabHost;
import
android.widget.TabHost.OnTabChangeListener;
import android.widget.TabHost.TabSpec;
import android.widget.Toast;
public class
TablayoutActivity extends TabActivity {
/** Called when the activity is first created. */
@Override
public void
onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
Resources resource =
getResources();
TabHost tabhost =
getTabHost();
TabHost.TabSpec spec;
Intent intent;
intent = new
Intent().setClass(TablayoutActivity.this, tab1.class);
spec =
tabhost.newTabSpec("one").setIndicator("Call",resource.getDrawable(R.drawable.ic_launcher)).setContent(intent);
tabhost.addTab(spec);
intent = new
Intent().setClass(TablayoutActivity.this, tab2.class);
spec =
tabhost.newTabSpec("two").setIndicator("Sms",resource.getDrawable(R.drawable.ic_launcher)).setContent(intent);
tabhost.addTab(spec);
intent = new
Intent().setClass(TablayoutActivity.this, tab3.class);
spec =
tabhost.newTabSpec("three").setIndicator("Call Logo",resource.getDrawable(R.drawable.ic_launcher)).setContent(intent);
tabhost.addTab(spec);
tabhost.setOnTabChangedListener(new OnTabChangeListener() {
@Override
public void
onTabChanged(String arg0) {
// TODO Auto-generated method stub
Toast.makeText(getApplicationContext(), "Moving to next tab", Toast.LENGTH_LONG).show();
}
});
tabhost.setCurrentTab(0);
}
}
|
For each
tab, a TabHost.TabSpec is created to define the tab propertiesThe newTabSpec(String) method creates a new TabHost.TabSpec identified by the given string tag. For each TabHost.TabSpec, setIndicator(CharSequence,
Drawable) is called to set the text and icon for the
tab, and setContent(Intent) is called to specify the Intent to open the appropriate Activity. Each TabHost.TabSpec is then added to the TabHost by calling addTab(TabHost.TabSpec).
At the very end, setCurrentTab(int) opens the tab to be displayed by default, specified by the index
position of the tab.
Notice that not once was the TabWidget object referenced. This is because a TabWidget must always be a child of a TabHost, which is what you use for almost all interaction with the tabs. So
when a tab is added to the TabHost, it's automatically added to the child TabWidget.
First xml
page
<?xml version="1.0" encoding="utf-8"?>
<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="@android:id/tabhost"
>
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:padding="5dp">
<TabWidget
android:id="@android:id/tabs"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
/>
<FrameLayout
android:id="@android:id/tabcontent"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:padding="5dp"
/>
</LinearLayout>
</TabHost>
|
Second activity
package a.b.c;
import android.app.Activity;
import android.os.Bundle;
public class tab1 extends
Activity {
public void
onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main1);
}
}
|
Main1.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="@android:id/tabhost"
>
<Button
android:text="One"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>
|
Third activity
package a.b.c;
import
android.app.Activity;
import
android.os.Bundle;
public class tab1 extends
Activity {
public void
onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main2);
}
}
|
Main2.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="@android:id/tabhost"
>
<Button
android:text="Two"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>
|
Fourth activity
package a.b.c;
import
android.app.Activity;
import
android.os.Bundle;
public class tab1 extends
Activity {
public void
onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main3);
}
}
|
Main3.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="@android:id/tabhost"
>
<Button
android:text="One"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>
|
Manifest file
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="a.b.c"
android:versionCode="1"
android:versionName="1.0"
>
<uses-sdk android:minSdkVersion="10" />
<application
android:icon="@drawable/ic_launcher"
android:label="@string/app_name"
>
<activity
android:label="@string/app_name"
android:name=".TablayoutActivity"
>
<intent-filter >
<action android:name="android.intent.action.MAIN"
/>
<category android:name="android.intent.category.LAUNCHER"
/>
</intent-filter>
</activity>
<activity android:name=".tab1"></activity>
<activity android:name=".tab2"></activity>
<activity android:name=".tab3"></activity>
</application>
</manifest>
|
No comments:
Post a Comment