Android之仿美团TabLayout的简单使用

-----------------转载请注明出处：http://blog.csdn.net/android_cll

一：先来两张效果图：

----------------demo的效果从下列图的打折优惠点击进去、

二：实现步骤：

1.在build.gradle文件下加入下面这句代码并引用它、

compile 'com.android.support:design:23.3.0'

2.主框架的xml布局实现、

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:app="http://schemas.android.com/apk/res-auto"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="vertical">    <!-- 标题栏 -->    <include layout="@layout/title_layout" />    <android.support.design.widget.TabLayout        android:id="@+id/tab_FindFragment_title"        android:layout_width="match_parent"        android:layout_height="49dp"        android:background="#ffffff"        app:tabIndicatorColor="#0093ea"        app:tabSelectedTextColor="#0093ea"        app:tabTextColor="#262626" />    <android.support.v4.view.ViewPager        android:id="@+id/viewpager"        android:layout_width="fill_parent"        android:layout_height="0dp"        android:layout_weight="1" /></LinearLayout>

3.主框架的导航栏布局xml实现、

<?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="48dp"    android:background="#0093ea">    <ImageView        android:id="@+id/fanhui"        android:layout_width="wrap_content"        android:layout_height="fill_parent"        android:layout_marginLeft="5dp"        android:src="@mipmap/chaoshi_nav_fanhui_white_icon" />    <TextView        android:id="@+id/title_dh"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_centerInParent="true"        android:textColor="#ffffff"        android:textSize="18dp" />    <TextView        android:id="@+id/textls"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_alignParentRight="true"        android:layout_centerVertical="true"        android:layout_marginRight="12dp"        android:textColor="#ffffff"        android:textSize="16dp"        android:visibility="gone" /></RelativeLayout>

4.主框架的activity实现，我这是继承的fragmentActivity，代码都有注释我就不用解释太多了、

package cll.com.myapplication;import android.os.Bundle;import android.support.annotation.Nullable;import android.support.design.widget.TabLayout;import android.support.v4.app.Fragment;import android.support.v4.app.FragmentActivity;import android.support.v4.app.FragmentManager;import android.support.v4.app.FragmentPagerAdapter;import android.support.v4.view.ViewPager;import android.view.View;import android.widget.ImageView;import android.widget.TextView;import java.util.LinkedList;import java.util.List;/** * Created by Administrator on 2017/4/25. * TabLayout主框架 */public class Alreadycreated extends FragmentActivity implements View.OnClickListener {    private ViewPager viewpager;    private ImageView fanhui;//返回键    private TextView title_dh;//title    @Override    protected void onCreate(@Nullable Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.alreadycreated_layout);        initlayout();        inlayout();    }    /**     * 实例化     */    private void initlayout() {        viewpager = (ViewPager) findViewById(R.id.viewpager);        fanhui = (ImageView) findViewById(R.id.fanhui);        title_dh = (TextView) findViewById(R.id.title_dh);        title_dh.setText("已创建");        fanhui.setOnClickListener(this);    }    @Override    public void onClick(View view) {        switch (view.getId()) {            //返回键            case R.id.fanhui:                finish();                break;        }    }    /**     * 动态创建adapter     */    private class MyFragmentPagerAdapter extends FragmentPagerAdapter {        private List<Fragment> mFragments = new LinkedList<>();        private List<String> mTitles = new LinkedList<>();        public MyFragmentPagerAdapter(FragmentManager fm) {            super(fm);        }        public void addFragment(Fragment fragment, String title) {            mFragments.add(fragment);            mTitles.add(title);        }        @Override        public Fragment getItem(int position) {            return mFragments.get(position);        }        @Override        public CharSequence getPageTitle(int position) {            return mTitles.get(position);        }        @Override        public int getCount() {            return mFragments.size();        }    }    /**     * 添加需要的界面     */    private void inlayout() {        final MyFragmentPagerAdapter adapter = new MyFragmentPagerAdapter(this.getSupportFragmentManager());        adapter.addFragment(new AuditFragment().newInstance(), "审核中");        adapter.addFragment(new HaveInHandFragment().newInstance(), "进行中");        adapter.addFragment(new AlreadyOverFragment().newInstance(), "已结束");        viewpager.setAdapter(adapter);        //表示默认第二个界面        viewpager.setCurrentItem(1);        TabLayout tabLayout = (TabLayout) findViewById(R.id.tab_FindFragment_title);        tabLayout.setupWithViewPager(viewpager);    }}

-------------------就这么多了，不喜勿喷、

-------------------最后附上源码：http://download.csdn.net/download/android_cll/9824720