Android ViewPager 实现滑动效果

效果图:

图1:

在这里插入图片描述

图2:

在这里插入图片描述

图3:

在这里插入图片描述

activity_main.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"
android:orientation="horizontal"
tools:context=".MainActivity">

    <android.support.v4.view.ViewPager
        android:id="@+id/viewpager"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
    </android.support.v4.view.ViewPager>

</RelativeLayout>

ly_one.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">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="界面一"
        android:textColor="#000"
        android:textSize="50dp"
        android:layout_centerInParent="true"/>

</RelativeLayout>

ly_two.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">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="界面二"
        android:textColor="#000"
        android:textSize="50dp"
        android:layout_centerInParent="true"/>

</RelativeLayout>

ly_three.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">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="界面一"
        android:textColor="#000"
        android:textSize="50dp"
        android:layout_centerInParent="true"/>

</RelativeLayout>

MyPagerAdapter.java:

public class MyPagerAdapter extends PagerAdapter {
    private ArrayList<View> pageList = null;        /// 接收构造方法中传来的view

    public MyPagerAdapter(ArrayList<View> pageList) {
        this.pageList = pageList;
    }

    @Override
    public int getCount() {
        return pageList.size();     //  返回 view 列表的大小,即 view 的数目
    }

    @Override
    public boolean isViewFromObject(@NonNull View view, @NonNull Object object) {
        return view == object;  //  返回当前显示的 view 是否与列表中的对象一致
    }

    @NonNull
    @Override
    public Object instantiateItem(@NonNull ViewGroup container, int position) {
        View pageView = pageList.get(position); //  获取当前位置的 view
        container.addView(pageView);        //  设置当前 view 为显示对象
        return pageView;
    }

    @Override
    public void destroyItem(@NonNull ViewGroup container, int position, @NonNull Object object) {
        container.removeView(pageList.get(position));       //移除当前位置的额view
    }
}

MainActivity.java:

public class MainActivity extends AppCompatActivity  {
    private ViewPager viewPager;
    private View lyOne,lyTwo,lyThree;
    private ArrayList<View> viewArrayList = null;
    private MyPagerAdapter adapter = null;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        viewPager = findViewById(R.id.viewpager);
        /**
         *      获取三个布局文件,生成 View 对象
         */
        LayoutInflater inflater = getLayoutInflater();
        lyOne = inflater.inflate(R.layout.ly_one,null);
        lyTwo = inflater.inflate(R.layout.ly_two,null);
        lyThree = inflater.inflate(R.layout.ly_three,null);

        viewArrayList = new ArrayList<>();  //存储类型为 View
        viewArrayList.add(lyOne);           // 将每一个 view 对象添加到集合中
        viewArrayList.add(lyTwo);
        viewArrayList.add(lyThree);

        //  让 PagerAdapter 梳理一下这些 view界面 的数据源,将 viewArrayList 集合传入
        adapter = new MyPagerAdapter(viewArrayList);

        //  最后给 viewPager 设置数据源
        viewPager.setAdapter(adapter);
    }

}

点击运行即可!~

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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

王睿丶

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值