跳转到相应内容

最常访问

最近访问

navigation

Create a Custom Transition Animation

A custom transition enables you to create an animation that is not available from any of the built-in transition classes. For example, you can define a custom transition that turns the foreground color of text and input fields to gray to indicate that the fields are disabled in the new screen. This type of change helps users see the fields you disabled.

A custom transition, like one of the built-in transition types, applies animations to child views of both the starting and ending scenes. Unlike built-in transition types, however, you have to provide the code that captures property values and generates animations. You may also want to define a subset of target views for your animation.

This page teaches you to capture property values and generate animations to create custom transitions.

Extend the Transition Class

To create a custom transition, add a class to your project that extends the Transition class and override the methods shown in the following snippet:

Kotlin

class CustomTransition : Transition() {

    override fun captureStartValues(transitionValues: TransitionValues) {}

    override fun captureEndValues(transitionValues: TransitionValues) {}

    override fun createAnimator(
        sceneRoot: ViewGroup,
        startValues: TransitionValues?,
        endValues: TransitionValues?
    ): Animator? {}

}

Java

public class CustomTransition extends Transition {

    @Override
    public void captureStartValues(TransitionValues values) {}

    @Override
    public void captureEndValues(TransitionValues values) {}

    @Override
    public Animator createAnimator(ViewGroup sceneRoot,
                                   TransitionValues startValues,
                                   TransitionValues endValues) {}
}

The following sections explain how to override these methods.

Capture View Property Values

Transition animations use the property animation system described in Property Animation. Property animations change a view property between a starting and ending value over a specified period of time, so the framework needs to have both the starting and ending value of the property to construct the animation.

However, a property animation usually needs only a small subset of all the view's property values. For example, a color animation needs color property values, while a movement animation needs position property values. Since the property values needed for an animation are specific to a transition, the transitions framework does not provide every property value to a transition. Instead, the framework invokes callback methods that allow a transition to capture only the property values it needs and store them in the framework.

Capturing Starting Values

To pass the starting view values to the framework, implement the captureStartValues(transitionValues) method. The framework calls this method for every view in the starting scene. The method argument is a TransitionValues object that contains a reference to the view and a Map instance in which you can store the view values you want. In your implementation, retrieve these property values and pass them back to the framework by storing them in the map.

To ensure that the key for a property value does not conflict with other TransitionValues keys, use the following naming scheme:

package_name:transition_name:property_name

The following snippet shows an implementation of the captureStartValues() method:

Kotlin

class CustomTransition : Transition() {

    // Define a key for storing a property value in
    // TransitionValues.values with the syntax
    // package_name:transition_class:property_name to avoid collisions
    private val PROPNAME_BACKGROUND = "com.example.android.customtransition:CustomTransition:background"

    override fun captureStartValues(transitionValues: TransitionValues) {
        // Call the convenience method captureValues
        captureValues(transitionValues)
    }

    // For the view in transitionValues.view, get the values you
    // want and put them in transitionValues.values
    private fun captureValues(transitionValues: TransitionValues) {
        // Get a reference to the view
        val view = transitionValues.view
        // Store its background property in the values map
        transitionValues.values[PROPNAME_BACKGROUND] = view.background
    }

    ...

}

Java

public class CustomTransition extends Transition {

    // Define a key for storing a property value in
    // TransitionValues.values with the syntax
    // package_name:transition_class:property_name to avoid collisions
    private static final String PROPNAME_BACKGROUND =
            "com.example.android.customtransition:CustomTransition:background";

    @Override
    public void captureStartValues(TransitionValues transitionValues) {
        // Call the convenience method captureValues
        captureValues(transitionValues);
    }


    // For the view in transitionValues.view, get the values you
    // want and put them in transitionValues.values
    private void captureValues(TransitionValues transitionValues) {
        // Get a reference to the view
        View view = transitionValues.view;
        // Store its background property in the values map
        transitionValues.values.put(PROPNAME_BACKGROUND, view.getBackground());
    }
    ...
}

Capture Ending Values

The framework calls the captureEndValues(TransitionValues) method once for every target view in the ending scene. In all other respects, captureEndValues() works the same as captureStartValues().

The following code snippet shows an implementation of the captureEndValues() method:

Kotlin

override fun captureEndValues(transitionValues: TransitionValues) {
    captureValues(transitionValues)
}

Java

@Override
public void captureEndValues(TransitionValues transitionValues) {
    captureValues(transitionValues);
}

In this example, both the captureStartValues() and captureEndValues() methods invoke captureValues() to retrieve and store values. The view property that captureValues() retrieves is the same, but it has different values in the starting and ending scenes. The framework maintains separate maps for the starting and ending states of a view.

Create a Custom Animator

To animate the changes to a view between its state in the starting scene and its state in the ending scene, you provide an animator by overriding the createAnimator() method. When the framework calls this method, it passes in the scene root view and the TransitionValues objects that contain the starting and ending values you captured.

The number of times the framework calls the createAnimator() method depends on the changes that occur between the starting and ending scenes. For example, consider a fade out/fade in animation implemented as a custom transition. If the starting scene has five targets of which two are removed from the ending scene, and the ending scene has the three targets from the starting scene plus a new target, then the framework calls createAnimator() six times: three of the calls animate the fading out and fading in of the targets that stay in both scene objects; two more calls animate the fading out of the targets removed from the ending scene; and one call animates the fading in of the new target in the ending scene.

For target views that exist on both the starting and ending scenes, the framework provides a TransitionValues object for both the startValues and endValues arguments. For target views that only exist in the starting or the ending scene, the framework provides a TransitionValues object for the corresponding argument and null for the other.

To implement the createAnimator(ViewGroup, TransitionValues, TransitionValues) method when you create a custom transition, use the view property values you captured to create an Animator object and return it to the framework. For an example implementation, see the ChangeColor class in the CustomTransition sample. For more information about property animators, see Property Animation.

Apply a Custom Transition

Custom transitions work the same as built-in transitions. You can apply a custom transition using a transition manager, as described in Applying a Transition.

此网站会使用 Cookie 来存储您在此网站上指定的语言和显示选项偏好设置。

获取最新的 Android Developers 资讯和提示,助您在 Google Play 上取得成功。

* 必填字段

成功!

在微信上关注 Google Developers

要以浏览此网站吗?

您请求访问的是网页,但是您为此网站设置的语言偏好为

要更改您的语言偏好设置并以浏览此网站吗?如果以后您想要更改语言偏好设置,请使用每个页面底部的语言菜单。

该类需要 或更高的 API 级别

此文档已被隐藏,因为您为该文档选择的 API 级别是 。您可以使用左侧导航栏上方的选择器来更改文档的 API 级别。

要详细了解如何根据您的应用需求指定 API 级别,请参阅支持不同平台版本

Take a short survey?
Help us improve the Android developer experience. (April 2018 — Developer Survey)