Klarna Docs - Hybrid

Hybrid

You can hook up your web view to the SDK in only a few steps and immediately provide a much more pleasant experience when using Klarna products on mobile.

This guide will walk you through:

  • Initializing the SDK.
  • Adding a web view.
  • Notifyng the SDK when something occurs in the web view.
  • Getting events from the SDK.

SETTING UP THE SDK

Setting up the SDK consists of creating an instance of the SDK and implementing a listener.

Instantiate the SDK

Initialize the Hybrid SDK by creating a new instance of KlarnaHybridSDK. You should hold a strong reference to the SDK. It will deallocate all its resources if you null it. You only need a single instance of the SDK, regardless of how many web views you have, but if you need to, you can create several SDKs.

Creating an Instance

ParamTypeDescription
returnUrlStringA URL that the SDK can use to return customers to your app.
callbackKlarnaHybridSDKCallbackCallback interface that will notify you about changes in the SDK.

The Hybrid Callback Object

The SDK will notify you of events via a callback object that you’ll need to implement. It acts like a listener on Android, however, unlike a listener, it’s not optional.

You can read more about the callback at the end of this page.

ADDING A WEB VIEW

You need to add the web views that the SDK should track. The SDK will hold weak references to these web views, so if they’re deallocated, the SDK will lose track of them.

Create an instance of WebView either in your layout or directly in your code and pass it to the SDK with addWebView(). This web view will be used to render your checkout content.

Add a Web View

ParamTypeDescription
webViewWebViewA WebView that the SDK will track ongoingly.

Retrieving a Web View from XML

To add a web view to the SDK from a layout:

Creating a Web View in Code

To add a web view to the SDK from code:

NOTIFYING THE SDK

There are two instances at which you’ll need to notify the SDK of events in your web view (as we don’t override your WebViewClient).

Before a Navigation

You should notify the SDK about upcoming navigations by calling the SDK’s shouldFollowNavigation() from your WebViewClient.

Calling Should Follow Navigation

ParamParamDescription
urlURLThe URL that will be loaded.

After a Navigation

You need to notify the SDK after a page has loaded by calling the SDK’s newPageLoad() from your WebViewClient.

Calling New Page Load

ParamTypeDescription
webViewWebViewThe WebView that new content has loaded in.

HANDLING EVENTS

More About the Klarna Hybrid SDK Callback

Your app will need to implement the KlarnaHybridSDKCallback interface. This will let your app be notified about relevant events that happen inside the web view that the SDK is observing. There are currently five events:

  • Four events notifying you of fullscreen transitions.
  • One error event.

All of these provide you with the web view these events occurred in. You can read more about the fullscreen events here.

You listen to these methods by implementing KlarnaHybridSDKCallback in your checkout’s Activity.

JAVA
    class MyActivity: AppCompatActivity(), KlarnaHybridSDKCallback {
        // ...
        override fun willShowFullscreenContent(webView: WebView, completion: OnCompletion) {
            // ...
            completion.run()
        }
        override fun didShowFullscreenContent(webView: WebView, completion: OnCompletion) {
            // ...
            completion.run()
        }

Kotlin

The completion handler completion.run() should be called when you have performed any animations or changes to let the SDK know that your app is done with this step. The only exception is onErrorOccurred() which does not expect an action to be performed by the app when called.