Android - Transição de Fragmento

O que é uma transição?

As transições de atividade e fragmento no Lollipop são criadas em cima de um recurso relativamente novo no Android chamado Transições. Introduzido no KitKat, a estrutura de transição fornece uma API conveniente para animação entre diferentes estados da IU em um aplicativo. A estrutura é construída em torno de dois conceitos principais: cenas e transições. Uma cena define um determinado estado da IU de um aplicativo, enquanto uma transição define a mudança animada entre duas cenas.

Quando uma cena muda, uma transição tem duas responsabilidades principais -

  • Capture o estado de cada visualização nas cenas inicial e final.
  • Crie um animador com base nas diferenças que animarão as vistas de uma cena para a outra.

Exemplo

Este exemplo irá explicar como criar sua animação personalizada com transição de fragmento. Então, vamos seguir as etapas a seguir para se assemelhar ao que seguimos durante a criação do Exemplo Hello World -

Degrau Descrição
1 Você usará o Android Studio para criar um aplicativo Android e nomeá-lo como fragmentcustomanimations em um pacote com.example.fragmentcustomanimations , com Activity em branco.
2 Modifique o activity_main.xml, que foi colocado em res / layout / activity_main.xml para adicionar uma Visualização de Texto
3 Crie um layout chamado fragment_stack.xml.xml no diretório res / layout para definir sua tag de fragmento e tag de botão
4 Crie uma pasta, que é colocada em res / e nomeie-a como animação e adicione fragment_slide_right_enter.xml fragment_slide_left_exit.xml, fragment_slide_right_exit.xml e fragment_slide_left_enter.xml
5 Em MainActivity.java, é necessário adicionar pilha de fragmentos, gerenciador de fragmentos e onCreateView ()
6 Execute o aplicativo para iniciar o emulador Android e verifique o resultado das alterações feitas no aplicativo.

a seguir estará o conteúdo de res.layout / activity_main.xml que continha 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" />

A seguir estará o conteúdo de res/animation/fragment_stack.xmlArquivo. continha layout de quadro e botão

<?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>

A seguir estará o conteúdo de res/animation/fragment_slide_left_enter.xmlArquivo. continha método definido e animador de objeto

<?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>

a seguir estará o conteúdo de res/animation/fragment_slide_left_exit.xml file.it continha tags de animador de conjunto e objeto.

<?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>

O código a seguir será o conteúdo de res/animation/fragment_slide_right_enter.xmlfile.it continha tags de animador de conjunto e objeto

<?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>

o código a seguir será o conteúdo de res/animation/fragment_slide_right_exit.xmlarquivo, ele continha tags de animador de conjunto e objeto

<?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>

o código a seguir será o conteúdo de src/main/java/MainActivity.javaArquivo. continha ouvinte de botão, fragmento de pilha e 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;
      }
   }
}

a seguir estará o conteúdo de 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>

Executando o aplicativo

Vamos tentar executar nosso Fragment Transitionsaplicativo que acabamos de criar. Suponho que você tenha criado o seuAVDao fazer a configuração do ambiente. Para executar o aplicativo no Android Studio, abra um dos arquivos de atividade do seu projeto e clique no ícone Executar na barra de ferramentas. O Android instala o aplicativo em seu AVD e o inicia e se tudo estiver bem com sua configuração e aplicativo, ele exibirá a seguinte janela do emulador:

Se clicar no novo fragmento, ele será alterado do primeiro fragmento para o segundo fragmento como mostrado abaixo