As transições de atividades em aplicativos com Material Design fornecem conexões visuais entre estados diferentes por meio de movimentos e transformações entre elementos comuns. Você pode especificar animações personalizadas para transições de entrada e saída e para as transições de elementos compartilhados entre as atividades.
- Uma transição de entrada determina como as visualizações em uma atividade
entrar em cena. Por exemplo, na transição de entrada
explode
, a que as vistas entram na cena de fora e voam para dentro, em direção ao centro da tela. - Uma transição de saída determina como as visualizações em uma atividade saem
na cena. Por exemplo, na transição de saída
explode
, as visualizações para sair de cena longe do centro. - Uma transição de elementos compartilhados determina como as visualizações que são
compartilhadas entre duas atividades
fazem uma transição entre essas atividades. Por exemplo:
se duas atividades têm a mesma imagem em posições e tamanhos diferentes, a
A transição de elemento compartilhado do
changeImageTransform
traduz e dimensiona a imagem suavemente entre essas atividades.
O Android é compatível com estas transições de entrada e saída:
explode
: move as visualizações para dentro ou para fora partindo do centro da cena.slide
: move as visualizações para dentro ou para fora de uma das bordas do cenafade
: adiciona ou remove uma visualização de uma cena mudando a opacidade.
Qualquer transição que estenda a classe Visibility
é suportada como uma transição de entrada ou de saída.
Para obter mais informações, consulte a referência de API para a
Transition
.
O Android também é compatível com estas transições de elementos compartilhados:
changeBounds
: anima as mudanças nos limites do layout do destino. visualizações.changeClipBounds
: anima as mudanças nos limites de corte do destino. visualizações.changeTransform
: anima as mudanças de escala e rotação do visualizações desejadas.changeImageTransform
: anima as mudanças de tamanho e escala do imagens de destino.
Quando você ativa as transições de atividades no app, o esmaecimento cruzado padrão é ativada entre as atividades de entrada e saída.
Para ver um exemplo de código que executa a animação entre atividades usando elementos compartilhados, consulte ActivitySceneTransitionBasic:
Verificar a versão do sistema
As APIs de transição de atividade estão disponíveis no Android 5.0 (API 21) e versões posteriores. Para preservar a compatibilidade com versões anteriores do Android, confira o
version
do sistema durante a execução
invoquem as APIs para qualquer um destes recursos:
Kotlin
// Check if we're running on Android 5.0 or higher if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) { // Apply activity transition } else { // Swap without transition }
Java
// Check if we're running on Android 5.0 or higher if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) { // Apply activity transition } else { // Swap without transition }
Especificar transições personalizadas
Primeiro, ative as transições de conteúdo da janela com o android:windowActivityTransitions
ao definir um estilo herdado do tema do Material Design. Também é possível especificar
transições de entrada, saída e elemento compartilhado na definição de estilo:
<style name="BaseAppTheme" parent="android:Theme.Material"> <!-- enable window content transitions --> <item name="android:windowActivityTransitions">true</item> <!-- specify enter and exit transitions --> <item name="android:windowEnterTransition">@transition/explode</item> <item name="android:windowExitTransition">@transition/explode</item> <!-- specify shared element transitions --> <item name="android:windowSharedElementEnterTransition"> @transition/change_image_transform</item> <item name="android:windowSharedElementExitTransition"> @transition/change_image_transform</item> </style>
A transição change_image_transform
desse exemplo é definida da seguinte maneira:
<!-- res/transition/change_image_transform.xml --> <!-- (see also Shared Transitions below) --> <transitionSet xmlns:android="http://schemas.android.com/apk/res/android"> <changeImageTransform/> </transitionSet>
O elemento changeImageTransform
corresponde ao
ChangeImageTransform
. Para mais informações, consulte a documentação
referência para Transition
.
Para ativar transições de conteúdo da janela no código, chame o método
Função Window.requestFeature()
:
Kotlin
// Inside your activity (if you did not enable transitions in your theme) with(window) { requestFeature(Window.FEATURE_ACTIVITY_TRANSITIONS) // Set an exit transition exitTransition = Explode() }
Java
// Inside your activity (if you did not enable transitions in your theme) getWindow().requestFeature(Window.FEATURE_ACTIVITY_TRANSITIONS); // Set an exit transition getWindow().setExitTransition(new Explode());
Para especificar transições no código, chame essas funções com uma
Objeto Transition
:
Window.setEnterTransition()
Window.setExitTransition()
Window.setSharedElementEnterTransition()
Window.setSharedElementExitTransition()
Os métodos setExitTransition()
e
As funções setSharedElementExitTransition()
definem o valor
para a atividade de chamada. Os métodos setEnterTransition()
e
As funções setSharedElementEnterTransition()
definem a entrada
para a atividade chamada.
Para obter o efeito total de uma transição, você precisa ativar o conteúdo da janela transições tanto na atividade chamada quanto na atividade chamada. Caso contrário, a função de saída inicia a transição de saída, mas você vê a janela transições, como escala ou esmaecimento.
Para iniciar uma transição de entrada o mais rápido possível, use o
Window.setAllowEnterTransitionOverlap()
na atividade chamada. Isso faz com que haja transições de entrada mais dramáticas.
Iniciar uma atividade usando transições
Se você ativar as transições e definir uma transição de saída para uma atividade, a de transição é ativada quando você inicia outra atividade, da seguinte maneira:
Kotlin
startActivity(intent, ActivityOptions.makeSceneTransitionAnimation(this).toBundle())
Java
startActivity(intent, ActivityOptions.makeSceneTransitionAnimation(this).toBundle());
Se você definir uma transição de entrada para a segunda atividade, essa transição também
é ativado quando a atividade é iniciada. Para desativar as transições ao começar
outra atividade, forneça um pacote de opções null
.
Iniciar uma atividade com um elemento compartilhado
Para fazer uma animação de transição de tela entre duas atividades que têm um elemento compartilhado, faça o seguinte:
- Ative transições de conteúdo da janela no tema.
- Especifique uma transição de elementos compartilhados no estilo.
- Defina a transição como um recurso XML.
- Atribua um nome comum aos elementos compartilhados em ambos os layouts com o
android:transitionName
. - Use a função
ActivityOptions.makeSceneTransitionAnimation()
.
Kotlin
// Get the element that receives the click event val imgContainerView = findViewById<View>(R.id.img_container) // Get the common element for the transition in this activity val androidRobotView = findViewById<View>(R.id.image_small) // Define a click listener imgContainerView.setOnClickListener( { val intent = Intent(this, Activity2::class.java) // Create the transition animation - the images in the layouts // of both activities are defined with android:transitionName="robot" val options = ActivityOptions .makeSceneTransitionAnimation(this, androidRobotView, "robot") // Start the new activity startActivity(intent, options.toBundle()) })
Java
// Get the element that receives the click event final View imgContainerView = findViewById(R.id.img_container); // Get the common element for the transition in this activity final View androidRobotView = findViewById(R.id.image_small); // Define a click listener imgContainerView.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { Intent intent = new Intent(this, Activity2.class); // Create the transition animation - the images in the layouts // of both activities are defined with android:transitionName="robot" ActivityOptions options = ActivityOptions .makeSceneTransitionAnimation(this, androidRobotView, "robot"); // Start the new activity startActivity(intent, options.toBundle()); } });
Para visualizações dinâmicas compartilhadas geradas no código, use a propriedade
Função View.setTransitionName()
para especificar um nome de elemento comum em ambos
atividades.
Para inverter a animação de transição de cena ao terminar a segunda atividade, chame o método
Activity.finishAfterTransition()
em vez de Activity.finish()
.
Iniciar uma atividade com diversos elementos compartilhados
Para fazer uma animação de transição de cena entre duas atividades com mais
de um elemento compartilhado, defina os elementos compartilhados em ambos os layouts com o
android:transitionName
ou use o
a função View.setTransitionName()
em ambas as atividades
crie um
ActivityOptions
da seguinte forma:
Kotlin
// Rename the Pair class from the Android framework to avoid a name clash import android.util.Pair as UtilPair ... val options = ActivityOptions.makeSceneTransitionAnimation(this, UtilPair.create(view1, "agreedName1"), UtilPair.create(view2, "agreedName2"))
Java
ActivityOptions options = ActivityOptions.makeSceneTransitionAnimation(this, Pair.create(view1, "agreedName1"), Pair.create(view2, "agreedName2"));