본문 바로가기
안드로이드 웹앱 콘테츠 개발자 양성(국비지원)/Android 기능

Android Studio(기능) 첫페이지 인트로 효과 주기(로고,제목 애니메이션 효과)

by 차누감 2019. 10. 15.

Animation 효과 두 가지가 있다.

1) FrameAnimation (그림이 여려장이여서 연속적으로 보이기) 

2) Tween Animation

 

Animation 클래스

①Translate : 이동

②Rotate : 회전

③Scale : 축척

④Alpha : 투명도

 

이 예제에서는 Scale과 Alpha 사용

<최종 실행 화면>

 

우선 로고 이미지를 drawable에 미리 추가하겠다.

제목바를 없애자.

디자인

애니메이션을 주기 위해 전용 폴더를 만들자.

이제 제목 텍스트에도 효과를 줄 것이다.

여기까지하면 제목과 로고 이미지의 효과를 볼 수 있다.

이제 애니메이션이 끝났을때 버튼이 생기고, 버튼을 누르면 새로운 창을 띄워보자.

<최종 실행 화면>

MainActivity.java


package com.lcw.ex74introactivitytest;

import androidx.appcompat.app.AppCompatActivity;

import android.content.Intent;
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.TextView;

public class MainActivity extends AppCompatActivity {

TextView tv;
ImageView iv;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
tv= findViewById(R.id.tv);
iv= findViewById(R.id.iv);

//뷰에 애니메이션 적용하기
//res폴더의 anim폴더에 애니메이션 설계
Animation ani= AnimationUtils.loadAnimation(this,R.anim.appear_logo);
iv.startAnimation(ani);

//애니메이션 리스너
ani.setAnimationListener(new Animation.AnimationListener() {
@Override
public void onAnimationStart(Animation animation) {
}

@Override
public void onAnimationEnd(Animation animation) {
findViewById(R.id.btn).setVisibility(View.VISIBLE);

}
@Override
public void onAnimationRepeat(Animation animation) {
}
});

tv.startAnimation(AnimationUtils.loadAnimation(this,R.anim.appear));

}
public void clickBtn(View view) {
startActivity(new Intent(this, SecondActivity.class));
}
}


activity_main.xml


<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#011122"
tools:context=".MainActivity">

<TextView
android:id="@+id/tv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="HELLO GLOBAL"
android:textSize="40sp"
android:textStyle="bold"
android:textColor="@color/colorAccent"
android:layout_centerHorizontal="true"
android:layout_marginTop="88dp"/>

<ImageView
android:id="@+id/iv"
android:layout_width="160dp"
android:layout_height="160dp"
android:src="@drawable/globe"
android:layout_centerInParent="true"/>

<Button
android:id="@+id/btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="start"
android:backgroundTint="@color/colorPrimary"
android:textColor="#FFFFFF"
android:layout_alignParentBottom="true"
android:layout_centerInParent="true"
android:layout_marginBottom="40dp"
android:visibility="gone"
android:onClick="clickBtn"/>
</RelativeLayout>


appear.xml


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

<translate
android:fromXDelta="0"
android:toXDelta="0"
android:fromYDelta="-30%p"
android:toYDelta="0%p"
android:duration="4000"/>

</set>


appear_logo.xml


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

<scale
android:fromXScale="0.0"
android:toXScale="1.0"
android:fromYScale="0.0"
android:toYScale="1.0"
android:pivotX="50%"
android:pivotY="50%"
android:duration="5000"/>
<!-- fromXScale 원래 사이즈의 배율 1.0이 원래 사이즈-->
<!-- pivotX="50%p" p parent의 약자로 부모의 위치이다.-->
<alpha
android:fromAlpha="0.0"
android:toAlpha="1.0"
android:duration="5000"/>
</set>


 

댓글