[Android] Navigation 을 사용한 Fragment 이동 및 애니메이션

panax·2022년 2월 4일
0

Android

목록 보기
10/16

개발자 가이드

Android Jetpack 에 포함된 컴포넌트로 화면 이동과 관련된 작업을 편리하게 해준다.

Navigation 은 프래그먼트의 이동을 관리하는데, global action 과 애니메이션에 대한 사용법을 정리하려 한다.

Global action

공식 문서의 번역은 전역 작업이란 단어로 사용하는 것 같다.

Global action 은 일반적인 Navigation action 과 다르게 출발점 없이 도착점만 지정하는 action 이다.

일반적인 action 은 fragment 태그의 하위에 위치하지만, Global action 은 fragment 태그와 동일한 레벨에 위치한다.

<?xml version="1.0" encoding="utf-8"?>
<navigation 
    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:id="@+id/home_navigation_graph"
	app:startDestination="@id/passFragment">

	<fragment
		android:id="@+id/settingFragment"
		android:name="com.formalworks.did_android.ui.fragment.SettingFragment"
		android:label="fragment_setting"
		tools:layout="@layout/fragment_setting" />

	<action
		android:id="@+id/home_global_action_setting"
		app:destination="@id/settingFragment"
		app:enterAnim="@anim/fragment_slide_left_show"
		app:exitAnim="@anim/fragment_slide_right_exit"
		app:popEnterAnim="@anim/fragment_slide_left_show"
		app:popExitAnim="@anim/fragment_slide_right_exit" />
</navigation>

Global action 은 출발 지점이 정해지지 않았기 때문에 action 에 비해서 프래그먼트의 이동이 자유롭다.

이러한 특성을 활용하면 Navigation Drawer 나 Bottom Navigation 등에 적용할 수 있다.

Action animation

개발자 가이드

Navigation 은 액션이 실행될 때 나타나고 사라지는 애니메이션을 적용할 수 있다.

위 코드에서 app:enterAnim, app:popEnterAnim 속성 등을 사용해 지정할 수 있다.

app:enterAnim 속성과 app:exitAnim 속성은 프래그먼트가 새로 나타나고 사라질 때 실행되는 애니메이션을 지정할 수 있는 속성이다.

app:popEnterAnim 속성과 app:popExitAnim 속성은 실행했던 프래그먼트가 나타나고 사라질 때 실행되는 애니메이션을 지정할 수 있는 속성인 것 같다.

해당 속성들은 translate 태그를 가진 xml 의 내용에 따라 애니메이션을 실행한다.

다음 예제는 0.5초 동안 왼쪽에서 나타나는 애니메이션 xml 파일이다.

<?xml version="1.0" encoding="utf-8"?>
<translate 
    xmlns:android="http://schemas.android.com/apk/res/android"
	android:duration="500"
	android:fromXDelta="-100%"
	android:interpolator="@android:anim/decelerate_interpolator"
	android:toXDelta="0%" />

다음 예제는 0.5초 동안 오른쪽으로 사라지는 애니메이션 xml 파일이다.

<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
	android:duration="500"
	android:fromXDelta="0%"
	android:interpolator="@android:anim/decelerate_interpolator"
	android:toXDelta="100%" />
profile
안드로이드 개발자

0개의 댓글