슬라이딩 애니메이션 (Sliding Animation)

Source: https://www.edwith.org/boostcourse-android/lecture/17113/

1. 실행 결과 화면

  

2. activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
    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"
    tools:context="com.tistory.qlyh8.practice.MainActivity">
 
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:padding="10dp"
        android:background="@android:color/holo_purple">
        <TextView
            android:id="@+id/text_view1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textColor="@android:color/white"
            android:textSize="25sp"
            android:text="Base Area" />
    </LinearLayout>
 
    <LinearLayout
        android:id="@+id/linear_layout"
        android:layout_width="200dp"
        android:layout_height="match_parent"
        android:padding="10dp"
        android:layout_gravity="end"
        android:background="@android:color/holo_orange_light"
        android:visibility="invisible">
        <TextView
            android:id="@+id/text_view2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textColor="@android:color/white"
            android:textSize="25sp"
            android:text="Slide Area" />
    </LinearLayout>
 
    <Button
        android:id="@+id/button"
        android:layout_width="100dp"
        android:layout_height="wrap_content"
        android:layout_gravity="center_vertical|end"
        android:text="시작"/>
</FrameLayout>
 

3. res/anim/trans_left.xml

<?xml version="1.0" encoding="utf-8"?>
<!--
fromXDelta, toXDelta: X 방향 이동
duration: 애니메이션이 얼마나 지속될 지 시간을 지정하는 속성
repeatCount: 애니메이션의 반복 횟수
fillAfter: 애니메이션 동작이 끝난 후에 원래의 모양대로 화면에 보여줄 것인지를 지정

1.5초 동안 뷰가 오른쪽에서 뷰의 원래 위치로 이동
-->
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate
        android:fromXDelta="100%p"
        android:toXDelta="0%p"
        android:duration="1500"
        android:repeatCount="0"
        android:fillAfter="true"/>
</set>

4. res/anim/trans_right.xml

<?xml version="1.0" encoding="utf-8"?>
<!-- 1.5초 동안 뷰가 오른쪽으로 이동 -->
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate
        android:fromXDelta="0%p"
        android:toXDelta="100%p"
        android:duration="1500"
        android:repeatCount="0"
        android:fillAfter="true"/>
</set>

5. MainActivity.java

package com.tistory.qlyh8.practice;
 
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 layout;
    Button button;
    Animation transLeft, transRight;
    Boolean isPageOpen = false;
 
    @Override
    protected void onCreate(final Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
 
        layout = findViewById(R.id.linear_layout);
        button = findViewById(R.id.button);
        SlidingListener listener = new SlidingListener();
        transLeft = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.trans_left);
        transRight = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.trans_right);
        transLeft.setAnimationListener(listener);
        transRight.setAnimationListener(listener);
 
        button.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                if(isPageOpen){
                    layout.startAnimation(transRight);
                } else {
                    layout.setVisibility(View.VISIBLE);
                    layout.startAnimation(transLeft);
                }
            }
        });
    }
 
    class SlidingListener implements Animation.AnimationListener {
        @Override
        public void onAnimationStart(Animation animation) {}
        @Override
        public void onAnimationEnd(Animation animation) { // 애니메이션이 끝날 때
            if(isPageOpen){
                layout.setVisibility(View.INVISIBLE);
                button.setText("열기");
                isPageOpen = false;
            } else {
                button.setText("닫기");
                isPageOpen = true;
            }
        }
        @Override
        public void onAnimationRepeat(Animation animation) {}
    }
}

6. 참고

Slide between fragments using ViewPager: https://developer.android.com/training/animation/screen-slide