스플래시 화면에 사진을 표시하고 배경음악을 들려주는 코드를 만들었다. 코드상으로는 단순한 구조인데 액티비티만 구현해도 가능하다. 그러나 자잘한 챙겨둘 조건들이 있어서 관건이다.
- 사진 파일의 선명도를 유지하는 방법 (화면 크기, 소프트웨어적인 해상도에 따라 선명도가 달라짐)
- 물리적 화면 크기의 비율에 따른 화면 표시상의 빈 공간 제거 방법이 필요
- 음악파일의 크기가 작으면 좋을 것
- 액티비티 생명 주기에 따라 음악재생 객체를 리셋하거나 완전 삭제 필요
우선
- 현존하는 기기의 최고 해상도보다 가로 세로 픽셀을 크게 사진 파일 제작
- 화면의 물리적 종횡비를 맞추어 세가지 종류의 사진 파일 제작
- 프리미어 프로 같은 소프트웨어로 음악 파일 잘라 저장
- 액티비티에서 제공하는 기정의 함수를 재정의해서 생명주기에 따라 MediaPlayer 생성, 소멸 코드 작성
이 방법을 쓰면 된다. 관건은 리소스를 제작할때 고려할 것들이고, 규칙에 따라 하면 좋다는 것이다.
리소스 파일의 디렉토리 구조는 이렇다.
이 구조다.
우선 density 계산해서 xhdpi, xxhdpi 구분할 필요없이, 종횡비 비율만 맞추어 해상도를 크게 해서 저장하면 된다. 현존하는 최고 해상도를 조사해서 대략 2000x3200px 정도로 저장하면 된다.
그리고 splash_image_sw600dp.png는 3:4 던가? 실행해보면서 7인치와 8인치 태블릿 화면에 꽉차게 픽셀 조정해서 저장한다.
splash_image_sw720dp.png는 10인치 태블릿을 위한 파일인데 이역시도 실험해서 꽉차게 픽셀 조정해서 저장하면 된다.
res/layout/splash_layout.xml
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
<?xml version="1.0" encoding="utf-8"?> <androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent"> <ImageView android:id="@+id/splash_image" android:layout_width="match_parent" android:layout_height="match_parent" android:src="@drawable/idology_splash"/> </androidx.constraintlayout.widget.ConstraintLayout> |
res/layout-sw600dp/splash_layout.xml
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
<?xml version="1.0" encoding="utf-8"?> <androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent"> <ImageView android:id="@+id/splash_image" android:layout_width="match_parent" android:layout_height="match_parent" android:src="@drawable/idology_splash_sw600dp"/> </androidx.constraintlayout.widget.ConstraintLayout> |
res/layout-sw720dp/splash_layout.xml
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
<?xml version="1.0" encoding="utf-8"?> <androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent"> <ImageView android:id="@+id/splash_image" android:layout_width="match_parent" android:layout_height="match_parent" android:src="@drawable/idology_splash_sw720dp"/> </androidx.constraintlayout.widget.ConstraintLayout> |
이렇게 해두고 스플래시 액티비티에서 setContentView(R.layout.splash_main) 해주면 된다.
음악 파일은 무료 음원 중에 클래식으로 저작권이 작곡가와 연주가 모두 소멸된 파일을 받아다가 프리미어 프로에서 26초로 잘라낸 파일을 썼다. 4MB 정도 크기가 160KB 정도로 줄었다.
이 파일을 res/raw 에 저장해서 아래 코드로 불러온다.
|
1 2 3 4 5 6 7 8 9 10 11 |
lateinit var mediaPlayer: MediaPlayer // 전역 변수 override fun onCreate(savedInstanceState: Bundle?) { mediaPlayer = MediaPlayer.create(this, R.raw.음악파일명) // 확장자는 생략 mediaPlayer.setLooping(true) mediaPlayer.start() .... mediaPlayer.reset() } |
이렇게 하면 음악이 연주되는데, 백버튼으로 다른 화면으로 가면 연주가 이어진다. 그래서 액티비티 생명주기에 맞게
|
1 2 3 4 5 6 7 8 9 10 11 |
override fun onPause() { super.onPause() mediaPlayer.release() } override fun onDestroy() { super.onDestroy() mediaPlayer.release() } |
이렇게 해두면 스플래시 화면에서 백버튼을 눌러 최종적으로 홈화면으로 나와도 음악이 꺼지고, 타 액티비티로 넘어가도 음악이 멈추게 된다. 의도한대로다.
그리고 액티비티 onCreate 함수에
|
1 2 3 4 5 6 7 |
var button: ImageView = findViewById(R.id.splash_image) button.setOnClickListener(View.OnClickListener { var intent: Intent = Intent(this, MainActivity::class.java) startActivity(intent) }) |
처럼 구현한다. 버튼과 스플래시 이미지를 한 개의 이미지로 제작했고, 분간이 쉽게 button 변수에 담아 처리했다. Intent 생성자는 두번째 인수로 이동할 액티비티의 이름을 붙여서 넘겨준다. 그러면 이미지를 클릭시 이동할 액티비티가 화면에 표시된다. 코틀린 코드지만, 인수 끝에 .java가 붙는다.
참고로 위 코드에서 onCreate 함수에 mediaPlayer.reset()을 꼭 해주어야 합니다. 안하고 앱을 실행하면 첫실행시 홈화면에 나오거나 타화면으로 넘어가면 onDestroy와 onPause가 실행되어 음악이 멈추는데요. 여러번 앱을 실행하게 되면 음악이 안멈춥니다. 이를 막는 코드가 mediaPlayer.reset()입니다.