Viewpager2+Fragment+指示器

Viewpager2+Fragment+指示器

  • 效果展示:
  1. MainActivity.java
java 复制代码
package com.huawei.myviewpager;

import androidx.appcompat.app.AppCompatActivity;
import androidx.fragment.app.Fragment;
import androidx.viewpager2.widget.ViewPager2;

import android.os.Bundle;
import android.view.View;
import android.widget.LinearLayout;

import com.huawei.myviewpager.adapter.MyFragmentPagerAdapter;
import com.huawei.myviewpager.fragment.FirstFragment;
import com.huawei.myviewpager.fragment.SecondFragment;
import com.huawei.myviewpager.fragment.ThirdFragment;

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

public class MainActivity extends AppCompatActivity {

    private MyFragmentPagerAdapter mAdapter;

    private ViewPager2 mViewpager;
    private List<Fragment> mList;

    private LinearLayout mPointIndicator;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        mList = new ArrayList<>();
        mList.add(new FirstFragment());
        mList.add(new SecondFragment());
        mList.add(new ThirdFragment());
        mAdapter = new MyFragmentPagerAdapter(this, mList);
        initView();

    }

    private void initView() {
        mViewpager = findViewById(R.id.vp2);
        mViewpager.setAdapter(mAdapter);
        mPointIndicator = findViewById(R.id.fragment_indicator);
        insertPoint();
        mViewpager.registerOnPageChangeCallback(new ViewPager2.OnPageChangeCallback() {
            @Override
            public void onPageSelected(int position) {
                int realPosition;
                if (position != 0) {
                    realPosition = position % 3;
                } else {
                    realPosition = 0;
                }
                setSelectPoint(realPosition);
            }
        });
    }

    private void insertPoint() {
        for (int i = 0; i < 3; i++) {
            View point = new View(MainActivity.this);
            LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(40, 40);
            layoutParams.topMargin = 20;
            if (i == 0) {
                point.setBackground(getResources().getDrawable(R.drawable.indicator_point_selected));
            } else {
                point.setBackground(getResources().getDrawable(R.drawable.indicator_point_unselected));
            }
            point.setLayoutParams(layoutParams);
            mPointIndicator.addView(point);
        }
    }

    private void setSelectPoint(int realPosition) {
        for (int i = 0; i < mPointIndicator.getChildCount(); i++) {
            View point = mPointIndicator.getChildAt(i);
            if (i == realPosition) {
                point.setBackgroundResource(R.drawable.indicator_point_selected);
            } else {
                point.setBackgroundResource(R.drawable.indicator_point_unselected);
            }
        }
    }
}
  1. activity_main.xml
xml 复制代码
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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">

    <androidx.viewpager2.widget.ViewPager2
        android:id="@+id/vp2"
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

    <LinearLayout
        android:id="@+id/fragment_indicator"
        android:layout_width="40dp"
        android:layout_height="100dp"
        android:layout_alignParentEnd="true"
        android:layout_marginEnd="32dp"
        android:layout_marginTop="80dp"
        android:gravity="center"
        android:orientation="vertical" />

</RelativeLayout>
  1. MyFragmentPagerAdapter
java 复制代码
package com.huawei.myviewpager.adapter;

import java.util.List;

import androidx.annotation.NonNull;
import androidx.fragment.app.Fragment;
import androidx.fragment.app.FragmentActivity;
import androidx.viewpager2.adapter.FragmentStateAdapter;

public class MyFragmentPagerAdapter extends FragmentStateAdapter {

    private List<Fragment> mList;

    public MyFragmentPagerAdapter(@NonNull FragmentActivity fragmentActivity, List<Fragment> list) {
        super(fragmentActivity);
        mList = list;
    }

    @NonNull
    @Override
    public Fragment createFragment(int position) {
        Fragment fragment = mList.get(position);
        return fragment;
    }

    @Override
    public int getItemCount() {
        return mList.size();
    }
}
  1. FirstFragment.java
java 复制代码
public class FirstFragment extends Fragment {

    @Nullable
    @Override
    public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        return inflater.inflate(R.layout.fragment_first, container, false);
    }
}
  1. fragment_first.xml,三个fragment相同布局
xml 复制代码
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <ImageView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:scaleType="fitXY"
        android:src="@drawable/img9" />
</RelativeLayout>
  1. indicator_point_selected.xml 指示器选中shape
xml 复制代码
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <corners android:radius="250dp" />
    <solid android:color="#FF000000" />
    <stroke android:color="#FF000000" />
</shape>
  1. indicator_point_unselected.xml 指示器未选中shape
xml 复制代码
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <corners android:radius="250dp" />
    <solid android:color="#FFFFFFFF" />
    <stroke
        android:width="1dp"
        android:color="#FF000000" />
</shape
://schemas.android.com/apk/res/android">
    <corners android:radius="250dp" />
    <solid android:color="#FFFFFFFF" />
    <stroke
        android:width="1dp"
        android:color="#FF000000" />
</shape
相关推荐
千里马学框架4 天前
一起学 Android 14:ShellTransition 屏幕旋转过程深度剖析
android·智能手机·性能优化·framework·性能·屏幕旋转·rotation
美狐美颜SDK开放平台4 天前
开发直播APP时如何接入视频美颜SDK?开发流程与注意事项
android·人工智能·计算机视觉·音视频·直播美颜sdk
AFinalStone4 天前
Android7 SystemUI源码解析(七)Keyguard锁屏模块深度解析
android·systemui
致远ccc4 天前
Google Play 上架前如何测试 App?多国家 Android 环境测试
android·app测试·googleplay·多国家应用测试
ttyyttemo4 天前
Kotlin 协程中的 Job 结构化并发与取消
android
sun0077004 天前
tbox 4g/5g切换,导致wan ip 改变,导致车机旧网络不可用。需要重启车机才行
android
其实防守也摸鱼4 天前
内网穿透与反向代理:原理、工具与实战指南
android·大数据·运维·安全·网络安全·自动化·渗透
AFinalStone5 天前
Android7 SystemUI 源码解析(四)NavigationBar 导航栏与 SystemBars
android·systemui
JMchen5 天前
属性动画原理与高级动画实现
android·kotlin·canvas
AFinalStone5 天前
Android7 SystemUI 源码解析(二)启动流程深度解析
android·systemui