Tiledesk Docs
Search…
Integrate Widget for Android with WebView
This example shows how to integrate the Tiledesk Widget via a WebView for Android.
Attention the Tiledesk Widget is compatible with Android 5+

Integrate Widget for Android with WebView

Permissions

Don't forget to give permission in your manifest.xml adding the following:
1
<uses-permission android:name="android.permission.INTERNET"></uses-permission>
2
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"></uses-permission>
Copied!

Activity

1
package com.tiledesk.tiledeskwidgetintegrationexample;
2
3
import androidx.annotation.RequiresApi;
4
import androidx.appcompat.app.AppCompatActivity;
5
6
import android.os.Bundle;
7
8
import android.app.Activity;
9
import android.content.ActivityNotFoundException;
10
import android.content.Intent;
11
import android.net.Uri;
12
import android.os.Build;
13
import android.util.Log;
14
import android.webkit.ConsoleMessage;
15
import android.webkit.ValueCallback;
16
import android.webkit.WebChromeClient;
17
import android.webkit.WebSettings;
18
import android.webkit.WebView;
19
import android.widget.Toast;
20
21
public class TiledeskActivity extends AppCompatActivity {
22
23
24
public static final int REQUEST_SELECT_FILE = 100;
25
public ValueCallback<Uri[]> uploadMessage;
26
27
@Override
28
protected void onCreate(Bundle savedInstanceState) {
29
super.onCreate(savedInstanceState);
30
setContentView(R.layout.activity_tiledesk);
31
32
WebView myWebView = (WebView) findViewById(R.id.tiledesk);
33
34
35
WebSettings webSettings = myWebView.getSettings();
36
webSettings.setJavaScriptEnabled(true);
37
38
39
myWebView.setWebChromeClient(new FileChooserWebChromeClient(this) {
40
@Override
41
public boolean onConsoleMessage(ConsoleMessage consoleMessage) {
42
Log.d("TiledeskActivity", consoleMessage.message() + " -- From line "
43
+ consoleMessage.lineNumber() + " of "
44
+ consoleMessage.sourceId());
45
return super.onConsoleMessage(consoleMessage);
46
}
47
});
48
49
// allow to snap photos
50
webSettings.setAllowFileAccess(true);
51
52
webSettings.setDomStorageEnabled(true);
53
webSettings.setJavaScriptCanOpenWindowsAutomatically(true);
54
55
myWebView.loadUrl("https://widget.tiledesk.com/v5/assets/twp/index.html?tiledesk_projectid=<CHANGE_IT>&tiledesk_fullscreenMode=true&tiledesk_hideHeaderCloseButton=true&tiledesk_isOpen=true");
56
57
}
58
59
60
@RequiresApi(api = Build.VERSION_CODES.LOLLIPOP)
61
protected void onActivityResult(int requestCode, int resultCode, Intent data) {
62
super.onActivityResult(requestCode, resultCode, data);
63
if (requestCode == REQUEST_SELECT_FILE) {
64
if (uploadMessage == null) return;
65
uploadMessage.onReceiveValue(WebChromeClient.FileChooserParams.parseResult(resultCode, data));
66
uploadMessage = null;
67
}
68
}
69
70
71
public class FileChooserWebChromeClient extends WebChromeClient {
72
73
private Activity myActivity;
74
75
public FileChooserWebChromeClient(TiledeskActivity myActivity) {
76
this.myActivity = myActivity;
77
}
78
79
@RequiresApi(api = Build.VERSION_CODES.LOLLIPOP)
80
public boolean onShowFileChooser(WebView webView, ValueCallback<Uri[]> filePathCallback, FileChooserParams fileChooserParams) {
81
uploadMessage = filePathCallback;
82
83
Intent intent = fileChooserParams.createIntent();
84
try {
85
myActivity.startActivityForResult(intent, REQUEST_SELECT_FILE);
86
} catch (ActivityNotFoundException e) {
87
Toast.makeText(myActivity, "Cannot open file chooser", Toast.LENGTH_LONG).show();
88
return false;
89
}
90
91
return true;
92
}
93
}
94
95
}
Copied!
Find here other widget parameters to customize your experience.

Layout

1
<?xml version="1.0" encoding="utf-8"?>
2
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
3
xmlns:app="http://schemas.android.com/apk/res-auto"
4
xmlns:tools="http://schemas.android.com/tools"
5
android:layout_width="match_parent"
6
android:layout_height="match_parent"
7
tools:context=".TiledeskActivity">
8
9
<WebView
10
android:id="@+id/tiledesk"
11
android:layout_width="match_parent"
12
android:layout_height="match_parent" />
13
14
</androidx.constraintlayout.widget.ConstraintLayout>
Copied!

Example

You can find here a complete Tiledesk Widget example for Android.
Last modified 2mo ago