在TabView中添加兩個TextView

Question

我正在嘗試獲得與此選項卡類似的選項卡布局，其中選項卡的頂部是星期幾，底部是一個月幾日。 布局

我只需要一些有關如何執行此操作的想法。 我雖然在選項卡中添加了兩個TextViews，但無法使其正常工作。 這是我到目前為止所得到的。

 private Toolbar toolbar; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar); setSupportActionBar(toolbar); DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout); ActionBarDrawerToggle toggle = new ActionBarDrawerToggle( this, drawer, toolbar, R.string.navigation_drawer_open, R.string.navigation_drawer_close); drawer.setDrawerListener(toggle); toggle.syncState(); NavigationView navigationView = (NavigationView) findViewById(R.id.nav_view); navigationView.setNavigationItemSelectedListener(this); toolbar = (Toolbar) findViewById(R.id.toolbar); setSupportActionBar(toolbar); toolbar.setElevation(0); ViewPager viewPager = (ViewPager) findViewById(R.id.viewpager); setupViewPager(viewPager); TabLayout tabLayout = (TabLayout) findViewById(R.id.tabs); tabLayout.setupWithViewPager(viewPager); setupNumTab(); } private void setupViewPager(ViewPager viewPager) { ViewPagerAdapter adapter = new ViewPagerAdapter(getSupportFragmentManager()); adapter.addFrag(new OneFragment(), "ONE", 1); adapter.addFrag(new TwoFragment(), "TWO", 2); adapter.addFrag(new ThreeFragment(), "THREE", 3); adapter.addFrag(new FourFragment(), "FOUR", 4); adapter.addFrag(new FiveFragment(), "FIVE", 5); viewPager.setAdapter(adapter); } public void setupNumTab() { LinearLayout layout = new LinearLayout(this); layout.setOrientation(LinearLayout.VERTICAL); TextView nameView = new TextView(this); nameView.setText("TEST"); layout.addView(nameView); TextView anotherView = new TextView(this); anotherView.setText("12"); layout.addView(anotherView); setContentView(layout); } 

Answer 1

一種方法是使用TabLayout ，對於每個項目，使用customView。

然后將其附加到viewPager。

如果要顯示許多選項卡，請使用fragmentStatePagerAdapter，或者如果只有2個或3個選項卡，請使用fragmentPagerAdapter 。 您可以閱讀更多有關它們的信息。

做這樣的事情...

假設這是您的一個mainActivity xml布局。

<android.support.design.widget.TabLayout
    android:id="@+id/tab_layout"
    android:layout_width="match_parent"
    android:layout_height="61.8dp"
    android:background="#06acef"
    android:elevation="0dp"
    android:theme="@style/ThemeOverlay.AppCompat.Dark"
    app:elevation="0dp"
    app:tabGravity="center"
    app:tabIndicatorColor="@color/white"
    app:tabMode="fixed"
    app:tabPaddingEnd="-1dp"
    app:tabPaddingStart="-1dp"
    android:fillViewport="false">
</android.support.design.widget.TabLayout>

   <ViewPager
        android:id="@+id/view_pager"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
    </ViewPager>

他們的父母可以是LinearLayout或說RelativeLayout 。 具體取決於您的操作方式。

現在，為您的標簽頁創建另一種布局。 說出tab_layout.xml

<TextView
    android:id="@+id/text1"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" />
<TextView
    android:layout_below="@id/text2"
    android:id="@+id/show_time_tab_date"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" />

現在在您的主要活動中。

內部onCreate（）回調

   ViewPageAdapter viewPageAdapter = new ViewPageAdapter(getSupportFragmentManager(), getApplicationContext(),this);

        mViewPager.setAdapter(viewPageAdapter);
        mTabLayout.setupWithViewPager(mViewPager);

       // bind each tab data here
        for (int i = 0; i < range; i++) {
            TabLayout.Tab tab = mTabLayout.getTabAt(i);
            tab.setCustomView(viewPageAdapter.getTabView(i));
        }

現在，您的ViewPageAdapter

public class ViewPageAdapter extends FragmentStatePagerAdapter{
    @Override
    public Fragment getItem(int position) {

       return YoutFragment.newInstance();
    }

    @Override
    public int getCount() {
        return 10;
    }

    public View getTabView(int position) {
        LayoutInflater layoutInflater = LayoutInflater.from(mContext);
        View tabView = layoutInflater.inflate(R.layout.your_custom_tab_layout, null, false);
        TextView text1 = (TextView) tabView.findViewById(R.id.text1);
        TextView text2 = (TextView) tabView.findViewById(R.id.text2);
        text1.setText("text1");
        text2.setText("dateStr[1]");
        return tabView;
    }
}

最后，對於每個viewpagerAdapter，您的片段都在getItem（）回調內部被調用。

public class YourFragment extends Fragment{
      public static YourFragment newInstance(){
          return new YourFragment()
      }
}