How to open payment UI to receive payments made with Google Pay
To receive payments made with Google Pay, you can use the following options of opening the payment UI:
- In a browser — in this case, a user is redirected to an external browser from the game to make a payment. The payment UI will look like this:
- In Android WebView — in this case, the payment UI opens seamlessly within the game application, like this:
- In Custom Tabs — in this case, the payment UI opens inside the game application, but a user sees a browser’s bar. The payment UI will look like this:
In browser
To open the payment UI in a browser and receive payments via Google Pay, you don’t need to implement additional code. To set it up, follow the instruction for opening the payment UI.
In Android WebView
Android WebView is a pre-installed system component from Google that allows Android applications to display web content. For the payment UI and Google Pay to work correctly in Android WebView, you need to configure WebView and set up the setWebViewClient and setWebChromeClient classes.
- java
mWebView.setWebViewClient(new XsollaWebViewClient(this));
mWebView.setWebChromeClient(new XsollaWebChromeClient(this));
To configure opening the payment UI in Android WebView:
- Configure WebView according to this example:
- java
WebSettings webSettings = mWebView.getSettings();
webSettings.setBuiltInZoomControls(false);
webSettings.setUseWideViewPort(true);
webSettings.setDomStorageEnabled(true);
webSettings.setLoadWithOverviewMode(true);
webSettings.setJavaScriptEnabled(true);
webSettings.setSupportMultipleWindows(true);
webSettings.setJavaScriptCanOpenWindowsAutomatically(true);
- Implement the
XsollaWebViewClient extends WebViewClientclass and theshouldOverrideUrlLoadingandonPageFinishedmethods in this class according to this example:
- java
class XsollaWebViewClient extends WebViewClient {
private final Context context;
public XsollaWebViewClient(Context context) {
this.context = context;
}
@Override
public boolean shouldOverrideUrlLoading(WebView view, String url) {
if(url.matches(".+://.*")) {
try {
Intent intent = Intent.parseUri(url, Intent.URI_INTENT_SCHEME);
intent.addCategory("android.intent.category.BROWSABLE");
intent.setComponent(null);
context.startActivity(intent);
} catch(URISyntaxException e) {
Log.e("WebView", "Invalid URL format" + url, e);
} catch (ActivityNotFoundException e) {
Log.e("WebView", "No activity found to handle URL: " + url, e);
}
return true;
}
return false;
}
@Override
public void onPageFinished(WebView view, String url) {
super.onPageFinished(view, url);
}
}
- Implement the
XsollaWebChromeClient extends WebChromeClientclass and theonCreateWindowandonCloseWindowmethods within it.
- java
public class XsollaWebChromeClient extends WebChromeClient {
private final Context mContext;
public XsollaWebChromeClient(Context context) {
mContext = context;
}
@Override
public boolean onCreateWindow(WebView view, boolean isDialog, boolean isUserGesture, android.os.Message resultMsg) {
MainActivity mainActivity = (MainActivity) mContext;
mainActivity.mChildWebView.setVisibility(View.VISIBLE);
WebView.WebViewTransport transport = (WebView.WebViewTransport) resultMsg.obj;
transport.setWebView(mainActivity.mChildWebView);
resultMsg.sendToTarget();
return true;
}
@Override
public void onCloseWindow(WebView window) {
if (window != null && window instanceof XsollaChildWebView) {
window.setVisibility(View.GONE);
}
}
}
- Implement the
XsollaChildWebView extends WebViewclass.
- java
public class XsollaChildWebView extends WebView {
@SuppressLint("SetJavaScriptEnabled")
public XsollaChildWebView(Context context, AttributeSet attrs) {
super(context, attrs);
WebSettings webSettings = getSettings();
webSettings.setJavaScriptEnabled(true);
webSettings.setDomStorageEnabled(true);
setWebViewClient(new XsollaWebViewClient(context));
setWebChromeClient(new XsollaWebChromeClient(context));
}
}
- Implement the
XsollaChildWebView mChildWebViewfield in theMainActivityclass:
- java
mChildWebView = findViewById(R.id.childWebView);
The second WebView (childWebView) is used for opening new windows in the payment UI:
Example of implementing the
- 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"
tools:context=".MainActivity">
<WebView
android:id="@+id/activity_main_webview"
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" />
<com.example.app.XsollaChildWebView
android:id="@+id/childWebView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:visibility="gone"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
In Custom Tabs
Custom Tabs is a feature in Android browsers that allow developers to add a customized browser experience directly within the application. The difference between WebView and Custom Tabs is that user actions in WebView are isolated from their other actions on the Internet, whereas using Custom allows synchronization of user actions with their other activity in Chrome on their Android device.
Code sample for opening the payment UI in Custom Tabs:
- java
String url = "https://secure.xsolla.com/paystation4?token=${token}";
CustomTabsIntent.Builder builder = new CustomTabsIntent.Builder();
CustomTabsIntent customTabsIntent = builder.build();
customTabsIntent.launchUrl(this, Uri.parse(url));
Was this article helpful?
Rate this page
Don’t want to answer
Thank you for your feedback!
Found a typo or other text error? Select the text and press Ctrl+Enter.
