Desire Code

Android Tutorial , Programming Tutorial, Php Tutorial, Learn Android, HTML Tutorial, Coding , Java Tutorial, GTU Programs, Learning Programming

Friday 4 November 2016

Tab Layout Example in Android

Author:  |   |  No Comments | 

In this example, we will demonstrate the use of tab layout. Each tab contains a simple message. we include 3 tabs in this example.

How to create tab layout in android. Let's see the example

- Create new project
- To set 3 tab in layout create 3 blank activity in this example.

File Name : MainActivity.java

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
package com.example.tabbarexample;

import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;

import android.app.TabActivity;
import android.content.Intent;
import android.widget.TabHost;

public class MainActivity extends TabActivity {

 TabHost tabHost;
 
 @Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.activity_main);

  TabHost tabHost = getTabHost();
        TabHost.TabSpec spec;
        Intent intent;
 
        intent = new Intent().setClass(this, Tab1.class);
        spec = tabHost.newTabSpec("Tab 1").setIndicator("Tab 1")
                      .setContent(intent);
        tabHost.addTab(spec);
 
        intent = new Intent().setClass(this, Tab2.class);
        spec = tabHost.newTabSpec("Tab 2").setIndicator("Tab 2")
                      .setContent(intent);
        tabHost.addTab(spec);
 
        intent = new Intent().setClass(this, Tab3.class);
        spec = tabHost.newTabSpec("Tab 3").setIndicator("Tab 3")
                      .setContent(intent);
        tabHost.addTab(spec);
 
    
 }

 @Override
 public boolean onCreateOptionsMenu(Menu menu) {
  // Inflate the menu; this adds items to the action bar if it is present.
  getMenuInflater().inflate(R.menu.activity_main, menu);
  return true;
 }

 
}

File name : activity_main.xml

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
<?xml version="1.0" encoding="utf-8"?>
<TabHost
    android:id="@android:id/tabhost"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:android="http://schemas.android.com/apk/res/android">
 
    <LinearLayout
        android:layout_width="match_parent"
        android:id="@+id/linearLayout1"
        android:layout_height="match_parent"
        android:orientation="vertical">
 
        <TabWidget
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@android:id/tabs">
        </TabWidget>
 
        <FrameLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:id="@android:id/tabcontent">
        </FrameLayout>
    </LinearLayout>
</TabHost>

  • Tab1 Activity Code
File Name : Tab1.java

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
package com.example.tabbarexample;

import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;

public class Tab1 extends Activity {

 @Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.tab1);
 }

 @Override
 public boolean onCreateOptionsMenu(Menu menu) {
  // Inflate the menu; this adds items to the action bar if it is present.
  getMenuInflater().inflate(R.menu.tab1, menu);
  return true;
 }

}

File Name : tab1.xml


 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
<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"
    tools:context=".Tab1" >

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:textSize="30dp"
        android:text="TAB 1 SCREEN" />

</RelativeLayout>


  • Tab2 Activity Code

File Name : Tab2.java


 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
package com.example.tabbarexample;

import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;

public class Tab2 extends Activity {

 @Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.tab2);
 }

 @Override
 public boolean onCreateOptionsMenu(Menu menu) {
  // Inflate the menu; this adds items to the action bar if it is present.
  getMenuInflater().inflate(R.menu.tab2, menu);
  return true;
 }

}

File Name : tab2.xml

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
<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"
    tools:context=".Tab2" >

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:textSize="30dp"
        android:text="TAB 2 SCREEN" />

</RelativeLayout>

  • Tab3 Activity Code
File Name : Tab3.java


 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
package com.example.tabbarexample;

import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;

public class Tab3 extends Activity {

 @Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.tab3);
 }

 @Override
 public boolean onCreateOptionsMenu(Menu menu) {
  // Inflate the menu; this adds items to the action bar if it is present.
  getMenuInflater().inflate(R.menu.tab3, menu);
  return true;
 }

}

File Name : tab3.xml


 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
<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"
    tools:context=".Tab3" >

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:textSize="30dp"
        android:text="TAB 3 SCREEN" />

</RelativeLayout>



Output :

  

, , ,

0 comments:

Post a Comment

Like us on Facebook

Site Visitor

Powered by Blogger.