天天看點

Android 使用animator實作fragment的3D翻轉效果

今天老師留的作業,使用倆個Fragment來實作3D翻轉效果,遇到了一點點的問題,于是在網上進行了查找,但是發現有些部落客的代碼不正确,對其他人進行了誤導,在網上使用屬性動畫實作3D效果非常少,是以經過我自己的實驗摸索,我将自己的代碼和遇到的問題給他講解一下提供一點點借鑒,并且希望可以幫助到大家。

首先講解一下主要實作動畫的函數:

getFragmentManager().beginTransaction()
        .setCustomAnimations(R.animator.fragment_second_3d_reversal_enter,R.animator.fragment_second_3d_reversal_exit)
        .replace(R.id.container, new MainFragment()).commit();      

我想信這個函數大家在實作動畫時都會使用到,先獲得FragmentManager然後進行transaction,主要添加動畫的函數是setCustomAnimations(),在網上可以查到的解釋,對這個方法有些錯誤,描述的是目前的Fragment對象的進入和退出時的動畫效果,是這個對象的一種屬性,但是這個方法真正的解釋應該是在目前Activity在切換Fragment時所執行的動畫方式,也就是說目前Fragment退出時用的是方法中的退出動畫,新的Fragment進入時執行的是進入的動畫效果,可以了解為這一次動畫效果完全是利用這一個語句來完成,有些部落格的記載對我們産生了一些誤導。

官方的注釋如下:

/**
 * Set specific animation resources to run for the fragments that are
 * entering and exiting in this transaction. These animations will not be
 * played when popping the back stack.
 */
public abstract FragmentTransaction setCustomAnimations(int enter, int exit);      

整體的3d翻轉效果代碼如下:

第二個Fragment,

/**
 * Created by Liurs on 2016/6/14.
 **/
public class SecondFragment extends Fragment {

    private LinearLayout root;
    private Button mButton;

    public SecondFragment() {

    }

    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        root = (LinearLayout) inflater.inflate(R.layout.fragment_second, container, false);
        //Set listener;
        setListener();
        return root;
    }

    /**
     * set listener
     */
    private void setListener() {
        mButton = (Button) root.findViewById(R.id.button);
        mButton.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                getFragmentManager().beginTransaction()
                        .setCustomAnimations(R.animator.fragment_second_3d_reversal_enter,R.animator.fragment_second_3d_reversal_exit)
                        .replace(R.id.container, new MainFragment()).commit();
            }
        });
    }

    @Override
    public void onViewCreated(View view, Bundle savedInstanceState) {
        super.onViewCreated(view, savedInstanceState);

    }
}      

第一個Fragment,

/**
 * Created by Liurs on 2016/6/14.
 **/
public class MainFragment extends Fragment {

    private LinearLayout root;
    private Button mButton;

    public MainFragment() {

    }

    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        root = (LinearLayout) inflater.inflate(R.layout.content_main, container, false);
        //Set listener;
        setListener();

        return root;
    }

    /**
     * set listener
     */
    private void setListener() {
        mButton = (Button) root.findViewById(R.id.button);
        mButton.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                getFragmentManager()
                        .beginTransaction()
                        .addToBackStack(null)
                        .setCustomAnimations(R.animator.fragment_3d_reversal_enter,R.animator.fragment_3d_reversal_exit,R.animator.fragment_second_3d_reversal_enter,R.animator.fragment_second_3d_reversal_exit)
                        .replace(R.id.container, new SecondFragment())
                        .commit();
            }
        });
    }


    @Override
    public void onViewCreated(View view, Bundle savedInstanceState) {
        super.onViewCreated(view, savedInstanceState);

    }
}      

逆時針翻轉動畫進入時配置檔案,

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" android:ordering="sequentially">
    <objectAnimator
        android:duration="0"
        android:propertyName="rotationY"
        android:valueFrom="0f"
        android:valueTo="270f" />
    <objectAnimator
        android:duration="500"
        android:propertyName="rotationY"
        android:startOffset="500"
        android:valueFrom="270f"
        android:valueTo="360f" />
</set>      

退出時動畫配置檔案,

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" android:ordering="sequentially">
    <objectAnimator xmlns:android="http://schemas.android.com/apk/res/android"
        android:duration="500"
        android:propertyName="rotationY"
        android:valueFrom="0f"
        android:valueTo="90f">
        </objectAnimator>
</set>      

順時針翻轉動畫進入時配置檔案,

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:ordering="sequentially">
    <objectAnimator
        android:duration="0"
        android:propertyName="rotationY"
        android:valueFrom="180f"
        android:valueTo="90f" />
    <objectAnimator
        android:duration="500"
        android:propertyName="rotationY"
        android:startOffset="500"
        android:valueFrom="90f"
        android:valueTo="0f" />
</set>      

退出時動畫配置檔案,

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" android:ordering="sequentially">
    <objectAnimator xmlns:android="http://schemas.android.com/apk/res/android"
        android:duration="500"
        android:propertyName="rotationY"
        android:valueFrom="0f"
        android:valueTo="-90f">
    </objectAnimator>
</set>      

至此,兩個Fragment的3D翻轉切換已經完成,希望我的經驗可以幫助到你們