2017년 3월 24일 금요일

Xamarin, Android : 화면이동 & 이동시 애니메이션 적용

일단 앱에서 화면 이동.

Xamarin, Android : 뒤로가기 버튼으로 종료 막기 에서 만든 앱을 기준으로함.

앱에서 화면 이동이란 액티비티 이동이니, 먼저 레이아웃을 하나 추가.



파일명은 아무거나 원하는 대로.


서브 페이지는 불러오기만 할 것이므로 그냥 이대로 놔 두면 되고...


레이아웃을 만들었으니, 그 레이아웃을 불러올 액티비티를 하나 만듬.


알아보기 쉽게 "SubActivity" 라고 만들고...


단순하게 서브 화면을 불러오는 구문만 추가.


Intent intent = new Intent(this, typeof(SubActivity));
StartActivity(intent);

그런 다음 메인 액티비티에서 불러오기만 하면 됨.
여기서는 액션바에서 검색 버튼을 클릭시 화면 전환이 되게 만듬.


그럼 이렇게 화면 전환은 된다.
그런데, 화면 전환 액션이 별로 맘에 안듬. 뭔가 화면이 따로 따로 노는 듯.
그러니, 좀더 그럴듯하게 화면 전환 애니메이션을 적용시켜 보자.

검색 아이콘을 클릭하면 현재 페이지가 왼쪽으로 이동하고, 새로운 페이지가 오른쪽에서 슬라이드 하면서 들어오게 끔 만들어 본다.


일단 "Resources" 폴더에 "anim" 폴더를 하나 만든다.


그리고, 거기에 "anim_slide_out_left.xml" 파일을 하나 만듬.
파일이름은 어떤걸 해도 상관이 없으나, 알아보기 쉽게 만든다.

fromXDelta 가 0% 고, toXDelta 가 -100% 이므로, 현재 보이는 화면이 왼쪽으로 이동하며 화면에서 완전히 사라지는 애니메이션이 된다.

이걸 현재 화면에 적용하면 현재 화면이 왼쪽으로 이동하며 사라지는 에니메이션이 된다.

그럼, 이젠 새로운 화면이 등장하는 애니메이션을 만든다.


동일한 위치에 "anim_slide_in_right.xml" 만들고, 등장하는 애니메이션이므로 사라지는 에니메이션과 반대로 fromXDelta 가 100% 고, toXDelta 가 0% 로 지정하여 오른쪽에서 왼쪽으로 이동하며 화면에 등장하게 설정한다.


그리고, 액티비티를 불러오는 부분에 "OverridePendingTansition()" 을 설정.

 OverridePendingTansition("들어오는 화면 액션", "나가는 화면 액션")

이렇게 지정하면 서브 화면으로 이동하는 애니메이션은 설정 완료.
이제 반대로 서브 화면에서 메인 화면으로 이동하는 애니메이션을 만들어 본다.



그냥 메인 화면에서 만들었던 애니메이션과 반대로 이동하게 만들면 된다.


그리고 서브 액티비티에서 뒤로가기 버튼을 클릭시 Finish(); 하는 부분에 애니메이션을 적용.

이렇게 하면...


두개의 화면이 마치 붙어 있는것처럼 자연스럽게 왔다 갔다 하며 화면 전환이 이루어 진다.