Android-bleepy developers

시작하기

간편하게 웹뷰 URL 호출만으로 런처를 실행하고 Client Admin에서 프로모션을 생성하여 발급받은 Secret Key에 연동된 게임을 실행합니다. 웹뷰를 구성하여 게임을 실행하고 등록한 프로모션을 진행해보세요.

WebView 구성하기

Android 가이드 문서는 아래 조건을 기준으로 작성되었습니다.

사용언어: Kotlin * java가 아닌 Kotlin 언어를 기준으로 작성되었습니다.
아키텍쳐: ViewBinding * ViewBinding(뷰결합) 아키텍처로 작성되었습니다. * findViewByld 형식의 아키텍처를 사용하시는 경우, 자체적인 샘플 코드의 수정이 필요할 수 있습니다.

kotlin

// build.gradle (:app) android { // ... buildFeatures { viewBinding true } // ... }

1단계 : 블리피 런처 Activity 레이아웃 파일 생성

res/layout 경로에 블리피 런처 Activity 레이아웃 파일을 생성합니다.

XML 파일명과 WebView 컴포넌트의 id 속성값은 샘플로 작성된 명칭으로 수정이 가능합니다.

xml

<?xml version="1.0" encoding="utf-8"?> <androidx.constraintlayout.widget.ConstraintLayout 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:layout_width="match_parent" android:layout_height="match_parent" android:background="@color/white" tools:context=".LauncherActivity"> <WebView android:id="@+id/webViewLauncher" android:layout_width="match_parent" android:layout_height="match_parent" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" /> </androidx.constraintlayout.widget.ConstraintLayout>

AndroidManifest.xml 파일의 <application></application> 태그 안쪽에 런처 WebView activity를 추가합니다.

activity 의 name 속성값은 샘플로 작성된 명칭으로 수정이 가능합니다.
theme 의 속성은 프로젝트에 맞춰 변경하시면 됩니다.
런처 화면은 세로모드만 지원하기 때문에 portrait 으로 고정이 필요합니다.

xml

<application ...> ... <activity android:name=".LauncherActivity" android:screenOrientation="portrait" android:theme="@style/Theme.{projectName}.NoActionBar" tools:ignore="LockedOrientationActivity" /> ... </application>

2단계 : 블리피 런처 Activity > WebView 설정 추가

Activity 내 WebView 위에 블리피 런처가 정상 동작하기 위해서는 몇가지 설정이 필요합니다.

1. Javascript Interface 선언

Webview ↔ 어플리케이션 간의 통신을 위해 우리는 Javascript Interface 선언이 필요합니다. 이와 관련된 내용은 [안드로이드 개발자 사이트]를 참고 할 수 있습니다.

Javascript Interface 추가 코드

name 값은 블리피 런처 내 BlpLauncher 로 선언된 네이밍을 따라갑니다.

kotlin

binding.webViewLauncher.apply { // ... // JavascriptInterface 추가 addJavascriptInterface( ExampleWebAppInterface(this@LauncherActivity), "BlpLauncher" ) // ... }

ExampleWebAppInterface 클래스 선언

블리피 런처와 안드로이드 클라이언트가 통신하는 케이스입니다.

Interface function	Description
closeLauncher()	블리피 런처의 Back 버튼 UI 클릭 시 (뒤로가기 처리)

kotlin

// 블리피 Launcher Web <-> App 인터페이스 규격 class ExampleWebAppInterface(private val mContext: Context) { @JavascriptInterface fun closeLauncher() { // 런처 뒤로가기 > 런처 종료 (mContext as Activity).finish() } }

2. WebView 기본 설정 추가

블리피 런처가 WebView 내에서 정상적인 동작을 하려면 몇가지 WebView 기본 설정이 필요합니다.

javaScriptEnabled 값을 true 로 설정해주어야 WebView에 구동되는 웹 페이지 내 자바스크립트 코드가 정상적으로 허용되어 동작합니다.
블리피 런처에서는 localStorage 를 사용하기에 domStorageEnabled 값을 true 로 설정해주어야 정상적으로 dom을 가져와 동작합니다.

kotlin

binding.webViewLauncher.settings.apply { javaScriptEnabled = true // 자바 스크립트 허용 domStorageEnabled = true // storage enabled (로컬 스토리지 사용하여 dom 가져올 수 있도록 함) }

3. WebView URL 로드

Activity가 실행되었을 때 onCreate() 안에서 런처URL 을 WebView에 로드한다.

kotlin

override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) // ... binding.webViewLauncher.apply { // WebView에 블리피 런처 URL을 로드 loadUrl("런처 URL") } // ... }

3단계 : onDestroy() 설정

안드로이드에서는 Activity가 종료될 때 onDestroy() 라는 라이프 사이클을 수행합니다. 이 시점에 WebView 인스턴스를 초기화 및 destroy 하여 메모리 누수를 방지합니다. 런처 WebView Activity 뿐만 아니라 추가적으로 WebView Activity를 생성할 경우 다음과 같이 onDestroy() 처리를 넣어주는 편이 좋습니다.

kotlin

// WebView 초기화 및 destroy - 메모리 누수 방지 override fun onDestroy() { super.onDestroy() binding.webViewLauncher.apply { clearHistory() loadUrl("about:blank") removeAllViews() destroy() } }

개발에 대한 추가 설명이 더 필요하신가요?

"[Client Admin] 로그인 → 오른쪽 하단 채널톡 위젯" 클릭 후 개발 카테고리에 문의 남겨주시면 기술 개발팀에서 확인 후 연락드리겠습니다.

v1.0.6