Android Tab Action Bar

simplified. picture simplified. · Jun 23, 2011 · Viewed 30.2k times · Source

I am trying out on the android action bar for 3.0, where I refer to

http://www.youtube.com/watch?v=gMu8XhxUBl8

The code in the TabsActivity are as follow:

package com.test.actionbar;

import android.app.ActionBar;
import android.app.ActionBar.Tab;
import android.app.Activity;
import android.app.Fragment; 
import android.app.FragmentTransaction;
import android.os.Bundle;

public class TabsActivity extends Activity{

@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    ActionBar bar = getActionBar();
    bar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
    ActionBar.Tab tabA = bar.newTab().setText("A Tab");
    ActionBar.Tab tabB = bar.newTab().setText("B Tab");
    ActionBar.Tab tabC = bar.newTab().setText("C Tab");

    Fragment fragmentA = new AFragmentTab();
    Fragment fragmentB = new BFragmentTab();
    Fragment fragmentC = new CFragmentTab();

    tabA.setTabListener(new MyTabsListener(fragmentA));
    tabB.setTabListener(new MyTabsListener(fragmentB));
    tabC.setTabListener(new MyTabsListener(fragmentC));

    bar.addTab(tabA);
    bar.addTab(tabB);
    bar.addTab(tabC);

}

protected class MyTabsListener implements ActionBar.TabListener {

    private Fragment fragment;

    public MyTabsListener(Fragment fragment) {
        this.fragment = fragment;
    }

    public void onTabReselected(Tab tab, FragmentTransaction ft) {
        // TODO Auto-generated method stub

    }

    public void onTabSelected(Tab tab, FragmentTransaction ft) {
        // TODO Auto-generated method stub
        ft.add(R.id.fragment_container, fragment, null);

    }

    public void onTabUnselected(Tab tab, FragmentTransaction ft) {
        // TODO Auto-generated method stub

    }
  }
}

for a step by step tutorial, however, after completing the tutorial, I realised that in the TabsActivity, in the onTabSelected method, it will require a variable which is the container_id, which i am not too sure how can i supply that even after looking at the api. I tried removing the line and ran it on the tablet but it throws me a runtimeexception.

Can anyone help me with this?

sorry, I am new to android programming, if the question sounds too simple.

Thanks in advance.

EDIT

import android.app.ActionBar;
import android.app.Activity;
import android.app.Fragment;
import android.os.Bundle;

public class ActionBarTabs extends Activity {

public void onCreate(Bundle savedInstanceState) {

    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);

    ActionBar bar = getActionBar();
    bar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
    ActionBar.Tab tabA = bar.newTab().setText("A Tab");
    ActionBar.Tab tabB = bar.newTab().setText("B Tab");
    ActionBar.Tab tabC = bar.newTab().setText("C Tab");

    bar.addTab(tabA);
    bar.addTab(tabB);
    bar.addTab(tabC);
  }
}

UPDATE

package com.debug.actionbartabs;

import android.app.ActionBar;
import android.app.Activity;
import android.os.Bundle;

public class TabsActivity extends Activity {
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);

    ActionBar bar = getActionBar();
    bar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
    ActionBar.Tab tabA = bar.newTab().setText("A Tab");
   bar.addTab(tabA);

   }
}

Answer

rawreth picture rawreth · Jun 23, 2011

Each of the classes should look like this:

public class AFragmentTab extends Fragment
{
  @Override
  public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState)
  {
    return inflater.inflate(R.layout.fragment_a, container, false);
  }
}

And the main activity should look like this:

package com.test.actionbar;

import android.app.ActionBar;
import android.app.ActionBar.Tab;
import android.app.Activity;
import android.app.Fragment; 
import android.app.FragmentTransaction;
import android.os.Bundle;

public class TabsActivity extends Activity{

@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);
    ActionBar bar = getActionBar();
    bar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
    ActionBar.Tab tabA = bar.newTab().setText("A Tab");
    ActionBar.Tab tabB = bar.newTab().setText("B Tab");
    ActionBar.Tab tabC = bar.newTab().setText("C Tab");

    Fragment fragmentA = new AFragmentTab();
    Fragment fragmentB = new BFragmentTab();
    Fragment fragmentC = new CFragmentTab();

    tabA.setTabListener(new MyTabsListener(fragmentA));
    tabB.setTabListener(new MyTabsListener(fragmentB));
    tabC.setTabListener(new MyTabsListener(fragmentC));

    bar.addTab(tabA);
    bar.addTab(tabB);
    bar.addTab(tabC);

}

protected class MyTabsListener implements ActionBar.TabListener {

    private Fragment fragment;

    public MyTabsListener(Fragment fragment) {
        this.fragment = fragment;
    }

    public void onTabReselected(Tab tab, FragmentTransaction ft) {
    }

    public void onTabSelected(Tab tab, FragmentTransaction ft) {
        ft.add(R.id.fragment_container, fragment, null);
    }

    public void onTabUnselected(Tab tab, FragmentTransaction ft) {
        // some people needed this line as well to make it work: 
        ft.remove(fragment);
    }
}

I just found the copy of his code here: http://www.abelski.com/courses/android3ui/actionbar.pdf >_< So in the main.xml looks like this:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<LinearLayout android:layout_height="wrap_content"
android:layout_width="match_parent"
android:id="@+id/fragment_container"></LinearLayout>
</LinearLayout>