TabLayout和ViewPager简单实现页卡的滑动
首先需要在当前的module中的build Gradle的 dependencies中加入以下句子
compile 'com.android.support:design:23.0.1' 因为我们用到的TabLayout是属于android.support.design.widget中的组件 以下为主xml文件,包含TabLayout和ViewPager两个组件
<?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"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.design.widget.TabLayout
android:id="@+id/tabs"
android:layout_height="wrap_content"
android:layout_width="match_parent"
app:tabIndicatorColor="@android:color/holo_red_dark" //游标的颜色
app:tabSelectedTextColor="@android:color/holo_red_light" //选中的标签的颜色
app:tabTextColor="@android:color/black"/> //普通状态下的标签颜色 <android.support.v4.view.ViewPager
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:id="@+id/vp_view"
/>
</LinearLayout> //页卡适配器类
public class CustomPagerAdapter extends PagerAdapter {
private ArrayList<View>mViewList;
private ArrayList<String>mTabList;
public CustomPagerAdapter(ArrayList<View>viewList,ArrayList<String>tabList)
{
this.mTabList = tabList;
this.mViewList = viewList;
}
@Override
public Object instantiateItem(ViewGroup container, int position) {
container.addView(mViewList.get(position));
return mViewList.get(position);
} @Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView(mViewList.remove(position));
} @Override
public int getCount() {
return mViewList.size();
} @Override
public boolean isViewFromObject(View view, Object object) { return view == object;
} @Override
public CharSequence getPageTitle(int position) {
return mTabList.get(position);
}
}
以下是主界面的代码,主要通过TabLayout和ViewPager来实现滑动页卡的效果,比较简单
package com.hcc.customviewpager; import android.support.design.widget.TabLayout;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.Gravity;
import android.view.LayoutInflater;
import android.view.View; import java.util.ArrayList; public class NewsHomePage extends AppCompatActivity {
ArrayList<View>mViewList;//Save each of the Page View
ArrayList<String>mTabList;//Save each of the Tabs'Title
ViewPager mViewPager;
TabLayout mTabLayout;
LayoutInflater mLayoutInflater;
View view_home;
View view_intro;
View view_info;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
findViews();
initList(); //Add ViewList view_home = mLayoutInflater.inflate(R.layout.pager_home,null);
view_info = mLayoutInflater.inflate(R.layout.page_information,null);
view_intro = mLayoutInflater.inflate(R.layout.page_introduce,null);
mViewList.add(view_home);
mViewList.add(view_info);
mViewList.add(view_intro); //Add TabList mTabList.add("个人信息");
mTabList.add("网易新闻");
mTabList.add("娱乐资讯"); mTabLayout.setTabMode(TabLayout.MODE_FIXED);//设置标签的模式,默认系统模式 //set the click event of Tag and change current page into the seleceted one mTabLayout.setOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
@Override
public void onTabSelected(TabLayout.Tab tab) {
mViewPager.setCurrentItem(tab.getPosition());//点击哪个就跳转哪个界面
}
@Override
public void onTabUnselected(TabLayout.Tab tab) {
}
@Override
public void onTabReselected(TabLayout.Tab tab) {
}
}); //Add the tag elements
mTabLayout.addTab(mTabLayout.newTab().setText(mTabList.get(0)));
mTabLayout.addTab(mTabLayout.newTab().setText(mTabList.get(1)));
mTabLayout.addTab(mTabLayout.newTab().setText(mTabList.get(2))); //Bind the adapter with the mViewPager as well as mTablayout CustomPagerAdapter myAdapter = new CustomPagerAdapter(mViewList, mTabList);
mViewPager.setAdapter(myAdapter);
mTabLayout.setupWithViewPager(mViewPager);
mTabLayout.setTabsFromPagerAdapter(myAdapter);
} private void initList(){
mTabList = new ArrayList<String>();
mViewList = new ArrayList<View>();
}
private void findViews() {
mLayoutInflater = LayoutInflater.from(this);
mTabLayout = (TabLayout)findViewById(R.id.tabs);
mViewPager = (ViewPager)findViewById(R.id.vp_view);
}
}
结果如下图:
最后说明一下
TabLayout.OnTabSelectedListener:监听Tab选中的事件
TabLayout.TabLayoutOnPageChangeListener:配合Viewpager使用的PageChangeListener用来切换Tab,不过这里提供的TabLayout以及帮助我们实现了,所以可以不用该方法
以上便是关于TabLayout和ViewPager联合使用达到滑动页卡面的效果
TabLayout和ViewPager简单实现页卡的滑动的更多相关文章
- TabLayout+ViewPager+Fragment制作页卡
本人很懒,直接上代码了. 布局文件: <?xml version="1.0" encoding="utf-8"?><android.suppo ...
- ViewPager实现页卡的最新方法--简洁的TabLayout(谷歌支持包)
效果图: 添加依赖包: compile ‘com.android.support:design:‘ 布局文件: <?xml version="1.0" encoding=&q ...
- ViewPager实现页卡的3种方法(谷歌组件)
----方法一:---- 效果图: 须要的组件: ViewPager+PagerTabStrip 布局文件代码: <!--xmlns:android_custom="http://sc ...
- 安卓TabLayout+ViewPager实现切页
安卓使用TabLayout+ViewPager+Fragment 实现页面切换,可实现左右滑动切换视图界面和点击切换 可自定义菜单栏是在顶部还是在底部 一.实现效果: 二.实现过程: 2.1 一些重要 ...
- 使用自定义RadioButton和ViewPager实现TabHost效果和带滑动的页卡效果
在工作中又很多需求都不是android系统自带的控件可以达到效果的,内置的TabHost就是,只能达到简单的效果 ,所以这个时候就要自定义控件来达到效果:这个效果就是: 使用自定义RadioButto ...
- ViewPager设置 缓存个数、页卡间距、数据更新
在使用ViewPager常用设置 1)mViewPager.setOffscreenPageLimit(2);//设置缓存view 的个数(实际有3个,缓存2个+正在显示的1个)2)mViewPage ...
- android SlidingTabLayout实现ViewPager页卡滑动效果
先来张效果图(能够滑动切换页卡) watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvcGVuZ2t2/font/5a6L5L2T/fontsize/400/fi ...
- Android随笔--使用ViewPager实现简单地图片的左右滑动切换
Android中图片的左右切换随处可见,今天我也试着查阅资料试着做了一下,挺简单的一个小Demo,却也发现了一些问题,话不多说,上代码~: 使用了3个xml文件作为ViewPager的滑动page,布 ...
- Android之ActionBar、Tabs、Fragment、ViewPager实现标签页切换并缓存页面
感觉 Android 到处都是坑,每个地方都要把人折腾半天. 今天来简单说说 Android之ActionBar.Tabs.Fragment.ViewPager 实现标签页切换并缓存页面 关于他们的介 ...
随机推荐
- ASP.NET MVC之文件上传【二】(九)
前言 上一节我们讲了简单的上传以及需要注意的地方,查相关资料时,感觉上传里面涉及到的内容还是比较多,于是就将上传这一块分为几节来处理,同时后续也会讲到关于做上传时遗漏的C#应该注意的地方,及时进行查漏 ...
- 为什么更喜欢Outlook,而不是Gmail
让我写这篇博客主要前段时间dudu写了一篇关于Google Gmail年龄限制问题,导致博客园管理员Gmail账号会被删除,里面的邮件无法迁移出来.围观地址:http://www.cnblogs.co ...
- Web接口测试工具---Poster与Postman
工作当中有不少时间在编写和维护接口自动化测试用例.打算先整理一些接口相关工具的使用. 简单对接Web口测试的相关工具/技术做个划分. HTTP/SOAP协议接口的功能测试: 1.浏览器URL(GET请 ...
- css3鼠标悬停图片渐显飞入效果
body程序: <div id="bei"> <div id="img"><img src="xianzi.png&qu ...
- PHP连接SQL Server相关配置及说明
关于php怎么连接数据库,大家肯定有不同的看法,有的用wamp,有的用xamp,他们都是集成环境,方便操作.但有时,数据库的类型不同,要连接不同的数据库.今天和大家分享一下如何连接sql2000,服 ...
- Java 技能树
- jQuery-1.9.1源码分析系列(十) 事件系统——事件委托
jQuery的事件绑定有几个比较优秀的特点: 1. 可以绑定不限数量的处理函数 2. 事件可以委托到祖先节点,不必一定要绑到对应的节点,这样后添加的节点也照样能被处理. 3. 链式操作 下面主要分析事 ...
- Python_Day_04 set方法总结
set(集合) 直接创建一个空集合 set_empty = set() print(set_empty) # set() 根据参数创建 # 根据参数 set_argument = set(42,',' ...
- DNS知识指南
1. 什么是记录? 记录的实质是存在DNS服务器叶结点上的一条映射(只讨论权威DNS,不讨论Local DNS). A记录:(域名:IP地址) 例:cnblogs.com A 42.121.25 ...
- LINQ to SQL语句(15)之String
LINQ to SQL支持以下String方法.但是不同的是默认情况下System.String方法区分大小写.而SQL则不区分大小写. 1.字符串串联(String Concatenation) v ...