MultiStateAnimation, 创建复杂的多状态动画的Android库




  繁體 雙語
Android library to create complex multi-state animations.
  • 源代码名称:MultiStateAnimation
  • 源代码网址:
  • MultiStateAnimation源代码文档
  • MultiStateAnimation源代码下载
  • Git URL:
    Git Clone代码到本地:
    git clone
    $ svn co --depth empty
    Checked out revision 1.
    $ cd repo
    $ svn up trunk


    Demo animation


    一个使用android的AnimationDrawable 实现复杂多状态动画的类。 它同时支持oneshot和环形动画部分。 在定义的状态之间移动时,可以定义节之间的转换,并自动播放。 状态转换可以异步排队,当当前部分完成时,库将平稳地启动下一个动画。


    将以下依赖项添加到gradle生成 file:

    dependencies { 
     compile '' }


    每个动画都由一系列的状态组成。 状态有一些元数据和要绘制的框架列表。 状态还可以定义来自其他状态的转换。 转换是在直接从指定状态移动到定义转换状态的状态时将播放的帧列表。

    可以使用包含作为 raw 资源的JSON文件或者直接使用构建器在Java代码中定义动画来定义动画。


    // The ID is used in code to specify a section to playMultiStateAnimation.SectionBuilder firstSection =newMultiStateAnimation.SectionBuilder("first_section")
     // If true, this section will play once and stop. Otherwise it// will loop indefinitely.. setOneshot(false)
     // The number of milliseconds that each frame of this section will// play. setFrameDuration(33)
     // Each frame is the name of an image resource. They will be// played in the order added.. addFrame(R.drawable.first_section_01)
    . addFrame(R.drawable.first_section_02);
     // The frames of a transition will be played before playing// the normal frames of this section when transitioning. In// this case, the frames for this transition will play if//"first_section" is playing when queueTransition("second_section") // is calledMultiStateAnimation.TransitionBuilder transitionFromFirst =newMultiStateAnimation.TransitionBuilder()
    . setFrameDuration(33)
    . addFrame(R.drawable.first_to_second_transition_001)
    . addFrame(R.drawable.first_to_second_transition_002)
    . addFrame(R.drawable.first_to_second_transition_003);
     // As a special case, a transition ID of"" is a transition// from nothing. It will play if the associated section is the// first to ever play.MultiStateAnimation.TransitionBuilder transitionFromNothing =newMultiStateAnimation.TransitionBuilder()
    . addFrame(R.drawable.nothing_to_second_001)
    . addFrame(R.drawable.nothing_to_second_002);
     // A section with a single frame and"oneshot" set to true is// equivalent to a static imageMultiStateAnimation.SectionBuilder secondSection =newMultiStateAnimation.SectionBuilder("second_section")
    . setOneshot(true)
    . addTransition("first_section", transitionFromFirst)
    . addTransition("", transitionFromNothing)
    . addFrame(R.drawable.second_section_01);
     // Animation should be given an View that will be used to display the animation.ImageView view = (ImageView) findViewById(;
     MultiStateAnimation animation =newMultiStateAnimation.Builder(view)
    . addSection(startSection)
    . addSection(loadingSection)
    . addSection(endSection)
    . build(context);


    除了使用Java代码,你可以使用存储为原始资源的JSON文件来定义动画。 下面的JSON文件定义了与 上面 Java代码相同的动画。

     "first_section": { 
     "frames": [
     "first_section_2" ],
     "second_section": {
     "frames": [
     "second_section_01" ],
     "transitions_from": {
     "first_section": {
     "frames": [
     "first_to_second_transition_003" ]
     "": {
     "frames": [
     "nothing_to_second_002" ]

    然后,可以在Java中创建一个 MultiStateAnimationOjbect:

    ImageView view = (ImageView) findViewById(;
     MultiStateAnimation animationSeries =MultiStateAnimation.fromJsonResource(context, view, R.raw.sample_animation);

    repo 中包含一个 python 3脚本插件,它可以帮助为动画生成 JSON。 要使用它,请将动画的每个部分放置在单独的文件夹中,将这些文件夹传递给脚本。

    例如要生成JSON文件 上面,请创建如下所示的文件夹结构:

    . ├── first_section
     │ ├── first_section_1.png
     │ └── first_section_2.png
     ├── first_to_second_transition
     │ ├── first_to_second_transition_001.png
     │ ├── first_to_second_transition_002.png
     │ └── first_to_second_transition_003.png
     ├── nothing_to_second_transition
     │ ├── nothing_to_second_001.png
     │ └── nothing_to_second_002.png
     └── second_section
     └── second_section_01.png

    这些文件夹可以位于 文件系统的任何位置。 要生成JSON文件,请将该文件夹作为参数运行:

     python first_section/second_section/first_to_second_transition/nothing_to_second_transition/--output=sample_animation.json

    脚本将询问关于每个部分的一系列问题,并将生成的json文件保存到 sample_animation.json。 你可以运行 python --help 查看参数的完整列表


    通过 上面 方法创建动画对象之后,你可以使用来自GUI线程的queueTransitiontransitionNow 开始播放动画。



    请参见主 Activityjson动画定义示例应用程序示例中的示例。

    Java API

    查看 了解更多API细节。


    Copyright 2016 KeepSafe Inc.
    Licensed under the Apache License, Version 2.0 (the"License");
    you may not use this file except in compliance with the License.
    You may obtain a copy of the License at

    Unless required by applicable law or agreed to in writing, software
    distributed under the License is distributed on an"AS IS" BASIS,
    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
    See the License for the specific language governing permissions and
    limitations under the License.

    COM  STA  STAT  动画  State  animations