Android 自定义轮播效果，flutter 开发环境

android:clipChildren="false" //不能少

tools:context=".MainActivity">

<androidx.viewpager.widget.ViewPager

android:id="@+id/vp_my_viewpager"

android:layout_width="match_parent"

android:layout_height="200dp"

android:layout_marginLeft="80dp" //写这个属性的目的是 不能让单个 ViewPager 项占满整个横屏

android:layout_marginRight="80dp"

android:clipChildren="false" //不能少

/>

</LinearLayout>

第二步：写 java 代码

package com.wust.myhorizontalscrollview;

import androidx.annotation.NonNull;

import androidx.appcompat.app.AppCompatActivity;

import androidx.viewpager.widget.PagerAdapter;

import androidx.viewpager.widget.ViewPager;

import android.os.Bundle;

import android.os.Handler;

import android.os.Message;

import android.view.View;

import android.view.ViewGroup;

import android.view.animation.AccelerateInterpolator;

import android.widget.ImageView;

import java.lang.reflect.Field;

import java.util.ArrayList;

import java.util.List;

public class MainActivity extends AppCompatActivity {

private ViewPager vp_my_viewpager;

private List<Integer> imgList;

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

//准备图片资源

imgList = new ArrayList<>();

imgList.add(R.drawable.test);

imgList.add(R.drawable.test2);

imgList.add(R.drawable.test);

imgList.add(R.drawable.test2);

imgList.add(R.draw

《Android学习笔记总结+最新移动架构视频+大厂安卓面试真题+项目实战源码讲义》
浏览器打开：qq.cn.hn/FTe 免费领取

able.test);

//第一步：找到 ViewPager 这个控件

vp_my_viewpager = findViewById(R.id.vp_my_viewpager);

//第二步：设置 ViewPager 的一些属性

// 这个属性的目的 是设置 预加载 3 张 防止 滚动时出现断层

vp_my_viewpager.setOffscreenPageLimit(3);

// 这个属性的目的 是设置 每个 Item 之间的距离间隔

vp_my_viewpager.setPageMargin(10);

//第三步：设置适配器

vp_my_viewpager.setAdapter(new myPagerAdapter());

}

private class myPagerAdapter extends PagerAdapter {

@Override

public int getCount() {

return imgList.size();

}

@Override

public boolean isViewFromObject(@NonNull View view, @NonNull Object object) {

return view == object;

}

@NonNull

@Override

public Object instantiateItem(@NonNull ViewGroup container, int position) {

ImageView iv = new ImageView(getApplicationContext());

iv.setImageResource(imgList.get(position));

container.addView(iv);

return iv;

}

@Override

public void destroyItem(@NonNull ViewGroup container, int position, @NonNull Object object) {

container.removeView((View) object);

}

}

}

写到这里，基本的效果已经出来了

如果想要更酷炫的效果，那我们的主角得登场了?PagerTransformer

第三步：灵活使用?PagerTransformer

transformPage(@NonNull View page, float position)

#参数一： 视图

#参数二： 参数一视图对应的位置变化

经过上面的分析，我们可知我们最关心的是 屏幕显示项 + 屏幕显示项两侧布局 的动画效果，他们的 position 变化我们也通过图解描述的很清楚

package com.wust.myhorizontalscrollview;

import androidx.annotation.NonNull;

import androidx.appcompat.app.AppCompatActivity;

import androidx.viewpager.widget.PagerAdapter;

import androidx.viewpager.widget.ViewPager;

import android.os.Bundle;

import android.os.Handler;

import android.os.Message;

import android.view.View;

import android.view.ViewGroup;

import android.view.animation.AccelerateInterpolator;

import android.widget.ImageView;

import java.lang.reflect.Field;

import java.util.ArrayList;

import java.util.List;

public class MainActivity extends AppCompatActivity {

private ViewPager vp_my_viewpager;

private List<Integer> imgList;

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

//准备图片资源

imgList = new ArrayList<>();

imgList.add(R.drawable.test);

imgList.add(R.drawable.test2);

imgList.add(R.drawable.test);

imgList.add(R.drawable.test2);

imgList.add(R.drawable.test);

//第一步：找到 ViewPager 这个控件

vp_my_viewpager = findViewById(R.id.vp_my_viewpager);

//第二步：设置 ViewPager 的一些属性

// 这个属性的目的 是设置 预加载 3 张 防止 滚动时出现断层

vp_my_viewpager.setOffscreenPageLimit(3);

// 这个属性的目的 是设置 每个 Item 之间的距离间隔

vp_my_viewpager.setPageMargin(0);

//第三步：设置适配器

vp_my_viewpager.setAdapter(new myPagerAdapter());

//第四步：设置 PagerTransformer

vp_my_viewpager.setPageTransformer(false,new myPagerTransformer());

}

private class myPagerAdapter extends PagerAdapter {

@Override

public int getCount() {

return imgList.size();

}

@Override

public boolean isViewFromObject(@NonNull View view, @NonNull Object object) {

return view == object;

}

@NonNull

@Override

public Object instantiateItem(@NonNull ViewGroup container, int position) {

ImageView iv = new ImageView(getApplicationContext());

iv.setImageResource(imgList.get(position));

container.addView(iv);

return iv;

}

@Override

public void destroyItem(@NonNull ViewGroup container, int position, @NonNull Object object) {

container.removeView((View) object);

}

}

private class myPagerTransformer implements ViewPager.PageTransformer {

@Override

public void transformPage(@NonNull View page, float position) {

if (position < -1 || position > 1){