今天写一个仿画廊效果的demo, 中间正常显示,要能看见两个的item, 缩小加透明度
那么我就想到了viewPager, 因为之前写过类似的项目,也没有记录, 今天就记录下
先看图
本来录个屏的,没想到上传不了MP4的,凑合用吧
先看布局
android:clipToPadding="false"
主要是这个,这个属性默认是true, 改成false是让控件绘制padding的区域, 这样距离两边的item就可以看见了
写完viewPager之后 我就在想recyclerView 能不能实现呢, 于是就准备试一试, 果然recyclerView是无所不能的...
下面来看看代码
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mViewPager = findViewById(R.id.viewPager);
mRecyclerView = findViewById(R.id.recyclerView);
initView();
}
private void initView() {
for (int i = 0; i < 6; i++) {
mData.add("这是第" + (i + 1) + "个");
}
initPagerAdapter();
initAdapter();
}
private void initPagerAdapter() {
if (mPagerAdapter == null) {
mPagerAdapter = new ViewPagerAdapter();
// 设置页面之间的边距
mViewPager.setPageMargin(dp2px(12));
// 设置缩放 透明度
mViewPager.setPageTransformer(false, new CustPagerTransformer());
}
//添加数据之后在设置适配器这样setPageTransformer会生效,否则两边的item没有透明的效果
mViewPager.setAdapter(mPagerAdapter);
mPagerAdapter.addData(mData);
mViewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
}
@Override
public void onPageSelected(int position) {
// 滑动之后处理逻辑
}
@Override
public void onPageScrollStateChanged(int state) {
}
});
}
代码上有注释,相信基本都能看明白了
有一点需要注意一下就是viewPager设置适配器 适配器添加数据,在添加数据的时候需要在设置一次适配器, 否则缩放透明效果不存在,或者顺序会混乱
下面是viewPager缩放的类
public class CustPagerTransformer implements ViewPager.PageTransformer {
private static final float MIN_SCALE = 0.8f;
private static final float MIN_ALPHA = 0.5f;
private static final float MAX_SCALE = 1.0f;
private static final float MAX_ALPHA = 1.0f;
@Override
public void transformPage(@NonNull View view, float position) {
if (position < -1) {
view.setScaleY(MIN_SCALE);
view.setAlpha(MIN_ALPHA);
} else if (position == 0) {
view.setScaleY(MAX_SCALE);
view.setAlpha(MAX_ALPHA);
} else if (position <= 1) {
float scaleFactor = MIN_SCALE + (1 - MIN_SCALE) * (1 - Math.abs(position));
float alphaFactor = MIN_ALPHA + (1 - MIN_ALPHA) * (1 - Math.abs(position));
view.setScaleY(scaleFactor);
view.setAlpha(alphaFactor);
} else {
view.setScaleY(MIN_SCALE);
view.setAlpha(MIN_ALPHA);
}
}
}
还有item布局
这就是viewPager的实现, 下面看看RecyclerView
private void initAdapter() {
if (mAdapter == null) {
mAdapter = new RecyclerViewAdapter();
mRecyclerView.setAdapter(mAdapter);
layoutManager = new LinearLayoutManager(this);
// 设置方向
layoutManager.setOrientation(RecyclerView.HORIZONTAL);
mRecyclerView.setLayoutManager(layoutManager);
// 让item居中显示
LinearSnapHelper snapHelper = new LinearSnapHelper();
// 绑定到 mRecyclerView
snapHelper.attachToRecyclerView(mRecyclerView);
}
mAdapter.addData(mData);
// 需要在添加数据时 再调用一次 不然会在滑动时才会显示效果
mRecyclerView.addOnScrollListener(new RecyclerView.OnScrollListener() {
@Override
public void onScrolled(@NonNull RecyclerView recyclerView, int dx, int dy) {
super.onScrolled(recyclerView, dx, dy);
final float MIN_SCALE = 0.85f;
final float MIN_ALPHA = 0.5f;
final float MAX_SCALE = 1.0f;
final float MAX_ALPHA = 1.0f;
int childCount = recyclerView.getChildCount();
for (int i = 0; i < childCount; i++) {
View child = recyclerView.getChildAt(i);
int left = child.getLeft();
int paddingStart = recyclerView.getPaddingStart();
// 遍历recyclerView子项,以中间项左侧偏移量为基准进行缩放
float bl = Math.min(1, Math.abs(left - paddingStart) * 1f / child.getWidth());
float scale = MAX_SCALE - bl * (MAX_SCALE - MIN_SCALE);
float alpha = MAX_ALPHA - bl * (MAX_ALPHA - MIN_ALPHA);
child.setScaleY(scale);
child.setAlpha(alpha);
}
}
});
}
RecyclerView添加滚动监听的时候 设置数据也要在调用一次, 不然会在滑动时才会显示效果
设置完这些 还有一个 RecyclerView没有设置间距 可以在布局设置 也可以用方法设置 我方便就在布局设置的
距离左右有一点间距, 自己掌握
RecyclerView适配器就没什么可说的了,都一样的
基本就是这些了
所以可见实现一种功能并不是只有一种方法, 其实我写了三种, 可能实现这个功能还有很多方法, 这里就先上两个, 如果有更好的方法请@我
地址:https://github.com/xiaobinAndroid421726260/Android_CustomAllCollection.git