cordova - 스플래시

 

참고자료

https://bundw.tistory.com/66

Cordova(코르도바) 실행 로딩화면 Splashscreen(스플래시 스크린) 적용

 

 

1. 스플래시 이미지 준비 / 경로

- land는 가로화면용

- port는 세로화면용 (없어도됨)  

 

config.xml - 스플래시 이미지 경로

 <platform name="android">
    <allow-intent href="market:*" />
    <splash src="res/screen/android/splash-land-hdpi.png" density="land-hdpi" />
    <splash src="res/screen/android/splash-land-ldpi.png" density="land-ldpi" />
    <splash src="res/screen/android/splash-land-mdpi.png" density="land-mdpi" />
    <splash src="res/screen/android/splash-land-xhdpi.png" density="land-xhdpi" />
    <splash src="res/screen/android/splash-land-xxhdpi.png" density="land-xxhdpi" />
    <splash src="res/screen/android/splash-land-xxxhdpi.png" density="land-xxxhdpi" />
  </platform>

 

config.xml - 스플래시 설정

 

SplashScreen : 스플래시 사용
AutoHideSplashScreen : 자동으로 숨김(true/false)
SplashScreenDelay : 스플래시 화면이 뜨는 시간

SplashMaintainAspectRatio : 이미지 비율 유지

<preference name="SplashScreen" value="screen" />
<preference name="AutoHideSplashScreen" value="true" /> 
<preference name="SplashScreenDelay" value="3000" />
<preference name="SplashMaintainAspectRatio" value="true" />

 

 

Orientation : 세로화면 고정 (portrait)

AppendUserAgent : 유저에이전트 (브라우저 구분용)

    <preference name="Orientation" value="portrait" />
    <preference name="AppendUserAgent" value="appState App" />

* 웹앱사용시에 AppendUserAgent설정을 통해서 해당프로젝트앱으로 들어왔는지를 체크하는 용도

 

 

코드로 스플래시 닫기

onDeviceReady: function() {
  ...
  navigator.splashscreen.hide();
  ...
}

 

 

이후에는 호스티드웹앱설정 후 사용하면 끝

https://voidfunction-e.tistory.com/entry/cordova-Hosted-WebApp%EC%97%90%EC%84%9C-Plugin-%EC%97%B0%EB%8F%99%ED%95%98%EA%B8%B0

cordova Hosted WebApp에서 Plugin 연동하기