Android Design:原生TabLayout+viewpaper+fragment实现滑动效果

1 类似于新闻app或者引用宝,先看效果图


2 简单实现

 * 需求:TabLayout的简单使用
 *  确定布局---找到控件--设置adapter--
 *  1 initView()--
 *  2 initAdapter
 *  3 initTablayout
 *  4 initViewpager*/


2-1 布局:注意V4,V7,Design包里面的属性是不主动提示的,要手敲或copy

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">
<!--要引用全路径+特有属性不提示,最好copy,title的大小不可设置,只能通过@style设置-->
    <android.support.design.widget.TabLayout
        android:id="@+id/tabLayout"
        android:layout_width="match_parent"
        android:layout_height="30dp"
        app:tabTextColor="#000000"			//tab的字体颜色
        app:tabSelectedTextColor="#ff00ff"		//选中的tab的字体颜色
        app:tabIndicatorColor="#ffff00">	//下划线的颜色
	app:tabTextAppearance="@style/MyTablayoutTextAppearance"//字体大小
    </android.support.design.widget.TabLayout>

    <android.support.v4.view.ViewPager
        android:id="@+id/viewpager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_below="@+id/tabLayout">
    </android.support.v4.view.ViewPager>
</RelativeLayout>
2-2 比较简单,不是重点

initView();
initData();
initAdapter();

2-3 设置TabLayout:添加Tab及设置mode

TabLayout.MODE_SCROLLABLE);//此模式与viewpaper常和viewpaper一起用。

private void initTabLayout() {
        tabLayout.setTabMode(TabLayout.MODE_FIXED);//官网解释fixed是个滑动
        tabLayout.addTab(tabLayout.newTab().setText(tabs.get(0)));/**注意创建TAB对象:tabLayout.newTab()*/
        tabLayout.addTab(tabLayout.newTab().setText(tabs.get(1)));
        tabLayout.addTab(tabLayout.newTab().setText(tabs.get(2)));
        tabLayout.addTab(tabLayout.newTab().setText(tabs.get(3)));
        tabLayout.addTab(tabLayout.newTab().setText(tabs.get(4)));
    }
2-4 将二者绑定;TabLayout+Viewpager

private void initViewPager() {
        /**注意这2行代码的顺序:viewpaper要先设置adapter,才可以让 tablayout绑定
         *  否则报错:viewpager没有setAdapter()*/
        viewPager.setAdapter(adapter);
        tabLayout.setupWithViewPager(viewPager);
        viewPager.setCurrentItem(0);
    }

源码地址:http://download.csdn.net/detail/ss1168805219/9422782   

点击打开链接




  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值