Как подружить Android и WebView ?

17.10.2019

Как сделать, чтоб JavaScript передал данные Java, и принимал данные с Java

Визуально посмотреть, как создать веб приложение на андройд

Открываем андройд студио

Удаляем хеллоу ворлд, и из виджетов перетаскиваем вебвью

Сверху выбираем вкладку MainActivity.java и внутри protected void onCreate(Bundle savedInstanceState) добавить кодец

Если мы хотим создать приложение с ссылкой на сайт в сети, то добавляем этот код

WebView webView = (WebView) findViewById(R.id.web1);
webView.loadUrl("https://joyeshop.ru");

Только при использовании интернета, в манифест обязательно добавляем строчку

<uses-permission android:name="android.permission.INTERNET"></uses-permission>

Перед открытием <application , наглядно показал на скрине

А если мы хотим создать, чтоб веб страницы находились локально, то

webView.loadUrl("file:///android_asset/index.html");

А в манифест прописать
<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION"></uses-permission>

Добавим само место для хранения файлов сайта, для этого создадим папку. По java(в левой колонке), нажимаем правую кнопку мыши, new > folder > Assets Folder > ok

Мы создали эту папку. И если в ней создать index.html и вставить в путь

webView.loadUrl("file:///android_asset/index.html");

То эта страница откроется.

Для проверки в index.html напишем код с JS

<button onclick="document.getElementById('dd').innerHTML='test5';">555</button>
<div id="dd">1</div>

Для работы javaScript на странице, после объявления переменной WebView webView, сразу добавим

WebSettings webSettings = webView.getSettings();
webSettings.setJavaScriptEnabled(true);
webSettings.setDomStorageEnabled(true);

Ещё несколько примеров вывода в web

WebView webView = findViewById(R.id.WebView);

// Пример 1: задать URL адрес
webView.loadUrl("https://android-tools.ru");

// Пример 2: задать HTML-файл из папки raw
webView.loadUrl("file:///Android_res/raw/some_file.HTML");

// Пример 3: задать HTML-файл из папки assets
webView.loadUrl("file:///Android_asset/some_file.HTML");

// Пример 4: задать содержимое HTML в виде строки
String rawHTML = ""+ "<h1>HTML content</h1>"+ "";
webView.loadData(t_html, "text/html; charset=UTF-8", null);

Передача с Java в JavaScript

При нажатии на кнопку, либо на какое либо действие добавляем

myWebView.loadUrl("javascript:document.getElementById('dd').innerHTML='Hi I java';");

Передача с JavaScript в Java

Создаём класс JavaScriptInterface

В нём к примеру кодец

public class JavaScriptInterface {
    Context mContext;

    JavaScriptInterface(Context c) {
        mContext = c;
    }

    @JavascriptInterface
    public void showToast(String toast) {
        Toast.makeText(mContext, toast, Toast.LENGTH_SHORT).show();
    }
}

В нашем классе майнАктивити, После объявления веб, добавляем

webView.addJavascriptInterface(new JavaScriptInterface(this), "javaF");

А на самой web странице

<button onclick="document.getElementById('dd').innerHTML='test5';">555</button>
<div id="dd">1</div>
<button onclick="javaF.showToast('Hi I JavaScript to java');">777</button>

//В главном майн активити получилось

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        WebView webView = (WebView) findViewById(R.id.web1);
        WebSettings webSettings = webView.getSettings();
        webSettings.setJavaScriptEnabled(true);
        webSettings.setDomStorageEnabled(true);

        webView.addJavascriptInterface(new JavaScriptInterface(this), "javaF");
        //webView.loadUrl("https://joyeshop.ru");
        webView.loadUrl("file:///android_asset/index.html");
    }
}

Это и есть примеры общения java и javaScript, как в одну сторону, так и в другую.