Like other platforms, Android requires the same two or three simple steps: Add a web view, handle events/messages, and, in some cases, authenticate the user.
Component used: WebView
Required Web View Configuration
- Enable JavaScript
- Enable Web Storage (DOM Storage)
elements-in-android.kt
// Step 1: Set Up a Web View
webView = findViewById(R.id.webView)
// Configure WebView settings
val webSettings: WebSettings = webView.settings
webSettings.javaScriptEnabled = true
webSettings.domStorageEnabled = true
webSettings.setSupportZoom(true) // Enable zoom controls
webSettings.mixedContentMode = WebSettings.MIXED_CONTENT_ALWAYS_ALLOW // Allow mixed content (HTTP/HTTPS)
// Set a WebViewClient to handle page navigation within the WebView itself
webView.webViewClient = object : WebViewClient() {
// This method is deprecated in API 24 and later, but still useful for older devices
override fun shouldOverrideUrlLoading(view: WebView?, url: String?): Boolean {
url?.let {
view?.loadUrl(it)
}
return true // Return true to indicate that the app handled the URL
}
// For API 24 and later
override fun shouldOverrideUrlLoading(view: WebView?, request: android.webkit.WebResourceRequest?): Boolean {
request?.url?.let { uri ->
view?.loadUrl(uri.toString())
}
return true // Return true to indicate that the app handled the URL
}
override fun onReceivedError(view: WebView?, request: android.webkit.WebResourceRequest?, error: android.webkit.WebResourceError?) {
super.onReceivedError(view, request, error)
android.util.Log.e("WebView", "Error: ${error?.description}")
}
override fun onReceivedHttpError(view: WebView?, request: android.webkit.WebResourceRequest?, errorResponse: android.webkit.WebResourceResponse?) {
super.onReceivedHttpError(view, request, errorResponse)
android.util.Log.e("WebView", "HTTP error: ${errorResponse?.statusCode}")
}
}
Method used: postWebMessage
Please Log In to view this content.
elements-in-android.kt
// Step 2: Set Up Communications: Event/Message Handling
// Step 2a: Send Event to Elements
//
// Code sample coming soon
//
Method used: addJavascriptInterface
Please Log In to view this content.
elements-in-android.kt
// Step 2b: Listen for events from Elements
// Add JavaScript interface for postMessage
webView.addJavascriptInterface(object {
@JavascriptInterface
fun postMessage(message: String) {
// Interpret response and send to DailyPay using POST /accounts
// See https://developer.dailypay.com/tag/Accounts#operation/createAccount
// For demo - alert the response payload here.
runOnUiThread {
AlertDialog.Builder(this@MainActivity)
.setTitle("Message from WebView")
.setMessage(message)
.setPositiveButton("OK", null)
.show()
}
}
}, "AndroidInterface")
elements-in-android.kt
// Step 3: Setup Authentication
//
// Code sample coming soon
//
elements-in-android.kt
package com.example.webviewrunner
import android.os.Bundle
import android.webkit.JavascriptInterface
import android.webkit.WebSettings
import android.webkit.WebView
import android.webkit.WebViewClient
import android.app.AlertDialog
import androidx.appcompat.app.AppCompatActivity
class MainActivity : AppCompatActivity() {
private lateinit var webView: WebView
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
// Step 1: Set Up a Web View
webView = findViewById(R.id.webView)
// Configure WebView settings
val webSettings: WebSettings = webView.settings
webSettings.javaScriptEnabled = true
webSettings.domStorageEnabled = true
webSettings.setSupportZoom(true) // Enable zoom controls
webSettings.mixedContentMode = WebSettings.MIXED_CONTENT_ALWAYS_ALLOW // Allow mixed content (HTTP/HTTPS)
// Set a WebViewClient to handle page navigation within the WebView itself
webView.webViewClient = object : WebViewClient() {
// This method is deprecated in API 24 and later, but still useful for older devices
override fun shouldOverrideUrlLoading(view: WebView?, url: String?): Boolean {
url?.let {
view?.loadUrl(it)
}
return true // Return true to indicate that the app handled the URL
}
// For API 24 and later
override fun shouldOverrideUrlLoading(view: WebView?, request: android.webkit.WebResourceRequest?): Boolean {
request?.url?.let { uri ->
view?.loadUrl(uri.toString())
}
return true // Return true to indicate that the app handled the URL
}
override fun onReceivedError(view: WebView?, request: android.webkit.WebResourceRequest?, error: android.webkit.WebResourceError?) {
super.onReceivedError(view, request, error)
android.util.Log.e("WebView", "Error: ${error?.description}")
}
override fun onReceivedHttpError(view: WebView?, request: android.webkit.WebResourceRequest?, errorResponse: android.webkit.WebResourceResponse?) {
super.onReceivedHttpError(view, request, errorResponse)
android.util.Log.e("WebView", "HTTP error: ${errorResponse?.statusCode}")
}
}
// Step 1 End
// Step 2: Set Up Communications: Event/Message Handling
// Step 2a: Send Event to Elements
//
// Code sample coming soon
//
// Step 2b: Listen for events from Elements
// Add JavaScript interface for postMessage
webView.addJavascriptInterface(object {
@JavascriptInterface
fun postMessage(message: String) {
// Interpret response and send to DailyPay using POST /accounts
// See https://developer.dailypay.com/tag/Accounts#operation/createAccount
// For demo - alert the response payload here.
runOnUiThread {
AlertDialog.Builder(this@MainActivity)
.setTitle("Message from WebView")
.setMessage(message)
.setPositiveButton("OK", null)
.show()
}
}
}, "AndroidInterface")
// Step 2 End
// Step 3: Setup Authentication
//
// Code sample coming soon
//
// Step 3 End
// Replace client_id and implementation_id with values supplied by DailyPay
// that are unique to you and your application
webView.loadUrl("https://elements.uat.dailypay.com/v1/debit-card-tokenization?client_id=REPLACE_WITH_YOUR_CLIENT_ID&implementation_id=REPLACE_WITH_YOUR_IMPLEMENTATION_ID")
}
// Handle back button presses to navigate within the WebView's history
override fun onBackPressed() {
if (webView.canGoBack()) {
webView.goBack()
} else {
super.onBackPressed()
}
}
}