前言:对于选项卡,以前我们使用TabHost,或者经常使用别人封装好的选项卡!今天我们来使用一下google给我们提供的选项卡,一样可以做的很强大,效果一样很好!!!
-------------------------分割线---------------------------------
首先我们添加依赖,引用design包:
compile 'com.android.support:design:25.2.0'
-------------------------分割线---------------------------------
效果一:
核心代码:
tabLayout.setTabGravity(TabLayout.GRAVITY_FILL);
tabLayout.setTabMode(TabLayout.MODE_SCROLLABLE);
-------------------------分割线---------------------------------
效果二:
核心代码:
tabLayout.setTabGravity(TabLayout.GRAVITY_CENTER);
tabLayout.setTabMode(TabLayout.MODE_FIXED);
-------------------------分割线---------------------------------
效果三:
核心代码:
tabLayout.setTabGravity(TabLayout.GRAVITY_FILL);
tabLayout.setTabMode(TabLayout.MODE_FIXED);
-------------------------分割线---------------------------------
当然了,上面的属性也可以在布局中声明,下面来看一下完整的代码:
MainActivity代码:
public class MainActivity extends AppCompatActivity { private TabLayout tabLayout; private ViewPager viewPager; private String[] title = { "头条", "新闻", "娱乐", // "体育", // "科技", // "美女", // "财经", // "汽车", // "房子", // "头条" }; private MyPagerAdapter adapter; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); tabLayout = (TabLayout) findViewById(R.id.tablayout); viewPager = (ViewPager) findViewById(R.id.vp); Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar); setSupportActionBar(toolbar); adapter = new MyPagerAdapter(getSupportFragmentManager()); viewPager.setAdapter(adapter); tabLayout.setupWithViewPager(viewPager); } class MyPagerAdapter extends FragmentPagerAdapter { public MyPagerAdapter(FragmentManager fm) { super(fm); } @Override public CharSequence getPageTitle(int position) { return title[position]; } @Override public Fragment getItem(int position) { Fragment f = new NewsDetailFragment(); Bundle bundle = new Bundle(); bundle.putString("title", title[position]); f.setArguments(bundle); return f; } @Override public int getCount() { return title.length; } } }
然后在写一个Fragment类:
import android.graphics.Color; import android.os.Bundle; import android.support.annotation.Nullable; import android.support.v4.app.Fragment; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; import android.widget.TextView; /** * Created by Fly on 2017/5/8. */ public class NewsDetailFragment extends Fragment { @Nullable @Override public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) { TextView tv = new TextView(getContext()); Bundle bundle = getArguments(); String title = bundle.getString("title"); tv.setBackgroundColor(Color.rgb((int) (Math.random() * 255), (int) (Math.random() * 255), (int) (Math.random() * 255))); tv.setText(title); return tv; } }
布局代码:
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/activity_main" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" tools:context="com.fly.lsn12_tablayout.MainActivity"> <android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="?attr/colorPrimary" /> <android.support.design.widget.TabLayout android:id="@+id/tablayout" android:layout_width="match_parent" android:layout_height="wrap_content" app:tabGravity="fill" app:tabIndicatorColor="?attr/colorPrimary" app:tabMode="scrollable" app:tabSelectedTextColor="?attr/colorPrimaryDark" app:tabTextColor="?attr/colorPrimary" /> <android.support.v4.view.ViewPager android:id="@+id/vp" android:layout_width="match_parent" android:layout_height="match_parent" /> </LinearLayout>
----------------------------深夜撸代码,希望多多支持----------------------------------------------------