引导页添加炫酷动画

来源：互联网发布：仟游软件科技有限公司编辑：程序博客网时间：2024/05/01 01:43

1、相关知识点：

（1）FragmentActivity的v4兼容问题

（2）Fragment与Activity的通信问题

（3）ViewPager搭配Fragment使用

（4）ViewPager的动画交互

（5）布局的属性动画

2、FragmentActivity+ViewPager+Fragment+FragmentViewPagerAdapter

3、Fragment接受页面布局id作为参数

4、技术核心：ViewPager的transformPage(View view, float postion)来控制Fragment布局中ViewGroup及View Child的动画效果，从而实现缩放、旋转、透明度、平移。其中View Child通过平移动画实现视差动画效果。

5、核心思想：transformPage(View view, float postion)明确View指的是当前的整个Fragment，但是Fragment在添加到布局中的时候，系统会在外层加上Framelayout，所以获取View自布局内部参数的内容时需要注意通过View.findViewById()获取layout布局的内容，postion的范围指的是手势滑动导致的页面位置的范围（-1，1）非闭包。

6、Postion的范围：不滑动的时候当前页面的pos是0

7、核心代码:

package com.jx.studystartpager;import android.annotation.SuppressLint;import android.os.Bundle;import android.support.v4.app.FragmentActivity;import android.support.v4.view.PagerAdapter;import android.support.v4.view.ViewPager;import android.support.v4.view.ViewPager.PageTransformer;import android.util.Log;import android.view.View;import android.view.ViewGroup;import android.view.Window;import android.widget.FrameLayout;@SuppressLint("NewApi")public class StartActivity extends FragmentActivity {ViewPager viewPager;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);requestWindowFeature(Window.FEATURE_NO_TITLE);setContentView(R.layout.activity_main);viewPager = (ViewPager) findViewById(R.id.viewpager_startpages);PagerAdapter pagerAdapter = new FragmentViewPagerAdapter(getSupportFragmentManager());// 实现动画的回调方法viewPager.setPageTransformer(true, new PageTransformer() {@Overridepublic void transformPage(View view, float postion) {if (postion < 1 && postion > -1) {// 因为Fragment的外层系统被嵌套了一个FrameLayoutViewGroup viewGroup = (ViewGroup) view.findViewById(R.id.fl);// 获取ViewGroup内的全部子布局for (int i = 0; i < viewGroup.getChildCount(); ++i) {View child = viewGroup.getChildAt(i);// 因为postion位置（-1,1）设置一个放大效果的因素float factor = (float) (Math.random() * 2);// 因为每个子控件都会执行这个方法，所以factor的值是随时变化的，是页面动画出现抖动，//所以用Tag保持所有的View抖动同步if (child.getTag() == null) {child.setTag(factor);} else {factor = (float) child.getTag();}child.setTranslationX(-postion * factor * child.getWidth()/2);}}// 缩放 view.setScaleX(1-Math.abs(postion)); view.setScaleY(1- Math.abs(postion));// view.setScaleX(Math.max(0.9f, 1-Math.abs(postion)));// view.setScaleY(Math.max(0.9f, 1-Math.abs(postion)));// 3D旋转://view.setPivotX(postion < 0f ? view.getWidth() : 0f);//view.setRotationY(postion * 90f);}});viewPager.setAdapter(pagerAdapter);}}

1 0