Android 简明教程

Android - Animations

Android 中的动画可以通过多种方式实现。在本章中，我们将讨论一种制作动画的简单且广泛使用的方式，称为补间动画。

Tween Animation

补间动画获取一些参数，例如开始值、结束值、尺寸、时间持续时间、旋转角等，并在该对象上执行所需的动画。它可以应用于任何类型的对象。因此，为了使用此功能，Android 为我们提供了一个名为 Animation 的类。

为了在 Android 中执行动画，我们需要调用 AnimationUtils 类的静态函数 loadAnimation()。我们将以 Animation 对象的实例形式接收结果。它的语法如下：

Animation animation = AnimationUtils.loadAnimation(getApplicationContext(),
   R.anim.myanimation);

请注意第二个参数。它是动画 xml 文件的名称。您必须在 res 目录下创建一个名为 anim 的新文件夹，并在 anim 文件夹下生成一个 xml 文件。

此动画类具有众多有用的函数，如下所示：

Sr.No

Method & Description

1

start() 此方法启动动画。

2

setDuration(long duration) 此方法设置动画的持续时间。

3

getDuration() 此方法获取由上述方法设置的持续时间。

4

end() 此方法结束动画。

5

cancel() 此方法取消动画。

为了对对象应用此动画，我们将只调用对象的 startAnimation() 方法。它的语法为：

ImageView image1 = (ImageView)findViewById(R.id.imageView1);
image.startAnimation(animation);

Example

以下示例演示了在 Android 中使用动画。您将能够从菜单中选择不同类型的动画，选择的动画将应用于屏幕上的 imageView。

为了试验此示例，您需要在模拟器或实际设备上运行此示例。

Steps

Description

1

您将使用 Android Studio IDE 创建一个 Android 应用程序，并将其命名为 My Application，包名为 com.example.sairamkrishna.myapplication。

2

修改 src/MainActivity.java 文件，以添加动画代码。

3

修改布局 XML 文件 res/layout/activity_main.xml，如有需要，则添加任何 GUI 组件。

4

在 res 目录下创建一个新文件夹，并将其命名为 anim。通过访问 res/anim 来确认。

5

右键单击 anim，然后单击新建，并选择 Android XML 文件。您必须创建以下列出的不同文件。

6

创建文件 myanimation.xml、clockwise.xml、fade.xml、move.xml、blink.xml、slide.xml，并添加 XML 代码。

7

无需更改默认字符串常量。Android Studio 会处理 values/string.xml 中的默认常量。

8

运行该应用程序，选择一个正在运行的安卓设备，并在该设备上安装应用程序并验证结果。

以下是 MainActivity.java 的修改后的代码。

package com.example.sairamkrishna.myapplication;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.widget.ImageView;
import android.widget.Toast;

public class MainActivity extends Activity {
   @Override
   protected void onCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      setContentView(R.layout.activity_main);
   }

   public void clockwise(View view){
      ImageView image = (ImageView)findViewById(R.id.imageView);
      Animation animation = AnimationUtils.loadAnimation(getApplicationContext(),
         R.anim.myanimation);
      image.startAnimation(animation);
   }

   public void zoom(View view){
      ImageView image = (ImageView)findViewById(R.id.imageView);
      Animation animation1 = AnimationUtils.loadAnimation(getApplicationContext(),
         R.anim.clockwise);
      image.startAnimation(animation1);
   }

   public void fade(View view){
      ImageView image = (ImageView)findViewById(R.id.imageView);
      Animation animation1 =
         AnimationUtils.loadAnimation(getApplicationContext(),
            R.anim.fade);
      image.startAnimation(animation1);
   }

   public void blink(View view){
      ImageView image = (ImageView)findViewById(R.id.imageView);
      Animation animation1 =
         AnimationUtils.loadAnimation(getApplicationContext(),
            R.anim.blink);
      image.startAnimation(animation1);
   }

   public void move(View view){
      ImageView image = (ImageView)findViewById(R.id.imageView);
      Animation animation1 =
         AnimationUtils.loadAnimation(getApplicationContext(), R.anim.move);
      image.startAnimation(animation1);
   }

   public void slide(View view){
      ImageView image = (ImageView)findViewById(R.id.imageView);
      Animation animation1 =
         AnimationUtils.loadAnimation(getApplicationContext(), R.anim.slide);
      image.startAnimation(animation1);
   }
}

以下是 res/layout/activity_main.xml 的修改后的代码。

<RelativeLayout
   xmlns:android="http://schemas.android.com/apk/res/android"
   xmlns:tools="http://schemas.android.com/tools"
   android:layout_width="match_parent"
   android:layout_height="match_parent"
   android:paddingLeft="@dimen/activity_horizontal_margin"
   android:paddingRight="@dimen/activity_horizontal_margin"
   android:paddingTop="@dimen/activity_vertical_margin"
   android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity">

   <TextView
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="Alert Dialog"
      android:id="@+id/textView"
      android:textSize="35dp"
      android:layout_alignParentTop="true"
      android:layout_centerHorizontal="true" />

   <TextView
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="Tutorialspoint"
      android:id="@+id/textView2"
      android:textColor="#ff3eff0f"
      android:textSize="35dp"
      android:layout_below="@+id/textView"
      android:layout_centerHorizontal="true" />

   <ImageView
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:id="@+id/imageView"
      android:src="@drawable/abc"
      android:layout_below="@+id/textView2"
      android:layout_alignRight="@+id/textView2"
      android:layout_alignEnd="@+id/textView2"
      android:layout_alignLeft="@+id/textView"
      android:layout_alignStart="@+id/textView"/>

   <Button
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="zoom"
      android:id="@+id/button"
      android:layout_below="@+id/imageView"
      android:layout_alignParentLeft="true"
      android:layout_alignParentStart="true"
      android:layout_marginTop="40dp"
      android:onClick="clockwise"/>

   <Button
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="clockwise"
      android:id="@+id/button2"
      android:layout_alignTop="@+id/button"
      android:layout_centerHorizontal="true"
      android:onClick="zoom"/>

   <Button
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="fade"
      android:id="@+id/button3"
      android:layout_alignTop="@+id/button2"
      android:layout_alignParentRight="true"
      android:layout_alignParentEnd="true"
      android:onClick="fade"/>

   <Button
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="blink"
      android:onClick="blink"
      android:id="@+id/button4"
      android:layout_below="@+id/button"
      android:layout_alignParentLeft="true"
      android:layout_alignParentStart="true" />

   <Button
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="move"
      android:onClick="move"
      android:id="@+id/button5"
      android:layout_below="@+id/button2"
      android:layout_alignRight="@+id/button2"
      android:layout_alignEnd="@+id/button2"
      android:layout_alignLeft="@+id/button2"
      android:layout_alignStart="@+id/button2" />

   <Button
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="slide"
      android:onClick="slide"
      android:id="@+id/button6"
      android:layout_below="@+id/button3"
      android:layout_toRightOf="@+id/textView"
      android:layout_toEndOf="@+id/textView" />

</RelativeLayout>

这是 res/anim/myanimation.xml 的代码。

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">

   <scale xmlns:android="http://schemas.android.com/apk/res/android"
      android:fromXScale="0.5"
      android:toXScale="3.0"
      android:fromYScale="0.5"
      android:toYScale="3.0"
      android:duration="5000"
      android:pivotX="50%"
      android:pivotY="50%" >
   </scale>

   <scale xmlns:android="http://schemas.android.com/apk/res/android"
      android:startOffset="5000"
      android:fromXScale="3.0"
      android:toXScale="0.5"
      android:fromYScale="3.0"
      android:toYScale="0.5"
      android:duration="5000"
      android:pivotX="50%"
      android:pivotY="50%" >
   </scale>

</set>

这是 res/anim/clockwise.xml 的代码。

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">

   <rotate xmlns:android="http://schemas.android.com/apk/res/android"
      android:fromDegrees="0"
      android:toDegrees="360"
      android:pivotX="50%"
      android:pivotY="50%"
      android:duration="5000" >
   </rotate>

   <rotate xmlns:android="http://schemas.android.com/apk/res/android"
      android:startOffset="5000"
      android:fromDegrees="360"
      android:toDegrees="0"
      android:pivotX="50%"
      android:pivotY="50%"
      android:duration="5000" >
   </rotate>

</set>

这是 res/anim/fade.xml 的代码。

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
   android:interpolator="@android:anim/accelerate_interpolator" >

   <alpha
      android:fromAlpha="0"
      android:toAlpha="1"
      android:duration="2000" >
   </alpha>

   <alpha
      android:startOffset="2000"
      android:fromAlpha="1"
      android:toAlpha="0"
      android:duration="2000" >
   </alpha>

</set>

这是 res/anim/blink.xml 的代码。

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
   <alpha android:fromAlpha="0.0"
      android:toAlpha="1.0"
      android:interpolator="@android:anim/accelerate_interpolator"
      android:duration="600"
      android:repeatMode="reverse"
      android:repeatCount="infinite"/>
</set>

这是 res/anim/move.xml 的代码。

<?xml version="1.0" encoding="utf-8"?>
<set
   xmlns:android="http://schemas.android.com/apk/res/android"
   android:interpolator="@android:anim/linear_interpolator"
   android:fillAfter="true">

   <translate
      android:fromXDelta="0%p"
      android:toXDelta="75%p"
      android:duration="800" />
</set>

这是 res/anim/slide.xml 的代码。

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
   android:fillAfter="true" >

   <scale
      android:duration="500"
      android:fromXScale="1.0"
      android:fromYScale="1.0"
      android:interpolator="@android:anim/linear_interpolator"
      android:toXScale="1.0"
      android:toYScale="0.0" />
</set>

这是 res/values/string.xml 的修改代码。

<resources>
   <string name="app_name">My Application</string>
</resources>

这是 AndroidManifest.xml 的默认代码。

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

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

      <activity
         android:name="com.example.animation.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>

我们尝试运行你的应用。我认为你已经将真实的 Android 手机设备连接到了电脑上。要从 Android Studio 运行应用，打开项目中一个活动文件，然后单击工具栏上的“运行”图标。Android Studio 将显示以下图像。

animation

选择缩放按钮，它将显示以下屏幕。

zoom

现在选择幻灯片按钮，它将显示以下屏幕。

slide

现在选择移动按钮，它将显示以下屏幕。

move

现在是顺时针按钮，它将显示以下屏幕。

clockwise

现在是淡入淡出按钮，它将显示以下屏幕。

fade

注意：如果你在模拟器中运行，你可能无法体验到流畅的动画效果。你必须在 Android 手机中运行才能体验到流畅的动画。