Android - ActionBarActivity with ViewPager

Question

i have a problem with ActionBarActivity and ViewPager.

On my "main-activity" which is a ActionBarActivity i have some tabs, which are fragments.

I want to implement the "swipe-feature" between these tabs.

I've already read the following tutorial: http://developer.android.com/training/implementing-navigation/lateral.html

Actually i have implemented the whole code, but my app wont work. :(

There is no "swipe-feature" between the tabs.

Here is my code of the main-activity:

@Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_hauptmenue_extended);

        try {

            actionBar = getSupportActionBar();

            actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);


            // ViewPager ...
            pagerAdapter = new CollectionPagerAdapter(
                    getSupportFragmentManager());

            viewPager = (ViewPager) findViewById(R.id.viewpager);
            viewPager.setAdapter(pagerAdapter);
            viewPager.setCurrentItem(1);
            viewPager
                    .setOnPageChangeListener(new ViewPager.SimpleOnPageChangeListener() {
                        @Override
                        public void onPageSelected(int position) {
                            actionBar.setSelectedNavigationItem(position);
                        }
                    });
                     // Add all tabs to the actionbar...
                    Tab tabB = actionBar.newTab();
            tabB.setText("Home");
            tabB.setIcon(R.drawable.icon_home);
            tabB.setTabListener(new TabListener<Startmenue_activity>(this,
                    "Start", Startmenue_activity.class, viewPager));
            actionBar.addTab(tabB);

            Tab tabA = actionBar.newTab();
            tabA.setText("");
            tabA.setIcon(R.drawable.icon_nachrichten_sel);
            tabA.setTabListener(new TabListener<Nachrichten_activity>(this,
                    "News", Nachrichten_activity.class, viewPager));
            actionBar.addTab(tabA);

            Tab tabC = actionBar.newTab();
            tabC.setText("");
            tabC.setIcon(R.drawable.icon_favoriten);
            tabC.setTabListener(new TabListener<Favoriten_activity>(this,
                    "Favs", Favoriten_activity.class, viewPager));
            actionBar.addTab(tabC);

And my adapter looks like this:

public class CollectionPagerAdapter extends FragmentPagerAdapter {

        final int NUM_ITEMS = 3; // number of tabs

        List<Fragment> fragments = new ArrayList<Fragment>();

        public Fragment getItem(int pos) {
            return fragments.get(pos);
        }

        public void addFragment(Fragment f) {
            fragments.add(f);
        }

        public CollectionPagerAdapter(FragmentManager fm) {
            super(fm);

            Fragment home_Fragment = new Startmenue_activity();
            addFragment(home_Fragment);

            Fragment news_Fragment = new Nachrichten_activity();
            addFragment(news_Fragment);

            Fragment favoriten_Fragment = new Favoriten_activity();
            addFragment(favoriten_Fragment);            

        }

        @Override
        public int getCount() {
            return NUM_ITEMS;
        }

    }

Oh and my XML of the main-activity looks like this:

<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/fragView"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".Hauptmenue_extended" >

    <!-- The ViewPager -->

    <android.support.v4.view.ViewPager
        android:id="@+id/viewpager"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" >

        <!-- The main content view -->

        <FrameLayout
            android:id="@+id/main"
            android:layout_width="match_parent"
            android:layout_height="match_parent" >
        </FrameLayout>

        <!-- The navigation drawer -->

        <ListView
            android:id="@+id/left_drawer"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_gravity="start"
            android:background="#fff"
            android:choiceMode="singleChoice"
            android:divider="@android:color/transparent"
            android:dividerHeight="0dp" />
    </android.support.v4.view.ViewPager>

</android.support.v4.widget.DrawerLayout>

Answer 1

Try this out. But I've not tested it.

http://wptrafficanalyzer.in/blog/swipable-navigation-tabs-using-actionbarcompat-library/

Answer 2

There's a bunch of things that I don't fully understand about your code, for example, why are you putting a ListView inside the ViewPager?. Anyways if you want to implement some tabs with the swipe feature. Here is how do it:

First the xml:

    <?xml version="1.0" encoding="utf-8"?>
    <android.support.v4.view.ViewPager xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent" >

        <android.support.v4.view.PagerTabStrip
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="top" />

    </android.support.v4.view.ViewPager>

Now the activity:

    import android.os.Bundle;
    import android.support.v4.app.FragmentActivity;
    import android.support.v4.view.ViewPager;

    public class MainActivity extends FragmentActivity {

        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);
            ViewPager pager = (ViewPager) findViewById(R.id.pager);
            pager.setAdapter(new SampleAdapter(this, getSupportFragmentManager()));
        }
    }

The adapter:

    import android.content.Context;
    import android.support.v4.app.Fragment;
    import android.support.v4.app.FragmentManager;
    import android.support.v4.app.FragmentStatePagerAdapter;

    public class SampleAdapter extends FragmentStatePagerAdapter {
        Context ctxt = null;

        public SampleAdapter(Context ctxt, FragmentManager mgr) {
            super(mgr);
            this.ctxt = ctxt;
        }

        @Override
        public int getCount() {
            return 3;
        }

        @Override
        public Fragment getItem(int position) {
            switch (position) {
            case 0:
                return new SimpleFragment("Hi");
            case 1:
                return new SimpleFragment("There");
            case 2:
                return new SimpleFragment("Fella");
            }
            return null;
        }

        @Override
        public String getPageTitle(int position) {
            switch (position) {
            case 0:
                return "First Tab";
            case 1:
                return "Second Tab";
            case 2:
                return "Third Tab";
            }
            return null;
        }
    }

And the SimpleFragment:

    import android.annotation.SuppressLint;
    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;

    @SuppressLint("ValidFragment")
    public class SimpleFragment extends Fragment {

        String text;

        public SimpleFragment(String string) {
            text = string;
        }

        @Override
        public View onCreateView(LayoutInflater inflater, ViewGroup container,
                Bundle savedInstanceState) {
            View root = inflater.inflate(R.layout.fragment, container, false);
            TextView textview = (TextView) root.findViewById(R.id.textView1);
            textview.setText(text);
            return root;
        }

    }

And the fragment.xml:

    <?xml version="1.0" encoding="utf-8"?>
    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent" >

        <TextView
            android:id="@+id/textView1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerHorizontal="true"
            android:layout_centerVertical="true"
            android:text="Large Text"
            android:textAppearance="?android:attr/textAppearanceLarge" />

    </RelativeLayout>

Hope this helps :)