fragment+viewpager+tablayou实现滑动切换页面
本文目标:实现滑动切换页面
首先,Tablayout控件就需要添加design library,在android studio中添加依赖
compile ‘com.android.support:design:23.2.1’
或者直接:File-->Project structure-->app-->Dependencies中单击加号添加
com.android.support:design:23.2.1
线性布局中布局文件为:
<android.support.design.widget.TabLayoutandroid:id="@+id/tablayout"android:layout_width="match_parent"android:layout_height="wrap_content"> </android.support.design.widget.TabLayout> <android.support.v4.view.ViewPagerandroid:id="@+id/viewPager"android:layout_width="match_parent"android:layout_height="match_parent"> </android.support.v4.view.ViewPager>
需要Fragment的布局为:
<LinearLayout 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"android:orientation="vertical"><ListViewandroid:id="@+id/fragment_list"android:layout_width="match_parent"android:layout_height="wrap_content"></ListView></LinearLayout>
Fragment01的代码为:
public class Fragment01 extends Fragment {ListView mListView;public Fragment01() {}@Overridepublic View onCreateView(LayoutInflater inflater, ViewGroup container,Bundle savedInstanceState) {View v = inflater.inflate(R.layout.fragment_fragment01, container, false);mListView = (ListView) v.findViewById(R.id.fragment_01_list);return v;}
以同样的方式创建其余的Fragment。
接着定义ViewPager中的适配器:MyAdapter继承自FragmentPagerAdapter:
适配器中有两个集合,分别存放Fragment和tab的标题:
public class MyAdapter extends FragmentPagerAdapter {ArrayList<Fragment> lists;ArrayList<String> tabs;public CommunityPageAdapter(FragmentManager fm) {super(fm);}public void setData(ArrayList<Fragment> lists) {this.lists = lists;}public void setTabs(ArrayList<String> tabs) {this.tabs = tabs;}@Overridepublic Fragment getItem(int position) {return lists == null ? null : lists.get(position);}@Overridepublic int getCount() {return tabs == null ? 0 : tabs.size();}@Overridepublic CharSequence getPageTitle(int position) {return tabs == null ? null : tabs.get(position);} }
使用时需要添加两个集合
代码为:
MyAdapter myAdapter = new MyAdapter(getSupportFragmentManager());ArrayList<Fragment> lists = new ArrayList<Fragment>();lists.add(new Fragment01());lists.add(new Fragment02());lists.add(new Fragment03());myAdapter.setData(lists);ArrayList<String> tabs = new ArrayList<String>();tabs.add("01");tabs.add("02");tabs.add("03");myAdapter.setTabs(tabs);
适配器和数据都有了,就可以放入viewpager并且和Tablayout进行关联了:
TabLayout tabLayout = (TabLayout) findViewById(R.id.tablayout); ViewPager viewPager = (ViewPager) findViewById(R.id.viewPager);viewPager.setAdapter(adapter);//关联viewPager和TabLayouttabLayout.setupWithViewPager(viewPager);
到现在为止,已经实现了滑动切换页面的效果。
注:viewPager会预加载下一页,会占用较大的内存尤其是在listview中请求网络图片的时候(留下一个坑,以后补)。
TabLayout中有许多的属性,基本见名知意,通过app:来使用,例如:
<android.support.design.widget.TabLayoutandroid:id="@+id/tablayout"android:layout_width="match_parent"android:layout_height="wrap_content"app:tabTextColor="#78ffffff"app:tabBackground="@color/colorPrimary"app:tabMinWidth="100dp"app:tabIndicatorHeight="2dp"app:tabIndicatorColor="#ffffff"app:tabGravity="center"app:tabMode="scrollable"app:tabMaxWidth="100dp"app:tabSelectedTextColor="#ffffff"> </android.support.design.widget.TabLayout>
想要知道更多的属性,可以参考:http://www.jianshu.com/p/2b2bb6be83a8
转载于:https://www.cnblogs.com/mo-xue/p/5910880.html
fragment+viewpager+tablayou实现滑动切换页面相关推荐
- TabLayout让Fragment在ViewPager中的滑动切换更优雅
TabLayout让Fragment在ViewPager中的滑动切换更优雅 转载于:https://www.cnblogs.com/zhujiabin/p/7382500.html
- ViewPager撤消左右滑动切换功能
ViewPager取消左右滑动切换功能 最近做项目要求某种情况下ViewPager不能滑动,那么我们只需要重写这个方法就可以禁止ViewPager滑动 IndexViewPager.java: imp ...
- Android滑动切换页面Tab文字颜色发生渐变效果
Android项目中用到Tab作为导航条切换页面的效果,我相信大家都用到过吧,但是在切换的时候,Tab下划线跟着手指滑动的比例而滑动,相关的两个Tab的文字的颜色根据手指的滑动,而发生颜色渐变的改变. ...
- 手机版html页面左右滑动切换页面,移动端手指左右滑动切换内容demo
说在开头 最近移动端做了一个手指左右滑动切换内容的效果demo; 为了表示我的无私,决定分享给诸位:(详细代码见附件) 正文 先上html代码html> 穿衣助理 完成 整个页面ul部分是需要切 ...
- iOS开发------仿知乎上下滑动切换页面
放松的时候看看知乎,生活不解的时候问问知乎,这貌似已经成为了生活中的一种习惯,它独特翻页方式也是本人喜欢的一个原因,通过上划与下滑进行页面的翻页,不必返回再进入下一个页面,显得非常的简介并且人性化,这 ...
- 基于 vue +better scroll滑动切换页面 并支持下拉刷新案例
也是公司项目 ,内部app的资讯模块整改,改是不可能改的,之前还是用jquery.感觉越改越混乱,还是重做.就仿着今日头条.等资讯页面做了一个dome,话不多说,先看效果! 微信扫码预览 效果看完,感 ...
- Android——Fragment实例精讲——底部导航栏+ViewPager滑动切换页面
说明: 实现效果: 1- 用ViewPager实现Fragmen之间的切换 2- 底部用RadioGroup实现,更方便的实现图片和字体颜色的改变,更方便的通过RadioButton的点击事件来控制页 ...
- 微信小程序 左右滑动切换页面(炫酷效果)以及点赞特效
#效果图 gif放不上来..我就直接口述了..需要看具体效果戳GitHub>>>>>demo地址 首先左右滑动的时候整个页面会以动画效果切换(demo里是反转和水平淡出) ...
- android实现滑动切换图,Android:使用ViewPager实现左右滑动切换图片加点点
图片发自简书App 1.引入android-support-v4.jar包,在主布局里加入 < ?xml version="1.0" encoding="utf-8 ...
最新文章
- Android CoordinatorLayout使用
- spring整合springmvc和mybatis
- Leetcode--239. 滑动窗口最大值
- php格式化输出字_PHP 输出格式化字符串
- C语言为什么要尽量少用全局变量
- 深入理解 flex 布局以及计算_Flexbox, Layout
- sqlserver2010教程百度云盘_郝斌SqlServer2005自学全集视频教程
- 如何安装uclient_uclient软件
- oracle服务商前几名,oracle厂商服务有哪几种
- iPhone 11 PRO 820-01508-10, 820-01682-08手机点位图
- 宿舍管理系统简单的增删改查
- 高清视频录播服务器网站,高清录播服务器——DDA RSS3000
- JS 三级联动之 省市县。
- Idea,webStorm工具栏显示,添加快捷方式建文件
- node、express框架
- [ACNOI2022]猜数
- 响铃:吃鸡大战,垄断市场的焦虑和不安
- JAVA_GUI之“注册登陆界面”
- c语言中错误c2061,error C2061: 语法错误: 标识符“_Wherenode”
- python网站设计开题报告_网站毕业设计开题报告范文