Android-フラグメントの移行

移行とは何ですか？

Lollipopのアクティビティとフラグメントのトランジションは、トランジションと呼ばれるAndroidの比較的新しい機能の上に構築されています。 KitKatで導入された移行フレームワークは、アプリケーション内の異なるUI状態をアニメーション化するための便利なAPIを提供します。このフレームワークは、シーンとトランジションという2つの重要な概念に基づいて構築されています。シーンはアプリケーションのUIの特定の状態を定義し、トランジションは2つのシーン間のアニメーション化された変更を定義します。

シーンが変化すると、トランジションには2つの主な責任があります-

開始シーンと終了シーンの両方で各ビューの状態をキャプチャします。
あるシーンから別のシーンへのビューをアニメーション化する違いに基づいて、アニメーターを作成します。

例

この例では、フラグメント遷移を使用してカスタムアニメーションを作成する方法を説明します。それでは、Hello World Exampleの作成中に行った手順と同様に、次の手順に従ってみましょう-

Step	Description
1	You will use Android Studio to create an Android application and name it as fragmentcustomanimations under a package com.example.fragmentcustomanimations, with blank Activity.
2	Modify the activity_main.xml, which has placed at res/layout/activity_main.xml to add a Text View
3	Create a layout called fragment_stack.xml.xml under the directory res/layout to define your fragment tag and button tag
4	Create a folder, which is placed at res/ and name it as animation and add fragment_slide_right_enter.xml fragment_slide_left_exit.xml, ,fragment_slide_right_exit.xml and fragment_slide_left_enter.xml
5	In MainActivity.java, need to add fragment stack, fragment manager, and onCreateView()
6	Run the application to launch Android emulator and verify the result of the changes done in the application.

以下は_res.layout/activity_main.xml_のコンテンツになり、TextViewが含まれます。

<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
   android:id="@+id/text"
   android:layout_width="match_parent"
   android:layout_height="match_parent"
   android:gravity="center_vertical|center_horizontal"
   android:text="@string/hello_world"
   android:textAppearance="?android:attr/textAppearanceMedium"/>

以下は res/animation/fragment_stack.xml ファイルの内容です。フレームレイアウトとボタンが含まれていた

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
   xmlns:android="http://schemas.android.com/apk/res/android"
   android:layout_width="match_parent"
   android:layout_height="match_parent"
   android:orientation="vertical" >

   <fragment
      android:id="@+id/fragment1"
      android:name="com.pavan.listfragmentdemo.MyListFragment"
      android:layout_width="match_parent"
      android:layout_height="match_parent"/>

</LinearLayout>

以下は res/animation/fragment_slide_left_enter.xml ファイルの内容です。 setメソッドとオブジェクトアニメーターが含まれていた

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
   <objectAnimator
      android:interpolator="@android:interpolator/decelerate_quint"
      android:valueFrom="100dp" android:valueTo="0dp"
      android:valueType="floatType"
      android:propertyName="translationX"
      android:duration="@android:integer/config_mediumAnimTime"/>

   <objectAnimator
      android:interpolator="@android:interpolator/decelerate_quint"
      android:valueFrom="0.0" android:valueTo="1.0"
      android:valueType="floatType"
      android:propertyName="alpha"
      android:duration="@android:integer/config_mediumAnimTime"/>
</set>

以下は、 res/animation/fragment_slide_left_exit.xml file.itのコンテンツであり、セットおよびオブジェクトアニメータータグが含まれています。

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
   <objectAnimator
      android:interpolator="@android:interpolator/decelerate_quint"
      android:valueFrom="0dp" android:valueTo="-100dp"
      android:valueType="floatType"
      android:propertyName="translationX"
      android:duration="@android:integer/config_mediumAnimTime"/>

   <objectAnimator
      android:interpolator="@android:interpolator/decelerate_quint"
      android:valueFrom="1.0" android:valueTo="0.0"
      android:valueType="floatType"
      android:propertyName="alpha"
      android:duration="@android:integer/config_mediumAnimTime"/>
</set>

次のコードは、* res/animation/fragment_slide_right_enter.xml * file.itのコンテンツであり、セットおよびオブジェクトアニメータータグが含まれています。

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
   <objectAnimator
      android:interpolator="@android:interpolator/decelerate_quint"
      android:valueFrom="-100dp" android:valueTo="0dp"
      android:valueType="floatType"
      android:propertyName="translationX"
      android:duration="@android:integer/config_mediumAnimTime"/>

   <objectAnimator
      android:interpolator="@android:interpolator/decelerate_quint"
      android:valueFrom="0.0" android:valueTo="1.0"
      android:valueType="floatType"
      android:propertyName="alpha"
      android:duration="@android:integer/config_mediumAnimTime"/>
</set>

次のコードは* res/animation/fragment_slide_right_exit.xml * fileのコンテンツになり、セットおよびオブジェクトアニメータータグが含まれます

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
   <objectAnimator
      android:interpolator="@android:interpolator/decelerate_quint"
      android:valueFrom="0dp" android:valueTo="100dp"
      android:valueType="floatType"
      android:propertyName="translationX"
      android:duration="@android:integer/config_mediumAnimTime"/>

   <objectAnimator
      android:interpolator="@android:interpolator/decelerate_quint"
      android:valueFrom="1.0" android:valueTo="0.0"
      android:valueType="floatType"
      android:propertyName="alpha"
      android:duration="@android:integer/config_mediumAnimTime"/>
</set>

次のコードは src/main/java/MainActivity.java ファイルのコンテンツになります。ボタンリスナー、スタックフラグメント、onCreateViewが含まれていた

package com.example.fragmentcustomanimations;

import android.app.Activity;
import android.app.Fragment;
import android.app.FragmentTransaction;
import android.os.Bundle;

import android.view.LayoutInflater;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.ViewGroup;

import android.widget.Button;
import android.widget.TextView;

/**
 *Demonstrates the use of custom animations in a FragmentTransaction when
* pushing and popping a stack.
 */
public class FragmentCustomAnimations extends Activity {
   int mStackLevel = 1;

   @Override
   protected void onCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      setContentView(R.layout.fragment_stack);

     //Watch for button clicks.
      Button button = (Button)findViewById(R.id.new_fragment);

      button.setOnClickListener(new OnClickListener() {
         public void onClick(View v) {
            addFragmentToStack();
         }
      });

      if (savedInstanceState == null) {
        //Do first time initialization -- add initial fragment.
         Fragment newFragment = CountingFragment.newInstance(mStackLevel);
         FragmentTransaction ft = getFragmentManager().beginTransaction();
         ft.add(R.id.simple_fragment, newFragment).commit();
      }
      else
      {
         mStackLevel = savedInstanceState.getInt("level");
      }
   }

   @Override
   public void onSaveInstanceState(Bundle outState) {
      super.onSaveInstanceState(outState);
      outState.putInt("level", mStackLevel);
   }

   void addFragmentToStack() {
      mStackLevel++;

     //Instantiate a new fragment.
      Fragment newFragment = CountingFragment.newInstance(mStackLevel);

     //Add the fragment to the activity, pushing this transaction
     //on to the back stack.
      FragmentTransaction ft = getFragmentManager().beginTransaction();
      ft.setCustomAnimations(R.animator.fragment_slide_left_enter,
      R.animator.fragment_slide_left_exit,
      R.animator.fragment_slide_right_enter,
      R.animator.fragment_slide_right_exit);
      ft.replace(R.id.simple_fragment, newFragment);
      ft.addToBackStack(null);
      ft.commit();
   }

   public static class CountingFragment extends Fragment {
      int mNum;
     /**
 *Create a new instance of CountingFragment, providing "num"
     * as an argument.
      */
      static CountingFragment newInstance(int num) {
         CountingFragment f = new CountingFragment();

        //Supply num input as an argument.
         Bundle args = new Bundle();
         args.putInt("num", num);
         f.setArguments(args);
         return f;
      }

     /**
 *When creating, retrieve this instance's number from its arguments.
     */

      @Override
      public void onCreate(Bundle savedInstanceState) {
         super.onCreate(savedInstanceState);
         mNum = getArguments() != null ? getArguments().getInt("num") : 1;
      }
     /**
 *The Fragment's UI is just a simple text view showing its
     * instance number.
      */

      @Override
      public View onCreateView(LayoutInflater inflater,
         ViewGroup container,Bundle savedInstanceState) {
         View v = inflater.inflate(R.layout.hello_world, container, false);
         View tv = v.findViewById(R.id.text);
         ((TextView)tv).setText("Fragment #" + mNum);
         tv.setBackgroundDrawable(getResources().
            getDrawable(android.R.drawable.gallery_thumb));
         return v;
      }
   }
}

以下は AndroidManifest.xml のコンテンツになります

<?xml version="1.0" encoding="utf-8"?>
   <manifest xmlns:android="http://schemas.android.com/apk/res/android"
   package="com.example.fragmentcustomanimations"
   android:versionCode="1"
   android:versionName="1.0" >

   <application
      android:allowBackup="true"
      android:icon="@drawable/ic_launcher"
      android:label="@string/app_name"
      android:theme="@style/AppTheme" >

      <activity
         android:name="com.example.fragmentcustomanimations.MainActivity"
         android:label="@string/app_name" >

         <intent-filter>
            <action android:name="android.intent.action.MAIN"/>
            <category android:name="android.intent.category.LAUNCHER"/>
         </intent-filter>

      </activity>

   </application>
</manifest>

アプリケーションを実行する

作成した Fragment Transitions アプリケーションを実行してみましょう。環境のセットアップ中に AVD を作成したと思います。 Android Studioからアプリを実行するには、プロジェクトのアクティビティファイルの1つを開き、ツールバーの[画像を実行：/android/images/eclipse_run.jpg [Eclipse Run Icon]アイコンをクリックします。 AndroidはアプリをAVDにインストールして起動し、セットアップとアプリケーションで問題がなければ、次のエミュレータウィンドウが表示されます。

Androidフラグメントトランジット

新しいフラグメントをクリックすると、以下に示すように、最初のフラグメントが2番目のフラグメントに変更されます

2番目のフラグメント

Android-fragment-transitions

目次

Android-フラグメントの移行

移行とは何ですか？

例

アプリケーションを実行する