Fragment+ViewPager+TabLayout

Fragment+ViewPager+TabLayout

TabLayout的介绍

Tablayout继承自HorizontalScrollView,用作页面切换指示器,因使用简便功能强大而广泛使用在App中。

TabLayout 是属于 com.android.support:design 包的控件,所以需要依赖该包
implementation ‘com.android.support:design:28.0.0’

布局文件

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity"
    android:orientation="vertical">
    <android.support.design.widget.TabLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        app:tabTextColor="#000"
        app:tabSelectedTextColor="#E5AF35"
        app:tabIndicatorColor="#E5AF35"
        app:tabMode="scrollable"
        android:id="@+id/tablelayout">
    </android.support.design.widget.TabLayout>

常用属性

app:tabBackground 标签布局的背景色
app:tabIndicatorColor 指示器的颜色
app:tabIndicatorHeight 指示器的高度(如果不需要指示器可以设置为0dp)
app:tabMode 显示模式:默认 fixed(固定),scrollable(可横向滚动)
app:tabPadding 标签内边距
app:tabSelectedTextColor 标签选中的文本颜色
app:tabTextAppearance 标签文本样式
app:tabTextColor 标签未选中的文本颜色

直接创建一个Fragment就行,其他的不需要动

java代码

import android.support.design.widget.TabLayout;
import android.support.v4.app.Fragment;
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 {
    private TabLayout tablelayout;
    private ViewPager viewPager;
    private List<Fragment>list=new ArrayList<>();//添加fragment的集合
    private List<String>titles=new ArrayList<>();//添加tableLayout 值的集合

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        tablelayout = findViewById(R.id.tablelayout);
        viewPager = findViewById(R.id.viewPager);

//添加fragment
        for (int i = 0; i < 5; i++) {
            list.add(new FirstFragment());
        }
        //添加tableLayout值
        titles.add("新闻");
        titles.add("资讯");
        titles.add("视频");
        titles.add("音乐");
        titles.add("图片");
        //适配器
        Adapter adapter = new Adapter(getSupportFragmentManager(), list, titles);
        viewPager.setAdapter(adapter);
        //把viewPager和tabLayout绑定在一起,注释掉看看效果.
        tablelayout.setupWithViewPager(viewPager);

    }
}

这个是适配器的代码

import android.support.annotation.Nullable;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentStatePagerAdapter;

import java.util.List;

public class Adapter extends FragmentStatePagerAdapter {
    private List<Fragment> list;
    private List<String> titles;

    public Adapter(FragmentManager fm, List<Fragment> list, List<String> titles) {
        super(fm);
        this.list = list;
        this.titles = titles;
    }

    @Override
    public Fragment getItem(int i) {
        return list.get(i);
    }

    @Override
    public int getCount() {
        return list.size();
    }

    @Nullable
    @Override
    public CharSequence getPageTitle(int position) {
        return titles.get(position);
    }
}

这个是上面代码的效果图
在这里插入图片描述

利用Banner实现轮播图

设置一个图片加载器

import android.content.Context;
import android.net.Uri;
import android.widget.ImageView;

import com.bumptech.glide.Glide;
import com.youth.banner.loader.ImageLoader;

public class GlideImageLoader extends ImageLoader {
    @Override
    public void displayImage(Context context, Object path, ImageView imageView) {
        Glide.with(context).load(path).into(imageView);//可以加载动图


        Uri uri = Uri.parse((String) path);
        imageView.setImageURI(uri);
    }

    @Override
    public ImageView createImageView(Context context) {
        return super.createImageView(context);
    }
}

activity中的代码

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;

import com.youth.banner.Banner;

import java.util.ArrayList;
import java.util.List;

public class Main2Activity extends AppCompatActivity {
    private Banner banner;
    private List<String> list;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main2);
        banner = findViewById(R.id.banner);
        banner.setImageLoader(new GlideImageLoader());
        list = new ArrayList<>();
        list.add("https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=1627134414,12749954&fm=111&gp=0.jpg");
        list.add("https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=3761644639,2834749362&fm=26&gp=0.jpg");
        banner.setImages(list);
        banner.start();

    }
}

具体可参考官方文档
https://github.com/youth5201314/banner

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值