title: TabLayout with viewpager not smooth scrolling
body: <p><strong>Edit</strong></p>
  
  <p>I have followed these tutorials to fix this problem.</p>
  
  <p><a href="http://www.truiton.com/2015/06/android-tabs-example-fragments-viewpager/">http://www.truiton.com/2015/06/android-tabs-example-fragments-viewpager/</a>
  <a href="https://guides.codepath.com/android/google-play-style-tabs-using-tablayout">https://guides.codepath.com/android/google-play-style-tabs-using-tablayout</a>
  <a href="http://www.voidynullness.net/blog/2015/08/16/android-tablayout-design-support-library-tutorial/">http://www.voidynullness.net/blog/2015/08/16/android-tablayout-design-support-library-tutorial/</a></p>
  
  <p>But its annoying that problem still persists after trying several solutions. Here is demo for the problem i am facing.Its been weeks since i am stuck on this problem.</p>
  
  <p><a href="https://www.dropbox.com/s/jcyr4tkmjin1kvw/demo.zip?dl=0">Link</a> for demo.</p>
  
  <p>Devices i am using for the testing are Nexus 4 and Nexus 5.</p>
  
  <p><code>TabLayout</code> with <code>ViewPager</code> isn't scrolling smooth. I need to swipe twice to shift on next tap. I have looked around the web but couldn't find any solution.
  I am using latest support design library.
  Here is gradle file</p>
  
  <pre><code>apply plugin: 'com.android.application'
  
  android {
  compileSdkVersion 23
  buildToolsVersion "23.0.3"
  
  defaultConfig {
      applicationId "com.softoven.ultron"
      minSdkVersion 15
      targetSdkVersion 23
      versionCode 1
      versionName "1.0"
  }
  buildTypes {
      release {
          minifyEnabled false
          proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
      }
  }
  }
  
  dependencies {
  compile fileTree(dir: 'libs', include: ['*.jar'])
  testCompile 'junit:junit:4.12'
  compile 'com.android.support:appcompat-v7:23.3.0'
  compile 'com.android.support:design:23.3.0'
  compile 'org.jsoup:jsoup:1.6.1'
  compile 'com.mikhaellopez:circularimageview:3.0.0'
  compile 'com.android.support:recyclerview-v7:23.3.0'
  compile 'com.mcxiaoke.volley:library:1.0.19'
  compile 'com.nostra13.universalimageloader:universal-image-loader:1.9.5'
  compile 'com.google.code.gson:gson:2.5'
  }
  </code></pre>
  
  <p>Here is Activity code.</p>
  
  <pre><code>private DrawerLayout drawerLayout;
  private ViewPager viewPager;
  private TabLayout tabLayout;
  private NavigationView navigationView;
  private CategoriesDTO categoriesDTO;
  
  @Override
  protected void onCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      setContentView(R.layout.activity_main);
      initToolbar();
      initUi();
      loadCategories();
  }
  
  private void initToolbar() {
      Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
      setSupportActionBar(toolbar);
      getSupportActionBar().setDisplayHomeAsUpEnabled(true);
      getSupportActionBar().setHomeAsUpIndicator(R.drawable.ic_action_menu);
  }
  
  private void initUi() {
      drawerLayout = (DrawerLayout) findViewById(R.id.drawer);
      navigationView = (NavigationView) findViewById(R.id.navigation);
      viewPager = (ViewPager) findViewById(R.id.viewPager);
      tabLayout = (TabLayout) findViewById(R.id.tab);
  
  }
  
  private void loadCategories() {
      StringRequest request = new StringRequest(Constants.URL_GET_CATEGORIES, new Response.Listener&lt;String&gt;() {
          @Override
          public void onResponse(String response) {
              categoriesDTO = Constants.gson.fromJson(response, CategoriesDTO.class);
              ViewPagerAdapter adapter = new ViewPagerAdapter(getSupportFragmentManager());
              viewPager.setOffscreenPageLimit(1);
              viewPager.setAdapter(adapter);
              setTabLayout();
          }
      }, new Response.ErrorListener() {
          @Override
          public void onErrorResponse(VolleyError error) {
  
          }
      });
  
      ApplicationController.getmInstance().addToRequestQueue(request);
  }
  
  private void setTabLayout() {
  
      tabLayout.setupWithViewPager(viewPager);
  
  }
  
  
  @Override
  public boolean onCreateOptionsMenu(Menu menu) {
      MenuInflater menuInflater = getMenuInflater();
      menuInflater.inflate(R.menu.home_side_menu, menu);
      return true;
  }
  
  @Override
  public boolean onOptionsItemSelected(MenuItem item) {
      int id = item.getItemId();
      switch (id) {
          case android.R.id.home:
              drawerLayout.openDrawer(GravityCompat.START);
              return true;
      }
      return super.onOptionsItemSelected(item);
  }
  
  private class ViewPagerAdapter extends FragmentPagerAdapter {
  
      public ViewPagerAdapter(FragmentManager fm) {
          super(fm);
      }
  
      @Override
      public Fragment getItem(int position) {
          return new ContentFragment();
      }
  
      @Override
      public int getCount() {
          return 10;
      }
  
      @Override
      public CharSequence getPageTitle(int position) {
          String title = categoriesDTO.getCategories().get(position).getTitle();
          return (CharSequence) title;
      }
  }
  </code></pre>
  
  <p>And xml file</p>
  
  <pre><code>&lt;?xml version="1.0" encoding="utf-8"?&gt;
  </code></pre>
  
  <p></p>
  
  <pre><code>&lt;android.support.design.widget.CoordinatorLayout
      android:layout_width="match_parent"
      android:layout_height="match_parent"&gt;
  
  
      &lt;android.support.design.widget.AppBarLayout
          android:id="@+id/app_bar"
          android:layout_width="match_parent"
          android:layout_height="wrap_content"&gt;
  
          &lt;include
              android:id="@+id/toolbar"
              layout="@layout/toolbar"
              app:layout_scrollFlags="scroll|enterAlways"
              app:popupTheme="@style/ThemeOverlay.AppCompat.Light" /&gt;
  
          &lt;android.support.design.widget.TabLayout
              android:id="@+id/tab"
              android:layout_width="match_parent"
              android:layout_height="wrap_content"
              app:tabTextColor="#fff"
              app:tabGravity="fill"
              app:tabMode="scrollable"
              &gt;
  
          &lt;/android.support.design.widget.TabLayout&gt;
      &lt;/android.support.design.widget.AppBarLayout&gt;
  
      &lt;android.support.v4.view.ViewPager
          android:id="@+id/viewPager"
          android:layout_width="match_parent"
          android:layout_height="match_parent"
          app:layout_behavior="@string/appbar_scrolling_view_behavior"&gt;
  
      &lt;/android.support.v4.view.ViewPager&gt;
  &lt;/android.support.design.widget.CoordinatorLayout&gt;
  
  &lt;android.support.design.widget.NavigationView
      android:id="@+id/navigation"
      android:layout_width="wrap_content"
      android:layout_height="match_parent"
      android:layout_gravity="start"
      app:menu="@menu/home_drawer_menu"&gt;
  
  &lt;/android.support.design.widget.NavigationView&gt;
  </code></pre>
  
  <p></p>
  
  <p>Here is the screenshot you can see the indicator is partially divided.</p>
  
  <p><a href="https://i.stack.imgur.com/EhMVn.png"><img src="https://i.stack.imgur.com/EhMVn.png" alt="enter image description here"></a></p>
  
  <p>Any solution?</p>