如何在工具栏中使用TabLayout?

问题描述:

美好的一天!我目前正在创建一个android应用程序。我的第一个问题是,我的TabLayout出现问题。我想显示tablayout工具栏...如何在工具栏中使用TabLayout?

这是我的MainActivity:

@Override 
    protected void onCreate(Bundle savedInstanceState) { 
     super.onCreate(savedInstanceState); 
     setContentView(R.layout.activity_main); 

     // Create the adapter that will return a fragment for each section 
     mPagerAdapter = new FragmentPagerAdapter(getSupportFragmentManager()) { 
      private final Fragment[] mFragments = new Fragment[] { 
        new MyPostsFragment(), 
        new MyPostsFragment(), 
        new MyPostsFragment(), 
      }; 
      private final String[] mFragmentNames = new String[] { 
        getString(R.string.heading_recent), 
        getString(R.string.heading_recent), 
        getString(R.string.heading_recent) 
      }; 
      @Override 
      public Fragment getItem(int position) { 
       return mFragments[position]; 
      } 
      @Override 
      public int getCount() { 
       return mFragments.length; 
      } 
      @Override 
      public CharSequence getPageTitle(int position) { 
       return mFragmentNames[position]; 
      } 
     }; 
     // Set up the ViewPager with the sections adapter. 
     mViewPager = (ViewPager) findViewById(R.id.container); 
     mViewPager.setAdapter(mPagerAdapter); 
     TabLayout tabLayout = (TabLayout) findViewById(R.id.tabs); 
     tabLayout.setupWithViewPager(mViewPager); 

     // Button launches NewPostActivity 
     findViewById(R.id.fab_new_post).setOnClickListener(new View.OnClickListener() { 
      @Override 
      public void onClick(View v) { 
       startActivity(new Intent(MainActivity.this, NewReportActivity.class)); 
      } 
     }); 
    } 

而这正是布局:

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    tools:context=".activities.MainActivity"> 

    <android.support.design.widget.TabLayout 
     android:id="@+id/tabs" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" /> 

    <android.support.v4.view.ViewPager 
     android:id="@+id/container" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:layout_below="@id/tabs" /> 

    <android.support.design.widget.FloatingActionButton 
     android:id="@+id/fab_new_post" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_alignParentBottom="true" 
     android:layout_alignParentRight="true" 
     android:src="@drawable/ic_add_new_report" 
     android:layout_margin="16dp"/> 

</RelativeLayout> 

enter image description here

你的主题延伸到parent="Theme.AppCompat.Light.NoActionBar"会做的伎俩

<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar"> 

通过添加此,你告诉系统不要使用ActionBar

你可以简单地隐藏Toolbar来实现你想要的。

动态:

getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,WindowManager.LayoutParams.FLAG_FULLSCREEN); 

或通过Styles

android:theme="@android:style/Theme.Holo.Light.NoActionBar.Fullscreen" 

试试这个,我可以使用下面的代码以添加工具栏里面标签。

<android.support.design.widget.AppBarLayout 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:theme="@style/AppTheme.AppBarOverlay"> 

    <android.support.v7.widget.Toolbar 
     android:id="@+id/toolbar" 
     android:layout_width="match_parent" 
     android:layout_height="?attr/actionBarSize" 
     android:background="?attr/colorPrimary" 
     app:popupTheme="@style/AppTheme.PopupOverlay" > 
    <android.support.design.widget.TabLayout 
     android:id="@+id/tabs" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     app:tabTextColor="@android:color/white" 
     app:tabSelectedTextColor="@color/aqua_marine" 
     app:tabIndicatorColor="@color/aqua_marine" 
     app:tabMode="fixed" 
     app:tabGravity="fill"> 
    </android.support.design.widget.TabLayout> 
    </android.support.v7.widget.Toolbar> 
</android.support.design.widget.AppBarLayout> 

<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" /> 

<include layout="@layout/content_home" />