Android-애니메이션

애니메이션은 움직임과 모양 변화를 만드는 과정입니다.

Android의 애니메이션은 여러 가지 방법으로 가능합니다. 이 장에서는 트위닝 된 애니메이션이라는 애니메이션을 만드는 쉽고 널리 사용되는 한 가지 방법에 대해 설명합니다.

트윈 애니메이션

Tween Animation은 시작 값, 종료 값, 크기, 지속 시간, 회전 각도 등과 같은 일부 매개 변수를 사용하여 해당 객체에 필요한 애니메이션을 수행합니다. 모든 유형의 개체에 적용 할 수 있습니다. 그래서 이것을 사용하기 위해 안드로이드는 우리에게 Animation이라는 클래스를 제공했습니다.

android에서 애니메이션을 수행하기 위해 AnimationUtils 클래스의 정적 함수 loadAnimation ()을 호출합니다. Animation Object의 인스턴스에서 결과를받을 것입니다. 구문은 다음과 같습니다.

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

두 번째 매개 변수에 유의하십시오. 애니메이션 xml 파일의 이름입니다. 라는 새 폴더를 만들어야합니다.anim res 디렉토리에서 anim 폴더 아래에 xml 파일을 만듭니다.

이 애니메이션 클래스에는 아래에 나열된 많은 유용한 기능이 있습니다.

Sr. 아니요 방법 및 설명
1

start()

이 메서드는 애니메이션을 시작합니다.

2

setDuration(long duration)

이 메서드는 애니메이션 기간을 설정합니다.

getDuration()

이 방법은 위의 방법으로 설정된 기간을 가져옵니다.

4

end()

이 메서드는 애니메이션을 종료합니다.

5

cancel()

이 메서드는 애니메이션을 취소합니다.

이 애니메이션을 객체에 적용하기 위해 객체의 startAnimation () 메서드를 호출하기 만하면됩니다. 구문은-

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

다음 예제는 Android에서 Animation을 사용하는 방법을 보여줍니다. 메뉴에서 다른 유형의 애니메이션을 선택할 수 있으며 선택한 애니메이션이 화면의 imageView에 적용됩니다.

이 예제를 실험하려면 에뮬레이터 또는 실제 기기에서 실행해야합니다.

단계 기술
1 Android 스튜디오 IDE를 사용하여 Android 애플리케이션을 만들고 com.example.sairamkrishna.myapplication 패키지에서 My Application으로 이름을 지정합니다.
2 src / MainActivity.java 파일을 수정하여 애니메이션 코드 추가
레이아웃 XML 파일 res / layout / activity_main.xml 수정 필요한 경우 GUI 구성 요소를 추가하십시오.
4 res 디렉토리 아래에 새 폴더를 만들고 anim이라고합니다. res / anim을 방문하여 확인하십시오.
5 anim을 마우스 오른쪽 버튼으로 클릭하고 new를 클릭하고 Android XML 파일을 선택하십시오. 아래 나열된 다른 파일을 만들어야합니다.
6 myanimation.xml, clockwise.xml, fade.xml, move.xml, blink.xml, slide.xml 파일을 만들고 XML 코드를 추가합니다.
7 기본 문자열 상수를 변경할 필요가 없습니다. Android 스튜디오는 values ​​/ string.xml에서 기본 상수를 처리합니다.
8 애플리케이션을 실행하고 실행중인 Android 기기를 선택하고 여기에 애플리케이션을 설치하고 결과를 확인합니다.

다음은 수정 된 코드입니다. 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.

여기 abc는 tutorialspoint의 로고에 대해 나타냅니다.
<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 스튜디오에서 앱을 실행하려면 프로젝트의 활동 파일 중 하나를 열고

도구 모음에서 실행 아이콘을 클릭하십시오 . Android 스튜디오는 다음 이미지를 표시합니다.

줌 버튼을 선택하면 다음과 같은 화면이 나타납니다.

이제 슬라이드 버튼을 선택하면 다음 화면이 표시됩니다.

이제 이동 버튼을 선택하면 다음 화면이 표시됩니다.

이제 시계 방향 버튼을 누르면 다음 화면이 표시됩니다.

이제 페이드 버튼, 다음 화면이 표시됩니다

참조 : 에뮬레이터에서 실행하면 부드러운 애니메이션 효과가 나타나지 않을 수 있습니다. 매끄러운 애니메이션을 경험하려면 안드로이드 모바일에서 실행해야합니다.