利用PageTransformer實現viewpager的視差效果變換和反轉特效
阿新 • • 發佈:2019-02-17
利用PageTransformer實現viewpager的幾種切換效果,適合做歡迎頁,程式碼比較簡單,但是效果還不錯,核心主要是PageTransformer的使用。
page在切換的時候會呼叫transformPage(View page, float position)方法,注意是多個page不停的呼叫這方法,引數page就是呼叫此方法的view,引數position就是這個view的位置資訊。0代表當前view,-1代表左邊的相鄰的view,1代表右面相鄰的view。在本專案中,我們只操作-1~1之間的view(也就是使用者可能會見的view)。
@Override public void transformPage(View page, float position) { if (position > -1 && position < 1) { initransforPage(page, position); } }
先看第一種效果
在page切換過程中加入放大縮小的動畫,根據position判斷page縮放的程度。
page.setScaleX(1-Math.abs(position));
page.setScaleY(1-Math.abs(position));
第二種效果
這種效果跟上面的效果類似,只不過添加了縮小的最小限度,最小設定成0.9f
page.setScaleX(Math.max(0.9f,1-Math.abs(position)));
page.setScaleY(Math.max(0.9f,1-Math.abs(position)));
第三種效果
利用翻轉動畫實現了page切換,根據position來確定setPivotX引數和反轉的角度
page.setPivotX(position<0f?page.getWidth():0f);
page.setPivotY(page.getHeight()*0.5f);
page.setRotationY(position*45);
第四種效果
同樣是反轉,只不過反過來了而已
第五種效果page.setPivotX(page.getWidth()*0.5f); page.setPivotY(page.getHeight()*0.5f); page.setRotationY(-position*45);
gif圖的關係效果不是很明顯,其實這是一種視差效果。根據position和view的寬度給page中每個子view賦予不同的偏移量,形成這種視差移動的效果。
ViewGroup v = (ViewGroup) page.findViewById(R.id.rl);
int childCount = v.getChildCount();
for (int i = 0; i < childCount; i++) {
View childView = v.getChildAt(i);
float factor = (float) Math.random();
if (childView.getTag() == null) {
childView.setTag(factor);
} else {
factor = (float) childView.getTag();
}
childView.setTranslationX(factor * childView.getWidth() * position);
}
break;
以上就是這幾種效果的全部核心程式碼,也可以根據自己需求組合變換。主要是拋磚引玉,哈哈哈。
下載連結:http://download.csdn.net/detail/liujiayut800/9885267