title: Error Position UI of android.support.design.widget.TabLayout
body: <p>I use android.support.design.widget.TabLayout to build a detail page with Tab Layout. However, my layout has a problem when initializated. I want this page title is center tab layout (picture 2). This is my code:</p>
  
  <p>Layout.xml</p>
  
  <pre><code>&lt;android.support.design.widget.TabLayout
              android:id="@+id/tab"
              android:layout_width="match_parent"
              android:layout_height="wrap_content"
              app:tabGravity="fill"
              app:tabMode="scrollable"/&gt;
  </code></pre>
  
  <p>NewsDetailActivity.java</p>
  
  <pre><code>public class NewsDetailActivity extends AppCompatActivity implements NewsDetailFragmentPagerAdapter.OnLoadListener {
  
  public static String ARG_TITLE = "ARG_TITLE";
  public static String ARG_CATEGORY = "ARG_CATEGORY";
  public static String ARG_ITEM_ID = "ARG_ITEM_ID";
  public static final String ARG_NEWS_LIST = "ARG_NEWS_LIST";
  public static final String ARG_UPDATE_TIME = "ARG_UPDATE_TIME";
  public static final String RANKING_TITLE = "ランキング";
  
  /**
   * View pager
   */
  private ViewPager mViewPager;
  
  /**
   * Tab layout
   */
  private TabLayout mTabLayout;
  
  /**
   * News detal fragment pager adapter
   */
  private NewsDetailFragmentPagerAdapter mNewsDetailFragmentPagerAdapter;
  
  /**
   * Update time (JSON update)
   */
  private String mUpdateTime;
  
  /**
   * Snack bar (Advertisement)
   */
  private Snackbar snackbar;
  
  /**
   * スワイプチュートリアルを表示するイメージビューです（取得：onCreateView/破棄：onDestroyView）
   */
  protected ImageView mImageViewTutorialSwipe;
  
  /**
   * News Util
   */
  private NewsUtil newsUtil;
  
  /**
   * onCreate
   * @param savedInstanceState
   */
  @Override
  protected void onCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      setContentView(R.layout.activity_news_detail);
  
      // Check showed tutorial
      boolean tutorialShowed;
  
      // チュートリアルを表示したかのフラグを取得
      tutorialShowed = SNewsData.getNewsDetailTotorialShowed(this);
  
      // Get item information
      String categoryTitle = getIntent().getStringExtra(ARG_TITLE);
      mUpdateTime = getIntent().getStringExtra(ARG_UPDATE_TIME);
      List&lt;NewsItem&gt; mNewsList = (List&lt;NewsItem&gt;) getIntent().getSerializableExtra(NewsDetailActivity.ARG_NEWS_LIST);
  
      // Init toolbar
      Toolbar toolbar = (Toolbar) findViewById(R.id.tool_bar);
      setSupportActionBar(toolbar);
  
      // UI参照の取得
      this.mImageViewTutorialSwipe = (ImageView) findViewById(R.id.imageViewTutorialSwipe);
  
      // Init view pager
      mViewPager = (ViewPager) findViewById(R.id.viewpager);
      mNewsDetailFragmentPagerAdapter = new NewsDetailFragmentPagerAdapter(getSupportFragmentManager(), NewsDetailActivity.this ,categoryTitle,  mNewsList, mViewPager);
      mTabLayout = (TabLayout) findViewById(R.id.tab);
  
      // Set action bar
      restoreActionBar();
  
      // チュートリアル画像のイベント設定
      // チュートリアルを表示したことが無い場合はアニメーション化して表示
      this.newsUtil = new NewsUtil(this,this.mImageViewTutorialSwipe,true);
      this.newsUtil.setImageViewTutorialEvents();
      if(tutorialShowed == false) {
          //チュートリアル
          this.newsUtil.showTutorialAnimation();
      }
  
      // Show snack bar
      snackbar = Snackbar.make(findViewById(R.id.viewpager), "AD Space", Snackbar.LENGTH_LONG);
      snackbar.setAction("ACTION", new View.OnClickListener() {
          @Override
          public void onClick(View v) {
              Toast.makeText(getApplicationContext(), "ACTION executed", Toast.LENGTH_SHORT).show();
          }
      });
  }
  
  /**
   * Resume application
   */
  @Override
  protected void onResume() {
      snackbar.show();
      super.onResume();
  }
  
  /**
   * Set action bar
   */
  public void restoreActionBar() {
      ActionBar actionBar = getSupportActionBar();
      actionBar.setDisplayShowTitleEnabled(true);
      actionBar.setDisplayHomeAsUpEnabled(true);
  
      // Set action bar title
      String title = getIntent().getStringExtra(ARG_TITLE);
      String category = getIntent().getStringExtra(ARG_CATEGORY);
  
      if (category != null) {
          actionBar.setTitle(category);
      } else {
          if(title.equals(RANKING_TITLE)) {
              actionBar.setTitle(title + "（" + mUpdateTime + "更新）");
          } else {
              actionBar.setTitle(title);
          }
      }
  }
  
  /**
   * onLoad Finished
   * @param adapter
   */
  @Override
  public void onLoadFinished(NewsDetailFragmentPagerAdapter adapter) {
      String itemId = getIntent().getStringExtra(ARG_ITEM_ID);
      int mDefaultPage = mNewsDetailFragmentPagerAdapter.getPage(itemId);
      mViewPager.setAdapter(mNewsDetailFragmentPagerAdapter);
      mViewPager.setCurrentItem(mDefaultPage);
      mTabLayout.setupWithViewPager(mViewPager);
  }
  }
  </code></pre>
  
  <p>NewsDetailFragmentPagerAdapter.javav</p>
  
  <pre><code>public class NewsDetailFragmentPagerAdapter extends FragmentPagerAdapter implements LoaderManager.LoaderCallbacks&lt;Cursor&gt; {
  
  public static final String TAG = "NewsDetailFragmentPagerAdapter";
  
  /**
   * Context view
   */
  private Context mContext;
  
  /**
   * View pager
   */
  private ViewPager mViewPager;
  
  /**
   * News list
   */
  private List&lt;NewsItem&gt; mNewsList;
  
  /**
   * Category title
   */
  private String mCategoryTitle;
  
  /**
   * Fragment news list
   */
  List&lt;NewsDetailFragment&gt; fragmentList;
  
  /**
   * Check send GA
   */
  boolean isSendGa = false;
  
  /**
   * OnLoadListener event
   */
  private OnLoadListener mListener;
  
  /**
   * Current selected position
   */
  private int mCurrentPosition;
  
  /**
   * Created Fragment List
   */
  private WeakHashMap&lt;NewsDetailFragment, Integer&gt; weakHashMapCreatedFragments;
  
  /**
   * Interface OnLoadListener event
   */
  public interface OnLoadListener {
      public void onLoadFinished(NewsDetailFragmentPagerAdapter adapter);
  }
  
  /**
   * Contractor news detail fragment adapter
   * @param fragmentManager
   * @param context
   * @param categoryTitle
   * @param newsList
   * @param viewPager
   */
  public NewsDetailFragmentPagerAdapter(FragmentManager fragmentManager, Context context, String categoryTitle, List&lt;NewsItem&gt; newsList, ViewPager viewPager) {
      super(fragmentManager);
      this.mContext = context;
      this.mCategoryTitle = categoryTitle;
      this.mNewsList = newsList;
      this.mViewPager = viewPager;
      this.weakHashMapCreatedFragments = new WeakHashMap&lt;NewsDetailFragment, Integer&gt;();
      fragmentList = new ArrayList&lt;NewsDetailFragment&gt;();
      try {
          mListener = (OnLoadListener) context;
      } catch (ClassCastException e) {
          throw new ClassCastException(context.toString()
                  + " must implement OnLoadListener");
      }
      initLoader();
  }
  
  /**
   * Init loader
   */
  protected void initLoader() {
      Bundle bundle = new Bundle();
      ((AppCompatActivity) mContext).getSupportLoaderManager().initLoader(0, bundle, this);
  }
  
  /**
   * Get position item in a list
   *
   * @param itemId
   * @return
   */
  public int getPage(String itemId) {
      int page = 0;
      for (int i = 0; i &lt; mNewsList.size(); i++) {
          if (mNewsList.get(i).getId().equals(itemId)) {
              return page;
          }
          page++;
      }
      return 0;
  }
  
  /**
   * Count news detail list
   * @return
   */
  @Override
  public int getCount() {
      return mNewsList.size();
  }
  
  /**
   * Get item by position
   * @param position
   * @return
   */
  @Override
  public Fragment getItem(int position) {
      // Get current position
      mCurrentPosition = mViewPager.getCurrentItem();
  
      NewsDetailFragment fragment;
  
      // フラグメント生成
      fragment = NewsDetailFragment.newInstance(position, mCurrentPosition, mNewsList);
      fragment.setPagerAdapter(this);
      fragment.setHasOptionsMenu(true);
  
      if (!fragmentList.contains(fragment)) {
          //フォントサイズをかえたときにすべてのページに適用されるようにするために保持する
          fragmentList.add(fragment);
      }
  
      // 弱参照に作ったフラグメントを追加
      this.weakHashMapCreatedFragments.put(fragment, position);
  
      return fragment;
  }
  
  /**
   * Set detail title
   * @param position
   * @return
   */
  @Override
  public CharSequence getPageTitle(int position) {
      if (mNewsList.size() &gt; 0) {
          if (mCategoryTitle.equals(NewsDetailActivity.RANKING_TITLE)) {
              return (position + 1) + "位：" + mNewsList.get(position).getTitle();
          } else {
              return mNewsList.get(position).getTitle();
          }
      }
      return null;
  }
  
  /**
   * Get fragment list
   * @return
   */
  public List&lt;NewsDetailFragment&gt; getFragmentList() {
      return this.fragmentList;
  }
  
  /**
   * Set send GA
   * @param isSend
   */
  public void setIsSendGA(boolean isSend) {
      this.isSendGa = isSend;
  }
  
  /**
   * Check send GA
   * @return
   */
  public boolean isSendGA() {
      return this.isSendGa;
  }
  
  @Override
  public Loader&lt;Cursor&gt; onCreateLoader(int id, Bundle args) {
      return new CursorLoader(mContext.getApplicationContext(), Uri.EMPTY, null, null, null, null);
  }
  
  @Override
  public void onLoadFinished(Loader&lt;Cursor&gt; loader, Cursor data) {
      this.notifyDataSetChanged();
  
      mListener.onLoadFinished(this);
  }
  
  @Override
  public void onLoaderReset(Loader&lt;Cursor&gt; loader) {
  
  }
  }
  </code></pre>
  
  <p>Picture</p>
  
  <p>[IMG]<a href="http://i.imgur.com/gjfaPBV.png[/IMG]" rel="nofollow">http://i.imgur.com/gjfaPBV.png[/IMG]</a>
  [IMG]<a href="http://i.imgur.com/1JgmRIO.png[/IMG]" rel="nofollow">http://i.imgur.com/1JgmRIO.png[/IMG]</a></p>
  
  <p>Please anyone can help me to find out what am done wrong.Thanks in advance..</p>