Android Studio(기능) 장면 전환 Transition

activity_main.xml은 아무것도 디자인 안할 것이다.

그리고 장면에 해당하는 .xml을  두개 만들어서 화면이 전환되는 효과를 해보자.

첫 번째 장면(페이지)에 해당하는 scene1을 만들자.

이렇게만 하면 버튼을 눌렀을 때, 장면이 휙휙 바뀔 것이다.

이제 장면이 넘어갈때 애니메이션 효과를 넣자.

버튼이 대각선으로 이동되는게 보이는 효과

버튼이 대각선으로 이동되면서 마지막 장면에 해당하는 위치로 간다.

 

MainActivity.java

---

package com.lcw.ex75scenetransition;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.transition.Scene;
import android.transition.Transition;
import android.transition.TransitionInflater;
import android.transition.TransitionManager;
import android.view.View;
import android.widget.RelativeLayout;

public class MainActivity extends AppCompatActivity {

RelativeLayout rootLayout;

Scene scene1;
Scene scene2;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

rootLayout= findViewById(R.id.layout_root);

//2개의 장면(Scene)객체 생성
scene1= Scene.getSceneForLayout(rootLayout,R.layout.scene1,this);
scene2= Scene.getSceneForLayout(rootLayout,R.layout.scene2,this);

//우선 처음 보여질 장면(Scene)을 화면에 보이도록.
scene1.enter();
}

//장면(Scene)에서 지정한 onclick메소드들
public void clickBtn1(View v){
//장면 1로 전환
//전화 효과 객체 생성
Transition transition= TransitionInflater.from(this).inflateTransition(R.transition.tran);
TransitionManager.go(scene1, transition);
}
public void clickBtn2(View v){
//장면 2로 전환
Transition transition= TransitionInflater.from(this).inflateTransition(R.transition.tran);
TransitionManager.go(scene2, transition);
}
public void clickBtn3(View v){

}
}

---

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:id="@+id/layout_root"
tools:context=".MainActivity">

</RelativeLayout>

---

scene1.xml

---

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

<Button
android:id="@+id/btn1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="button1"
android:onClick="clickBtn1"/>
<!-- clickBtn1 는 create안해도 빨간 에러줄이 안나옴.-->
<Button
android:id="@+id/btn2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="button2"
android:layout_alignParentRight="true"
android:onClick="clickBtn2"/>
<Button
android:id="@+id/btn3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="button3"
android:layout_centerInParent="true"
android:onClick="clickBtn3"/>
</RelativeLayout>

---

scene2.xml

---

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

<Button
android:id="@+id/btn1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="button1"
android:layout_alignParentRight="true"
android:layout_alignParentBottom="true"
android:onClick="clickBtn1"/>

<Button
android:id="@+id/btn2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="button2"
android:layout_alignParentBottom="true"
android:onClick="clickBtn2"/>

</RelativeLayout>

---

tran.xml

---

<?xml version="1.0" encoding="utf-8"?>
<transitionSet xmlns:android="http://schemas.android.com/apk/res/android"
android:transitionOrdering="sequential">
<!-- transitionOrdering="sequential" 효과를 순서적으로 적용-->

<!-- 투명도 전환 효과-->
<fade android:duration="2000" android:fadingMode="fade_in_out">
<targets>
<target android:targetId="@id/btn3"/>
</targets>
</fade>

<!-- 크기나 위치 전환 효과-->
<changeBounds android:duration="2000" android:interpolator="@android:interpolator/bounce"/>

</transitionSet>

---