본문 바로가기
매일코딩/안드로이드

[안드로이드 기초] 화면에 애니메이션 효과 적용하기

by 인생여희 2017. 8. 22.
반응형

화면에 애니메이션 효과 적용하기


#결과화면


#mainActivitiy.xml

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    >
 
   <LinearLayout
       android:layout_width="match_parent"
       android:layout_height="match_parent"
       android:background="#ff5555ff">
 
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="base area"
        android:textSize="30dp"
        android:textColor="#ffffff"/>
   </LinearLayout>
 
    <LinearLayout
        android:id="@+id/page"
        android:layout_width="200dp"
        android:layout_height="match_parent"
        android:orientation="vertical"
        android:layout_gravity="right"
        android:background="#ffffff66"
        android:visibility="invisible">
 
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="sliding area"
            android:textSize="30dp"
            android:textColor="#000000"/>
    </LinearLayout>
 
    <Button
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="OPEN"
        android:layout_gravity="center_vertical|right"/>
 
</FrameLayout>
 
cs


#mainActivity.java

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
package me.happygate.myapplicationlayout;
 
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.widget.Button;
import android.widget.LinearLayout;
 
public class MainActivity extends AppCompatActivity {
 
    LinearLayout page;
    Animation translateLeft;
    Animation translateRight;
    Button button;
    //열렸는지 안열렸는지 체크
    boolean isPageOpen = false;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
 
        //숨겨진 리니어 레이아웃
        page = (LinearLayout)findViewById(R.id.page);
 
        //애니메이션 옵션이 설정된 xml 파일을 AnimationUtils통해서 가져오기

        translateLeft = AnimationUtils.loadAnimation(this,R.anim.translate_left);
        translateRight = AnimationUtils.loadAnimation(this,R.anim.translate_right);
 
 
        //3.애니메이션에 옵션을 적용시킨다.
        SlidingAnimationListener listener = new SlidingAnimationListener();
        translateLeft.setAnimationListener(listener);
        translateRight.setAnimationListener(listener);
 
        button =(Button)findViewById(R.id.button);
        //1버튼 눌렸을 때
        button.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
 
                //화면이 오른쪽으로 열려있다면
                if(isPageOpen){
                    //레이아웃을 오른쪽으로 열어줘라
                    page.startAnimation(translateRight);
                }else{
                    //화면 왼쪽으로 닫기
                    page.setVisibility(View.VISIBLE);
                    page.startAnimation(translateLeft);
                }
 
            }
        });
    }
 
 
    //2애니메이션 동작을 위해  Animation.AnimationListener를 구현한 클래스 생성
    class SlidingAnimationListener implements Animation.AnimationListener{
 
        @Override
        public void onAnimationStart(Animation animation) {
 
        }
 
        @Override
        public void onAnimationEnd(Animation animation) {
            //애니메이션이 끝날때 동작
 
            if(isPageOpen){
                //애니메이션이 끝날때 페이지가 열려있는 상태다하면
                //오른쪽으로 열려있다. 즉 보이지 않는다.
                page.setVisibility(View.INVISIBLE);
                button.setText("열기");
                isPageOpen = false;
            }else{
                button.setText("닫기");
                isPageOpen = true;
            }
        }
 
        @Override
        public void onAnimationRepeat(Animation animation) {
 
        }
    }
 
}
 
cs


#애니메이션을 정의한 xml



반응형

댓글