[Android / Wear OS] 간단한 점수판 앱 제작하기 - ② 가로 모드 및 몰입형 모드

제작할 점수판 앱은 가로 화면에 최적화되어있으므로 이를 설정해준다.

앱을 가로로 설정하는 방법은 두 가지가 있다.

1. AndroidManifest.xml 수정

AndroidManifest.xml을 열고 <activity></activity> 사이에 android:screenOrientation="landscape"를 추가해준다.

이 경우 화면이 가로로 잘 나오지만 취소선과 함께 경고 문구가 나온다.

문구를 읽어보면 다른 factor에서 불안정할 수 있기 때문에 Activity를을 고정된 방향으로 제한해서는 안 된다는 것 같다.

 

2. Kotlin 파일에서 requestedOrientation 변경

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        enableEdgeToEdge()
        // 화면 가로 모드 설정
        requestedOrientation = ActivityInfo.SCREEN_ORIENTATION_LANDSCAPE;
        setContentView(R.layout.activity_main)
    }
}

setContentView()를 호출하기 전에 requestedOrientation = ActivityInfo.SCREEN_ORIENTATION_LANDSCAPE 를 추가해주면 화면을 가로를 설정할 수 있다. 이외에도 필요에 따라 화면을 다르게 설정할 수 있는데, 아래 공식 문서를 참고하면 좋을 것 같다.

https://developer.android.com/reference/android/content/pm/ActivityInfo#SCREEN_ORIENTATION_BEHIND

ActivityInfo  |  Android Developers

 

그리고 간단히 점수판 기본 xml파일을 만들어 실행한 결과는 다음과 같다.

 

상단의 시스템 표시줄과 우측 비게이션 바가 상당히 거슬린다... 이는 가상 머신뿐만 아니라 실제 기기에서도 마찬가지였다. 

 

이를 해결하기 위해 안드로이드에서는 '몰입형 모드'를 지원하는데 이는 전체 화면 환경이 필요한 경우(예: 사용자가 영화를 시청할 때) 시스템 표시줄을 숨길 수 있는 기능이다.

 

몰입 모드 사용하기

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        enableEdgeToEdge()
        // 화면 가로 모드 설정
        requestedOrientation = ActivityInfo.SCREEN_ORIENTATION_LANDSCAPE;
        // 화면 몰입 모드 설정
        val windowInsetsController = WindowCompat.getInsetsController(window, window.decorView);
        windowInsetsController.hide(WindowInsetsCompat.Type.systemBars());
        setContentView(R.layout.activity_main)
    }
}

 

먼저 windowInsetsController를 정의해준 뒤, windowInsetsController에 있는 hide() 함수와 show() 함수를 통해 시스템 표시줄을 숨기거나 보이도록 할 수 있다.

hide(), show()함수에는 파라미터가 필요한데 코드에서 작성한 WindowInsetsCompat.Type.systemBars() 를 넣을 경우 상태 표시줄과 내비게이션 바를 숨길 수 있다.

이외에도 WindowInsetsCompat.Type.statusBars()를 사용하여 상태 표시줄만 숨기거나 WindowInsetsCompat.Type.navigationBars()를 사용하여 탐색 메뉴만 숨길 수 있다.

 

하지만 위 코드에서 잠깐 시간 또는 알림을 확인하기 위해 상태 표시줄을 슬라이드하여 내릴 경우 이가 다시 사라지지 않는다는 문제가 발생한다. 그 원인은 windowInsetsController.systemBarsBehavior가 기본값으로 설정되어 있기 때문인데, 이 값을 WindowInsetsControllerCompat.BEHAVIOR_SHOW_TRANSIENT_BARS_BY_SWIPE 으로 설정하면 우리가 원하는 몰입 모드 설정이 가능하다.

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        enableEdgeToEdge()
        // 화면 가로 모드 설정
        requestedOrientation = ActivityInfo.SCREEN_ORIENTATION_LANDSCAPE
        // 화면 몰입 모드 설정
        val windowInsetsController = WindowCompat.getInsetsController(window, window.decorView)
        // 상태 표시줄, 네비게이션 바 숨김
        windowInsetsController.hide(WindowInsetsCompat.Type.systemBars())
        // 스와이프하여 잠깐 보이도록 설정
        windowInsetsController.systemBarsBehavior = 
            WindowInsetsControllerCompat.BEHAVIOR_SHOW_TRANSIENT_BARS_BY_SWIPE
        
        setContentView(R.layout.activity_main)
    }
}

 

 

더 자세한 내용은 아래 공식 문서를 참조하면 좋을 것 같다.

 

https://developer.android.com/design/ui/mobile/guides/foundations/system-bars?hl=ko&_gl=1*h2omtn*_up*MQ..*_ga*MzAwMDUwNDkzLjE3MTk5ODA0MDE.*_ga_6HH9YJMN9M*MTcxOTk5MzM5OC4yLjAuMTcxOTk5MzM5OC4wLjAuMA..

Android 시스템 표시줄  |  Mobile  |  Android Developers

https://developer.android.com/develop/ui/views/layout/immersive?hl=ko&_gl=1*iflv5s*_up*MQ..*_ga*NjIxMzI3MjAxLjE3MjAwNzAwNzM.*_ga_6HH9YJMN9M*MTcyMDA3MDA3Mi4xLjAuMTcyMDA3MDEwMC4wLjAuMA..

몰입형 모드를 위한 시스템 표시줄 숨기기  |  Views  |  Android Developers