Viewpager and listView on the same Activity

Question

I want to make an activity that contains a viewpager and listview below it which you can scroll them both .. like these apps ... anyone can help

Answer 1

Well I could do it with some way by measuring the height of the listView and adding the listview and the view pager into scroll view here's the sample I've made

public class MainActivity extends Activity {

@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.list);

ViewPager myPager = (ViewPager) findViewById(R.id.myfivepanelpager);
ViewPagerAdapter adapter = new ViewPagerAdapter(this, imageArra);
myPager.setAdapter(adapter);
myPager.setCurrentItem(0);

myPager.setOnTouchListener(new OnTouchListener() {
            @Override
            public boolean onTouch(View v, MotionEvent event) {
                PointF downP = new PointF();
                PointF curP = new PointF();
                int act = event.getAction();
                if (act == MotionEvent.ACTION_DOWN
                        || act == MotionEvent.ACTION_MOVE
                        || act == MotionEvent.ACTION_UP) {
                    ((ViewGroup) v).requestDisallowInterceptTouchEvent(true);
                    if (downP.x == curP.x && downP.y == curP.y) {
                        return false;
                    }
                }
                return false;
            }
        });

Aadpater aa = new Aadpater(this, text);
final ListView ll = (ListView) findViewById(R.id.listView);

ll.setAdapter(aa);

Utility.setListViewHeightBasedOnChildren(ll);
}

private int imageArra[] = { R.drawable.about_logo, R.drawable.ic_launcher,
        R.drawable.nagy_cv, R.drawable.rewrew };

private String text[] = { "one", "two", "three", "four", " five", "six",
        "seven", "eight", "one", "two", "three", "four", " five", "six",
        "seven", "eight", "one", "two", "three", "four", " five", "six",
        "seven", "eight", "one", "two", "three", "four", " five", "six",
        "seven", "eight", "one", "two", "three", "four", " five", "six",
        "seven", "eight" };

}

and here's how I measure the listView height

  public class Utility {

    public static void setListViewHeightBasedOnChildren(ListView listView) {
        ListAdapter listAdapter = listView.getAdapter();

        if (listAdapter == null) {
            // pre-condition
            return;
        }


        int totalHeight = 0;
        int desiredWidth = MeasureSpec.makeMeasureSpec(listView.getWidth(),
                MeasureSpec.UNSPECIFIED);
        for (int i = 0; i < listAdapter.getCount(); i++) {
            View listItem = listAdapter.getView(i, null, listView);
            listItem.measure(desiredWidth, 0);
            totalHeight += listItem.getMeasuredHeight();
        }

        ViewGroup.LayoutParams params = listView.getLayoutParams();
        params.height = totalHeight + (listView.getDividerHeight() * (listAdapter.getCount() - 1));
        listView.setLayoutParams(params);
        listView.requestLayout();
    }
    }

and here's my layout

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

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical" >

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

        <ListView
            android:id="@+id/listView"
            android:layout_width="match_parent"
            android:layout_height="0dp" >
        </ListView>
    </LinearLayout>

</ScrollView>

Answer 2

I would use a ViewPager in combination with a Title Strip.

On the android developers site you have a good tutorial for this.

You need the following objects:

• FragmentActivity
• FragmentStatePagerAdapter (controlls your current view and swipe-movements)
• Fragment (in onCreateView() you can declare your Layout of the SwipeViews)

Just try the tutorial and let me know if you have more question to certain issues.

UPDAT 2013-08-26

Ok, next time you should try to precise your question and if you have code than show it. So the SO community can give you a more precise and fast help :)

As you describe in your comment you can use a ScrollView instead of a LinearLayout. Than you have two options to make your listView scrolling inside a scrollView:

• Option 1: Override onInterceptTouch
• Option 2: Answer of Moisés Olmedo in this post (this is really simple!).