TabLaout简单实现 (转载)
在2015年谷歌发布了一个新控件TabLayout,下面谈一谈他的简单使用的详细步骤,以及全代码
第一次写博客,写的不好请不要见笑!感谢您的支持。
先说步骤,再附源码。
TabLayout是Design包下面的一个常用部件,用它可以实现 Tablayout,Viewpager,Fragment的联动,完成非常好的效果。
使用步骤:
步骤1 :(熟练引包的通知可绕过此步骤) 因为该部件不在默认的包下,所以每次使用以前都要先导包 导包有两种方法,第一种在
添加
compile 'com.android.support:design:24.0.0'
dependencies { compile fileTree(dir: 'libs', include: ['*.jar']) testCompile 'junit:junit:4.12' compile 'com.android.support:appcompat-v7:23.4.0' compile files('libs/library-1.0.19.jar') 'com.android.support:design:24.0.0' compile 'com.android.support:recyclerview-v7:24.0.0' }
直接build完成就能使用了
第二种导包方式
点开
ok,然后会自动编译导包完成
步骤2:在xml文件创建
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" tools:context="com.****.test.MainActivity"> <android.support.design.widget.TabLayout android:id="@+id/tab_test" android:layout_width="match_parent" android:layout_height="40dp"> </android.support.design.widget.TabLayout> <android.support.v4.view.ViewPager android:id="@+id/vp_test" android:layout_width="match_parent" android:layout_height="match_parent"></android.support.v4.view.ViewPager> </LinearLayout>
Activity中
package com.****.test; import android.graphics.Color; import android.support.design.widget.TabLayout; import android.support.v4.app.Fragment; import android.support.v4.app.FragmentManager; import android.support.v4.view.ViewPager; import android.support.v7.app.AppCompatActivity; import android.os.Bundle; import java.util.ArrayList; import java.util.List; public class MainActivity extends AppCompatActivity { TabLayout tab_test; ViewPager vp_test; List<Fragment> fragments; FragmentManager manager; MyAdapter adapter; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); init(); //调用 } /* 初始化*/ private void init() { tab_test = (TabLayout) findViewById(R.id.tab_test); vp_test = (ViewPager) findViewById(R.id.vp_test); // new 一个Fragment的集合 fragments = new ArrayList<>(); // 给Fragment集合中添加子Fragment; fragments.add(new OneFragment()); fragments.add(new TwoFragment()); // 获取Fragment管理者 manager = getSupportFragmentManager(); // new 出Adapter adapter = new MyAdapter(manager, (ArrayList<Fragment>) fragments); // 给Viewpager设置adapter vp_test.setAdapter(adapter); // 实现联动 tab_test.setupWithViewPager(vp_test); // 设置tab标签上的文字 tab_test.getTabAt(0).setText("第一个栏目"); tab_test.getTabAt(1).setText("第二个栏目"); // 设置标签栏的图标 tab_test.getTabAt(0).setIcon(R.mipmap.ic_launcher); tab_test.getTabAt(1).setIcon(R.mipmap.ic_launcher); // 设置TabLayout文字的颜色(平常颜色,选中颜色) tab_test.setTabTextColors(Color.BLACK, Color.BLUE); // 设置TabLayout下划线 颜色 tab_test.setSelectedTabIndicatorColor(Color.BLUE); } }
tablayout填充满布局宽度, 默认设置是可以滑动
tab.setTabMode(TabLayout.MODE_SCROLLABLE);
控件设置下app:tabGravity="fill"这个属性
控件设置下app:tabGravity="fill"这个属性
MyAdapter
import android.support.v4.app.Fragment; import android.support.v4.app.FragmentManager; import android.support.v4.app.FragmentPagerAdapter; import java.util.ArrayList; /** * Created by hanhui on 16/6/29. * 这是一个可以多次复用的,实用的的工具类 * 可以作为所有TabLayout的Adapter */ public class MyAdapter extends FragmentPagerAdapter { ArrayList<Fragment> fragments; public MyAdapter(FragmentManager fm, ArrayList<Fragment> fragments) { super(fm); this.fragments = fragments; } @Override public Fragment getItem(int position) { return fragments.get(position); } @Override public int getCount() { return fragments.size(); } }
实现效果
这样接可以简单实现TabLayout,Viewpager,Fragment的联动,按照我的方法以及代码就实现了整个过程,是不是很简单有很实用呢
不过的列出的仅仅是最见到的功能更多功能有待大家去开发,感谢浏览本博客!