ViewPager中间大两边小效果的实现

效果图如下:


代码实现:

xml

    <android.support.v4.view.ViewPager
        android:id="@+id/mViewPager"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/title_bar"
        android:layout_centerInParent="true"
        android:clipChildren="false"
        android:visibility="gone" >

    </android.support.v4.view.ViewPager>

activity

RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams((int) (MyApp.width * 0.84),
(int) (MyApp.height - AndroidUtils.dp2px(this, 70)));


params.addRule(RelativeLayout.BELOW, R.id.title_bar);
params.addRule(RelativeLayout.CENTER_IN_PARENT);
params.setMargins((int) (MyApp.width * 0.08), AndroidUtils.dp2px(this, 20), 0, AndroidUtils.dp2px(this, 20));
mViewPager.setLayoutParams(params);

mViewPager.setPageTransformer(false, new DepthPageTransformer());

效果部分

@TargetApi(Build.VERSION_CODES.HONEYCOMB)
public class DepthPageTransformer implements PageTransformer {
private static final float MIN_SCALE = 0.8f;
private static final float MIN_ALPHA = 0.8f;


private static final float MAX_SCALE = 1.0f;
private static final float MAX_ALPHA = 1.0f;


@TargetApi(Build.VERSION_CODES.HONEYCOMB)
@SuppressLint("NewApi")
public void transformPage(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);
}
}
}

阅读更多
想对作者说点什么? 我来说一句

没有更多推荐了,返回首页

关闭
关闭
关闭