zoukankan      html  css  js  c++  java
  • Android ---------- TabLayout 实战 (一)

    1.效果图

    2.原理:TabLayout提供了一个水平的布局用来展示   Tabs

    3.添加依赖: compile 'com.android.support:design:27.+ ‘

      4.布局文件:

     

    <android.support.design.widget.TabLayout
    
    android:id="@+id/tablayout"
    
    android:layout_width="match_parent"
    
    android:layout_height="30dp"
    
    app:tabTextAppearance="@style/MyTabLayoutTextAppearanceInverse"   // 设置标签的字体大小  在style文件里进行设置
    
    app:tabIndicatorHeight="2dp"  // 设置便签下划线的高度(厚度)      不设置的话,默认大小就可以    设置为0dp就是不显示下划线
    
    app:tabIndicatorColor="#007aff" // 设置标签下划线的颜色
    
    app:tabSelectedTextColor="#007aff" // 设置选中标签的字体的颜色
    
    app:tabTextColor="@android:color/darker_gray" /> //设置未选中标签的字体的颜色
    
     
    
    <android.support.v4.view.ViewPager
    
         android:id="@+id/vpager"
    
       android:layout_width="match_parent"
    
       android:layout_height="200dp" />

     

    5.控制器部分代码:

    (一)

    class TabAdapter extends FragmentPagerAdapter {
    
        public TabAdapter(FragmentManager fm) {
            super(fm);
        }
    
        @Override
        public Fragment getItem(int position) {
            return fragments.get(position);
        }
    
        @Override
        public int getCount() {
            return fragments.size();
        }
        //显示标签上的文字
        @Override
        public CharSequence getPageTitle(int position) {
            return tabs.get(position);
        }
    }

    (二)

    
    
    public static class TabFrament extends Fragment {
            private Context context;
            private String content;
    
            public TabFrament() {
            }
    
            @SuppressLint("ValidFragment")
            public TabFrament(Context contexts, String content) {
                this.context = contexts;
                this.content = content;
            }
    
            @Nullable
            @Override
            public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
                 TextView textView = new TextView(context);   //此处用Textview举个例子,可以布置任意布局,自定义布局,用View view = inflater.inflate()方法
                 textView.setText(content);
                 textView.setTextSize(30);
                 textView.setGravity(Gravity.CENTER);
                 return textView;
    
            }
        }
    
    

    (三)

    
    
    private void initData() {
    
        for(Map<String,String> map:list) {      // 从服务器获取的数据,已经处理成list
            tabs.add(map.get("tab"));       // tab标签 
            fragments.add(new TabFrament(this,map.get("content"))); //viewpage 内容
        }
        tabLayout = (TabLayout) findViewById(R.id.tablayout);
    
        //设置TabLayout的模式
        tabLayout.setTabGravity(TabLayout.GRAVITY_CENTER);   //注:此条属性必须配合MODE_FIXED使用,不然不起作用
       //  GRAVITY_FILL  让每个标签平分TabLayout的全部宽度
    
        //  GRAVITY_CENTER  让每个标签显示自身宽度,然后所有标签居中显示
        tabLayout.setTabMode(TabLayout.MODE_SCROLLABLE);
      // MODE_FIXED  表示宽度始终是tablayout控件指定的宽度,如果标签过多,那么就无限挤压控件  
      // MODE_SCROLLABLE 表示每个标签都保持自身宽度,一旦标签过多,给标题栏提供支持横向滑动的功能
    
        TabAdapter tabadapter=new TabAdapter(getSupportFragmentManager());
        vpager.setAdapter(tabadapter);

    vpager.setOffscreenPageLimit(3);  // 设置viewpager缓存页面个数,建议:有 n 个tab就缓存 n-1 个页面

     //
    关联ViewPager和TabLayout

      tabLayout.setupWithViewPager(vpager);
        //设置分割线 标签之间的纵向分割线 
    LinearLayout linear = (LinearLayout)tabLayout.getChildAt(0);
    linear.setShowDividers(LinearLayout.SHOW_DIVIDER_MIDDLE);
    linear.setDividerDrawable(ContextCompat.getDrawable(
    this,R.drawable.divider));
    //设置分割线间隔
    linear.setDividerPadding(dip2px(15)); }   
    
    
              (四)
     public int dip2px(int dip) {
            float density = getResources().getDisplayMetrics().density;
            return (int) (dip * density + 0.5);
     }

    6.实践感悟

    (1) ViewPager 的含义是单独的一个页面,如果要设置此页面滚动的话,不可在ViewPager的外部而应该在子布局的外围设置srollview;把每一个ViewPager当成独立的页面就好了。

  • 相关阅读:
    我的知识库(4) java获取页面编码(Z)
    知识库(3)JAVA 正则表达式 (超详细)
    The Struts dispatcher cannot be found. This is usually caused by using Struts tags without the associated filter. Struts
    某人总结的《英语听力的技巧 》,挺搞的
    我的知识库(5)java单例模式详解
    构建可扩展程序
    SerialPort (RS232 Serial COM Port) in C# .NET
    Python学习笔记——String、Sequences
    UI题目我的答案
    jQuery学习系列学会操纵Form表单元素(1)
  • 原文地址:https://www.cnblogs.com/apeandcat/p/8567999.html
Copyright © 2011-2022 走看看