title: Android Fragments with Tabs and Viewpager
body: <p><img src="https://i.stack.imgur.com/UbdA1.png" alt="enter image description here"></p>
  
  <p>We are building an App as shown above that has nesting of Fragments.</p>
  
  <ol>
  <li>Tabs Featuring - Details Tab and MAps Tab</li>
  <li>Details Tab will have a slideshow - like the View Page Slider and information below that which will be scrollable.</li>
  <li>Maps Tab which will display the maps.</li>
  </ol>
  
  <p><img src="https://i.stack.imgur.com/iKZXa.png" alt="enter image description here"></p>
  
  <p>I have implmented the tabs and maps as well as the Slider as seen above. Now i am confused how i can add content below the Slider which will make the Details Tab scrollable.</p>
  
  <p><strong>What i have tried ?</strong></p>
  
  <p>On CLicking the Details tab the Fragment will try to inflate two Fragment layouts inside it.</p>
  
  <p><strong>AndroidTabLayoutActivity.java</strong></p>
  
  <pre><code>package com.mink7.abs;
  
  import com.viewpagerindicator.CirclePageIndicator;
  
  import android.app.TabActivity;
  import android.content.Intent;
  import android.os.Bundle;
  import android.support.v4.view.ViewPager;
  import android.widget.TabHost;
  import android.widget.TabHost.TabSpec;
  import java.util.Random;
  import android.support.v4.app.FragmentTabHost;
  import com.viewpagerindicator.PageIndicator;
  
  import android.support.v4.app.FragmentActivity;
  import android.view.Menu;
  import android.view.MenuItem;
  import android.widget.Toast;
  
  public class AndroidTabLayoutActivity extends TabActivity {
          /** Called when the activity is first created. */
          @Override
          public void onCreate(Bundle savedInstanceState) {
                  super.onCreate(savedInstanceState);
  
                  // FragmentTabHost tabHost;
  
                  setContentView(R.layout.main);
                  // tabHost = (FragmentTabHost) findViewById(R.id.tabMode);
  
                  TabHost tabHost = getTabHost();
  
                  /*
                   * mAdapter = new TestFragmentAdapter(getSupportFragmentManager());
                   *
                   * mPager = (ViewPager) findViewById(R.id.pager);
                   * mPager.setAdapter(mAdapter);
                   *
                   * mIndicator = (CirclePageIndicator) findViewById(R.id.indicator);
                   * mIndicator.setViewPager(mPager);
                   */
  
                  // Tab for Photos
                  TabSpec photospec = tabHost.newTabSpec("Details");
                  photospec.setIndicator("Details",
                                  getResources().getDrawable(R.drawable.icon_photos_tab));
                  Intent photosIntent = new Intent(this, DetailsActivity.class);
                  photospec.setContent(photosIntent);
  
                  // Tab for Songs
                  TabSpec songspec = tabHost.newTabSpec("Maps");
                  // setting Title and Icon for the Tab
                  songspec.setIndicator("Maps",
                                  getResources().getDrawable(R.drawable.icon_songs_tab));
                  Intent songsIntent = new Intent(this, MapsActivity.class);
                  songspec.setContent(songsIntent);
  
                  // Tab for Videos
                  /*
                   * TabSpec videospec = tabHost.newTabSpec("Videos");
                   * videospec.setIndicator("Videos",
                   * getResources().getDrawable(R.drawable.icon_videos_tab)); Intent
                   * videosIntent = new Intent(this, VideosActivity.class);
                   * videospec.setContent(videosIntent);
                   */
  
                  // Adding all TabSpec to TabHost
                  tabHost.addTab(photospec); // Adding photos tab
                  tabHost.addTab(songspec); // Adding songs tab
                  // tabHost.addTab(videospec); // Adding videos tab
          }
  
  }
  </code></pre>
  
  <p><strong>DetailsActivity.java</strong></p>
  
  <pre><code>package com.mink7.abs;
  
  import android.os.Bundle;
  import android.support.v4.view.ViewPager;
  import com.viewpagerindicator.CirclePageIndicator;
  
  public class DetailsActivity extends BaseSampleActivity {
      @Override
      protected void onCreate(Bundle savedInstanceState) {
          super.onCreate(savedInstanceState);
          setContentView(R.layout.place_details_layout);
  
          mAdapter = new TestFragmentAdapter(getSupportFragmentManager());
  
          mPager = (ViewPager)findViewById(R.id.pager);
          mPager.setAdapter(mAdapter);
  
          mIndicator = (CirclePageIndicator)findViewById(R.id.indicator);
          mIndicator.setViewPager(mPager);
  
  
      }
  }
  </code></pre>
  
  <p><strong>BaseSampleActivity.java</strong></p>
  
  <pre><code>package com.mink7.abs;
  
  import java.util.Random;
  
  import com.viewpagerindicator.PageIndicator;
  
  import android.support.v4.app.FragmentActivity;
  import android.support.v4.view.ViewPager;
  import android.view.Menu;
  import android.view.MenuItem;
  import android.widget.Toast;
  
  public abstract class BaseSampleActivity extends FragmentActivity {
      private static final Random RANDOM = new Random();
  
      TestFragmentAdapter mAdapter;
      ViewPager mPager;
      PageIndicator mIndicator;
      //FragmentTabHost mTabHost;
  
  
      @Override
      public boolean onCreateOptionsMenu(Menu menu)
      {
          getMenuInflater().inflate(R.menu.main, menu);
          return true;
      }
  
      @Override
      public boolean onOptionsItemSelected(MenuItem item) {
          switch (item.getItemId()) {
              case R.id.random:
                  final int page = RANDOM.nextInt(mAdapter.getCount());
                  Toast.makeText(this, "Changing to page " + page, Toast.LENGTH_SHORT);
                  mPager.setCurrentItem(page);
                  return true;
  
              case R.id.add_page:
                  if (mAdapter.getCount() &lt; 10) {
                      mAdapter.setCount(mAdapter.getCount() + 1);
                      mIndicator.notifyDataSetChanged();
                  }
                  return true;
  
              case R.id.remove_page:
                  if (mAdapter.getCount() &gt; 1) {
                      mAdapter.setCount(mAdapter.getCount() - 1);
                      mIndicator.notifyDataSetChanged();
                  }
                  return true;
          }
          return super.onOptionsItemSelected(item);
      }
  }
  </code></pre>