TabLayout 遇到那些坑 tab標籤不顯示問題
阿新 • • 發佈:2018-12-09
別人寫的參考下,知道問題所在
如何使用 :注意事項
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" xmlns:app="http://schemas.android.com/apk/res-auto"> <android.support.design.widget.TabLayout android:id="@+id/tabs" android:layout_width="match_parent" android:layout_height="wrap_content" app:tabIndicatorColor="@color/colorAccent" app:tabSelectedTextColor="@color/colorAccent" > <android.support.design.widget.TabItem android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="android" /> <android.support.design.widget.TabItem android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="java" /> <android.support.design.widget.TabItem android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="javascript" /> <android.support.design.widget.TabItem android:layout_width="wrap_content" android:layout_height="wrap_content" android:icon="@drawable/ic_launcher" /> </android.support.design.widget.TabLayout> </RelativeLayout>
java程式碼:
public class MainActivity extends AppCompatActivity { @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); ViewPager viewPager = (ViewPager) findViewById(R.id.vp_pager); MyAdapter myAdapter = new MyAdapter(); viewPager.setAdapter(myAdapter); TabLayout tabLayout = (TabLayout) findViewById(R.id.tabs); tabLayout.addTab(tabLayout.newTab().setText("Tab 1")); tabLayout.addTab(tabLayout.newTab().setText("Tab 2")); tabLayout.addTab(tabLayout.newTab().setText("Tab 3")); tabLayout.addTab(tabLayout.newTab().setText("Tab 4")); tabLayout.setupWithViewPager(viewPager); } class MyAdapter extends PagerAdapter { @Override public int getCount() { return 4; } @Override public boolean isViewFromObject(View view, Object object) { return view == object; } @Override public Object instantiateItem(ViewGroup container, int position) { ImageView imageView = new ImageView(MainActivity.this); imageView.setBackgroundResource(R.drawable.ic_launcher); container.addView(imageView); return imageView; } @Override public void destroyItem(ViewGroup container, int position, Object object) { container.removeView((View) object); } } }
然而,看到執行結果的我一臉懵逼.
然後,我又嘗試著註釋掉了這行程式碼
tabLayout.setupWithViewPager(viewPager);
- 1
雖然Tab和 ViewPagre 失去了關聯,但是最起碼按我的想法展示出來了.
現在已經找到了罪魁禍首,就是 tabLayout.setupWithViewPager(viewPager); 搞的鬼,然後我點進去檢視一下原始碼,
/** * The one-stop shop for setting up this {@link TabLayout} with a {@link ViewPager}. * * <p>This method will link the given ViewPager and this TabLayout together so that any * changes in one are automatically reflected in the other. This includes adapter changes, * scroll state changes, and clicks. The tabs displayed in this layout will be populated * from the ViewPager adapter's page titles.</p> * * <p>After this method is called, you will not need this method again unless you want * to change the linked ViewPager.</p> * * <p>If the given ViewPager is non-null, it needs to already have a * {@link PagerAdapter} set.</p> * * @param viewPager The ViewPager to link, or {@code null} to clear any previous link. */ public void setupWithViewPager(@Nullable final ViewPager viewPager) { if (mViewPager != null && mPageChangeListener != null) { // If we've already been setup with a ViewPager, remove us from it mViewPager.removeOnPageChangeListener(mPageChangeListener); } if (viewPager != null) { final PagerAdapter adapter = viewPager.getAdapter(); if (adapter == null) { throw new IllegalArgumentException("ViewPager does not have a PagerAdapter set"); } mViewPager = viewPager; // Add our custom OnPageChangeListener to the ViewPager if (mPageChangeListener == null) { mPageChangeListener = new TabLayoutOnPageChangeListener(this); } mPageChangeListener.reset(); viewPager.addOnPageChangeListener(mPageChangeListener); // Now we'll add a tab selected listener to set ViewPager's current item setOnTabSelectedListener(new ViewPagerOnTabSelectedListener(viewPager)); // Now we'll populate ourselves from the pager adapter setPagerAdapter(adapter, true); } else { // We've been given a null ViewPager so we need to clear out the internal state, // listeners and observers mViewPager = null; setOnTabSelectedListener(null); setPagerAdapter(null, true); } } 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 貌似沒神魔問題,再看看 setPagerAdapter private void setPagerAdapter(@Nullable final PagerAdapter adapter, final boolean addObserver) { if (mPagerAdapter != null && mPagerAdapterObserver != null) { // If we already have a PagerAdapter, unregister our observer mPagerAdapter.unregisterDataSetObserver(mPagerAdapterObserver); } mPagerAdapter = adapter; if (addObserver && adapter != null) { // Register our observer on the new adapter if (mPagerAdapterObserver == null) { mPagerAdapterObserver = new PagerAdapterObserver(); } adapter.registerDataSetObserver(mPagerAdapterObserver); } // Finally make sure we reflect the new adapter populateFromPagerAdapter(); }
貌似也沒什麼問題啊,此時我萬念俱灰,又抱著一絲希望點開看看 populateFromPagerAdapter();
private void populateFromPagerAdapter() {
removeAllTabs();
if (mPagerAdapter != null) {
final int adapterCount = mPagerAdapter.getCount();
for (int i = 0; i < adapterCount; i++) {
addTab(newTab().setText(mPagerAdapter.getPageTitle(i)), false);
}
// Make sure we reflect the currently set ViewPager item
if (mViewPager != null && adapterCount > 0) {
final int curItem = mViewPager.getCurrentItem();
if (curItem != getSelectedTabPosition() && curItem < getTabCount()) {
selectTab(getTabAt(curItem));
}
}
} else {
removeAllTabs();
}
}
找到了,
removeAllTabs();
- 1
就只這行程式碼,竟然在這兒 remove 掉了我之前設定的所有 Tab ,我真是想日了個狗啊,這在官方文件上沒一點提示啊.
然後我又修改了一下程式碼(先要修改了呼叫tabLayout.setupWithViewPager(viewPager);的順序):
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ViewPager viewPager = (ViewPager) findViewById(R.id.vp_pager);
MyAdapter myAdapter = new MyAdapter();
viewPager.setAdapter(myAdapter);
TabLayout tabLayout = (TabLayout) findViewById(R.id.tabs);
classifidNewsTabLayout.setupWithViewPager(classifiedNewsViewPager);
for (int i=0;i<classifidNewsTabLayout.getTabCount();i++) {
classifidNewsTabLayout.getTabAt(i).setText(classifiedNesTitleString[i]);
}
}
class MyAdapter extends PagerAdapter {
@Override
public int getCount() {
return 4;
}
@Override
public boolean isViewFromObject(View view, Object object) {
return view == object;
}
@Override
public Object instantiateItem(ViewGroup container, int position) {
ImageView imageView = new ImageView(MainActivity.this);
imageView.setBackgroundResource(R.drawable.ic_launcher);
container.addView(imageView);
return imageView;
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView((View) object);
}
}
}
就好了
然後就知道為題所在了
demo 參考:git地址