TabLayout+ViewPager标签页滑动实现

标签页现在都是一些很常用的功能了,比如我们经常看见如下效果
效果
本文是继(http://blog.csdn.net/qq_33732958/article/details/55004562)继续完善的,如果有看不懂的地方可以移步到上面的文章看看。
首先需要写一个android.support.design.widget.TabLayout和

<?xml version="1.0" encoding="utf-8"?>
<!--菜单布局-->

<!--android:id="@+id/activity_sliding_menu"-->
<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:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    >

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar_main_title"
        android:layout_width="match_parent"
        android:layout_height="58dp"
        android:background="#9c9c9c"></android.support.v7.widget.Toolbar>

    <android.support.v4.widget.DrawerLayout
        android:id="@+id/dl_main_menulayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">
            <!--写页签-->
            <android.support.design.widget.TabLayout
                android:id="@+id/tab_main_title"
                android:layout_width="match_parent"
                android:layout_height="45dp"></android.support.design.widget.TabLayout>
            <!--与viewPager配合使用-->
            <android.support.v4.view.ViewPager
                android:id="@+id/vp_main_show_layout"
                android:layout_width="match_parent"
                android:layout_height="match_parent"/>
        </LinearLayout>

        <android.support.design.widget.NavigationView
            android:id="@+id/nav_main_menu"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_gravity="start"
            app:headerLayout="@layout/nav_head_layout"
            app:menu="@menu/nav_menu_list">
        </android.support.design.widget.NavigationView>

    </android.support.v4.widget.DrawerLayout>

</LinearLayout>

写完后我们需要进行初始化将TabLayout+ViewPager绑定在一起

        mTabMainTitle.setupWithViewPager(mVpMainShowLayout);

接下来设置adapter,新建个类继承PagerAdapter并且重写getCount()、isViewFromObject(View view, Object object) 、instantiateItem(ViewGroup container, int position)、destroyItem(ViewGroup container, int position, Object object)、getPageTitle(int position)方法
详细代码如下:

package com.example.newdatas.adapter;

import android.support.v4.view.PagerAdapter;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;

import com.example.newdatas.bean.ItemBean;

import java.util.ArrayList;
import java.util.List;

/**
 * Created by xfj on 2017/2/13.
 */

public class MainShowAdapter extends PagerAdapter {
    private List<ItemBean> mShowItem = new ArrayList<>();

    public MainShowAdapter(List<ItemBean> showItem) {
        mShowItem = showItem;
    }

    //            显示几页
    @Override
    public int getCount() {
        return mShowItem.size();
    }

    //每次都写一样的  复用
    @Override
    public boolean isViewFromObject(View view, Object object) {
        return view == object;
    }
    //初始化

    @Override
    public Object instantiateItem(ViewGroup container, int position) {
//                显示图片
        ImageView imageView = new ImageView(container.getContext());
        imageView.setImageResource(mShowItem.get(position).image);
//                必须手动的加入到viewpager
        container.addView(imageView);
        return imageView;
    }

    //            销毁
    @Override
    public void destroyItem(ViewGroup container, int position, Object object) {
        container.removeView((View) object);  //每次写的都一样
    }
//            标题
    @Override
    public CharSequence getPageTitle(int position) {
        return mShowItem.get(position).title;
    }
}

adapter设置好后,设置给activity。代码如下

package com.example.newdatas.androidBase;

import android.os.Bundle;
import android.support.annotation.NonNull;
import android.support.design.widget.NavigationView;
import android.support.design.widget.TabLayout;
import android.support.v4.view.ViewPager;
import android.support.v4.widget.DrawerLayout;
import android.support.v7.app.ActionBar;
import android.support.v7.app.ActionBarDrawerToggle;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.view.MenuItem;
import android.widget.Toast;

import com.example.newdatas.R;
import com.example.newdatas.adapter.MainShowAdapter;
import com.example.newdatas.bean.ItemBean;

import java.util.ArrayList;
import java.util.List;

import butterknife.Bind;
import butterknife.ButterKnife;

public class SlidingMenu extends AppCompatActivity {

    //    @Bind(R.id.activity_sliding_menu)
    @Bind(R.id.dl_main_menulayout)
    DrawerLayout mDlMainMenulayout;
    @Bind(R.id.toolbar_main_title)
    Toolbar mToolbarMainTitle;
    @Bind(R.id.tab_main_title)
    TabLayout mTabMainTitle;
    @Bind(R.id.vp_main_show_layout)
    ViewPager mVpMainShowLayout;
    @Bind(R.id.nav_main_menu)
    NavigationView mNavMainMenu;

    private ActionBarDrawerToggle mDrawerToggle;
    private List<ItemBean> mShowItems = new ArrayList<>();

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_sliding_menu);
        ButterKnife.bind(this);
//        初始化actionbar
        initActionBar();
//        初始化界面
        initview();

        //设置Navigation的点击事件
        mNavMainMenu.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {
            @Override
            public boolean onNavigationItemSelected(@NonNull MenuItem item) {
                switch (item.getItemId()) {
                    case R.id.string1:
                        Toast.makeText(SlidingMenu.this, "ssss", Toast.LENGTH_SHORT).show();
                        break;
                }
                return true;
            }
        });
    }

    private void initview() {
//        初始化页签
//        初始化数据
        for (int i = 0; i < 5; i++) {
//            ctrl+alt抽取变量
            ItemBean e = new ItemBean();
            e.title = "测试"+i+"*";
            e.image = R.drawable.p13+i;
            mShowItems.add(e);
        }
//        页签与viewpager绑定

        mTabMainTitle.setupWithViewPager(mVpMainShowLayout);
//        设置adapter
        mVpMainShowLayout.setAdapter(new MainShowAdapter(mShowItems));
    }

    private void initActionBar() {
        //设置titlebar
        setSupportActionBar(mToolbarMainTitle);
//        拿到actionbar
        ActionBar supportActionBar = getSupportActionBar();
//        设置标题
        supportActionBar.setTitle("标题");
//       显示箭头 固定写法 显示并且可以先显示
        supportActionBar.setDefaultDisplayHomeAsUpEnabled(true);
        supportActionBar.setDisplayHomeAsUpEnabled(true);

//        显示汉堡箭头
//        菜单开关对象
        mDrawerToggle = new ActionBarDrawerToggle(this, mDlMainMenulayout, R.string.open, R.string.a);
//        进行同步
        mDrawerToggle.syncState();
//        设置点击事件
        mDlMainMenulayout.addDrawerListener(mDrawerToggle);
    }
//    设置点击事件
//    slelct
//    复写方法ctrl+a

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        switch (item.getItemId()) {
//            箭头对象
            case android.R.id.home:
//                拿到菜单箭头对象
                mDrawerToggle.onOptionsItemSelected(item);
                break;
        }
        return super.onOptionsItemSelected(item);
    }
}

demo链接这里写链接内容

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值