Handling PagerTitleStrip click in compatibiliy Fragment-based ViewPager

Question

I have a compatibility ViewPager with an embedded PagerTitleStrip element and it works fine but clicks on the PagerTitleStrip do not switch to the corresponding view as expected. I have looked through the docs but the widget does not have any built-in methods for attaching onClickListeners to the PagerTitleStrip object. This seems a bit weird since that is probably what most people would expect.

So the question is how would I make the title strip clickable?

I am also trying to figure out if there is a way to show a thick underline under the selected title strip without adding a TabHost if at all possible.

Here is the code:

Main layout view_pager.xml:

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

    <android.support.v4.view.ViewPager
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/my_view_pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent" >

        <android.support.v4.view.PagerTitleStrip
            android:id="@+id/pager_title_strip"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="top"
            android:background="#ccc"
            android:textColor="#fff" />
    </android.support.v4.view.ViewPager>

</LinearLayout>

The two fragment layouts that go into the ViewPager:

fragment_connect.xml (the second is identical so not included)

<?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:orientation="vertical" >

    <TextView
        android:id="@+id/text_view_connect"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="connect"
        android:textAppearance="?android:attr/textAppearanceLarge" />
</LinearLayout>

The main activity class StandardViewPagerActivity.java:

package com.example.standardviewpager;

import java.util.List;
import java.util.Vector;

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

public class StandardViewPagerActivity extends FragmentActivity {

    private MyPagerAdapter pagerAdapter;

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.view_pager);
        ViewPager myPager = (ViewPager) findViewById(R.id.my_view_pager);
        PagerTitleStrip pagerStrip = (PagerTitleStrip) findViewById(R.id.pager_title_strip);
        // TODO: add underline for selected title strip
        myPager.setAdapter(pagerAdapter);
        myPager.setCurrentItem(0);
        initialisePaging();
    }

    private void initialisePaging() {

        List<Fragment> fragments = new Vector<Fragment>();
        fragments.add(Fragment.instantiate(this, ConnectFragment.class.getName()));
        fragments.add(Fragment.instantiate(this, ProfilesFragment.class.getName()));
        this.pagerAdapter = new MyPagerAdapter(super.getSupportFragmentManager(), fragments);
        ViewPager pager = (ViewPager) super.findViewById(R.id.my_view_pager);
        pager.setAdapter(this.pagerAdapter);
    }
}

The adapter class MyPagerAdapter.java:

package com.example.standardviewpager;

import java.util.List;

import android.os.Parcelable;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
import android.support.v4.view.ViewPager;
import android.view.LayoutInflater;
import android.view.View;

public class MyPagerAdapter extends FragmentPagerAdapter {

    private List<Fragment> fragments;

    public MyPagerAdapter(FragmentManager supportFragmentManager, List<Fragment> fragments) {
        super(supportFragmentManager);
        this.fragments = fragments;
    }

    @Override
    public int getCount() {
        return this.fragments.size();
    }

    @Override
    public void destroyItem(View arg0, int arg1, Object arg2) {
        ((ViewPager) arg0).removeView((View) arg2);
    }

    @Override
    public Parcelable saveState() {
        return null;
    }

    @Override
    public CharSequence getPageTitle(int position) {
        return String.format("Title %d", position);
    }

    @Override
    public Fragment getItem(int position) {
            return this.fragments.get(position);
    }
}

And, finally, the two identical Fragment implementations, including only the first - ConnectFragment.java.

package com.example.standardviewpager;

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.LinearLayout;
import android.widget.TextView;

public class ConnectFragment extends Fragment {

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

    @Override
    public void onActivityCreated(Bundle savedInstanceState) {
        super.onActivityCreated(savedInstanceState);
    }

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        LinearLayout layout = (LinearLayout) inflater.inflate(R.layout.fragment_connect, container, false);
        TextView textView = (TextView) layout.findViewById(R.id.text_view_connect);
        textView.setText("onCreateView() Connect");
        return (View)layout;
        }
}

Answer 1

I suppose this is way too late and the OP must have moved on,but for those who just came here searching for a tiny widget ,please find my fork here

Answer 2

So the question is how would I make the title strip clickable?

You fork it and make your own implementation that is clickable. Or, you switch to PagerTabStrip, which is clickable. Or, you switch to one of the ViewPagerIndicator indicators, one that happens to be clickable and has a look that you like.

Quoting the documentation for PagerTitleStrip:

PagerTitleStrip is a non-interactive indicator of the current, next, and previous pages of a ViewPager... For an interactive indicator, see PagerTabStrip.