android - Design a HorizontalScrollView inside of ViewPager or use fragments: -

i need design following screen, , need advice:

explanation:

the title static/fixed , don't need it.

yellow: interesting part, need design viewpager screen has capability scroll left/right max 4 screens.

red: in every screen need add table/grid can scrollable if it's not fits screen size.

green: page switching can done using green buttons in bottom of screen or scrolling viewpager.

the question is: can behavior achieve using viewpager or should use fragments? if fragment way go, how implement page switching using sliding gesture? if it's viewpager how add inside scrolling , how control using buttons @ bottom?

any appreciated, thanks.

i think should tackled non swipeable viewpager. there no way view pager and underlying fragments should respond swiping gesture. methods override disable swiping within viewpager are:

1. ontouchevent() - returns false.
2. onintercepttouchevent()- returns false.

refer this question more information on how achieve this.

next want using fragments within each of pager holders. we're building following layout:

within parent activity fragmentpageradapter instantiated , tabs added tag:

activity changes

@override protected void oncreate(final bundle saveinstancestate) {     final fragmentpageradapter mytabadapter = new myfragmentpageradapter(             <your viewpager view>, <your activity context, this>);     mytabadapter.addtab(getactionbar().newtab(), "your tag", "your title");     // etc... } 

so gives frame of diagram above. hosting activity, containing viewpager , underlying tabs. next getting fragments (containing tables) each of respective tabs. handled fragmentpageradapter implementation:

fragment adapter (inner class activity):

private class myfragmentpageradapter extends fragmentpageradapter implements         actionbar.tablistener, viewpager.onpagechangelistener {      /**      * constructs pager adapter {@link viewpager}.      *       * @param pager      *            {@link viewpager} widget.      * @param activitycontext      *            context widget being added under.      */     public spotmenufragmentpageradapter(final viewpager pager,             final context activitycontext) {         super(getfragmentmanager());         pager.setadapter(this);         this.context = activitycontext;     }      /**      * adds tab hosting activity action bar.      *       * @param newtab      *            tab add.      * @param tag      *            tab tag id purposes.      * @param label      *            label of tab displayed user.      */     public void addtab(final actionbar.tab newtab, final string tag,             final string label) {         newtab.settag(tag);         newtab.settext(label);         newtab.settablistener(this);         getsupportactionbar().addtab(newtab);     }      /**      * work of building correct fragment based      * on tab selected.      *       * @see fragmentpageradapter#getitem(int)      */     @override     public fragment getitem(final int position) {         final tab tab = getactionbar().gettabat(position);         if ("my tag".equals(tab.gettag().tostring()) {             // instantiate fragment (table) "my tag"         } else {             // instantiate else...         }     }      /**      * 1 fragment per tab.      *       * @see android.support.v4.view.pageradapter#getcount()      */     @override     public int getcount() {         return getsupportactionbar().gettabcount();     }      /**      * @see viewpager.onpagechangelistener#onpagescrollstatechanged(int)      */     @override     public void onpagescrollstatechanged(final int arg0) {         // no-op.     }      /**      * @see viewpager.onpagechangelistener#onpagescrolled(int, float, int)      */     @override     public void onpagescrolled(final int arg0, final float arg1,             final int arg2) {         // no-op.     }      /**      * @see viewpager.onpagechangelistener#onpageselected(int)      */     @override     public void onpageselected(final int position) {         getsupportactionbar().setselectednavigationitem(position);     }      /**      * @see tablistener#ontabselected(app.actionbar.tab,      *      app.fragmenttransaction)      */     @override     public void ontabselected(final tab tab, final fragmenttransaction ft) {         viewpager.setcurrentitem(tab.getposition());     }      /**      * @see tablistener#ontabunselected(actionbar.tab,      *      app.fragmenttransaction)      */     @override     public void ontabunselected(final tab tab, final fragmenttransaction ft) {         // no-op.     }      /**      * @see tablistener#ontabreselected(actionbar.tab,app.fragmenttransaction)      */     @override     public void ontabreselected(final tab tab, final fragmenttransaction ft) {         // no-op.     } } 

so point have activity hosting 'non-swipeable' view pager , mechanism switching tabs in form of tab bar underneath title (or alongside depending on screen size). point sure customise replace tab bar navigational arrows.

note: lot of written memory i've conveyed gist of go this.

update

in response updated question: can set tab old view. set tabspec accordingly. apologies haven't used myself.