Работа с WebView в Android: пример и описание возможностей | Prologistic.com.ua

Работа с WebView в Android: пример и описание возможностей

В Android есть несколько способов отображения HTML-страниц в вашем приложении. Наиболее эффективным способом является использование виджета Android WebView — о нем мы сегодня и поговорим.

Компонент WebView в Android представляет собой полноценный браузер, который реализован как подкласс View, поэтому мы с легкостью можем встроить его в наше приложение на Android.

Подробно о WebView в Android: что, как и почему

Чаще всего для работы с простыми html-страницами используется виджет TextView. В этом случае мы можем реализовать статический метод fromHtml(), который принадлежит утилитному HTML классу для парсинга строк с html кодом и дальнейшим его отображением в TextView.

Виджет TextView обеспечивает простое форматирование для стилей (жирный, курсив), шрифтов, различным цветов, гиперссылок и т.д.

Однако со сложным форматированием и большим объемом HTML-страниц виджет TextView справиться уже не в состоянии. Например, работать с такими функциональными и объемными сайтами, как Facebook или другие соц сети через TextView уже не получится.

В таких случаях на помощь приходит WebView, так как только он может обрабатывать большие обхемы и множество HTML-тегов. Виждет WebView также может работать с CSS и JavaScript, которые метод Html.fromHtml() бы просто проигнорировал.

WebView также обеспечивает работу с историей посещений и навигацией назад и вперед по страницам.

Тем не менее WebView также имеет целый набор недостатков: с точки зрения эффективности потребления памяти он значительно уступает TextView. Причиной большого потребления памяти WebView является веб-движок рендеринга контента WebKit/Blink, который еще используется в таких браузерах, как Chrome.

Руководство по работе с WebView

Ниже представлен пример работы с макетом, установкой виджета в коде и обзор наиболее полезных методов при работе с WebView в Android.

1. Установка WebView в макете

Компонент WebView вставляется в тот файл XML-макета, где мы хотим видеть виджет WebView. Давайте создадим простой Hello World проект на Android и посмотрим его работу в макете activity_main.xml:

2. Инициализируем Android WebView в коде

Компонент WebView инициализируется в классе MainActivity , с помощью идентификатора, ранее определенного в activity_main.xml:

3. Используем метод loadUrl()

После того, как мы получили ссылку на WebView, мы можем загрузить какой-то сайт с помощью протокола HTTP. Метод WebView loadUrl() используется для загрузки каких-либо URL в компонент WebView, например:

Прежде чем мы начнем изучать WebView дальше, есть два важных момента, которые нельзя упустить из вида:

  • Поддержка JavaScript: JavaScript по умолчанию выключен в Webview. Следовательно, веб-страницы, содержащие JavaScript не будут работать должным образом. Чтобы его включить, используйте следующих фрагмент кода:
  • Добавление разрешений: чтобы загрузить ссылку в WebView, нам нужно добавить разрешение на доступ в Интернет в AndroidManifest.xml нашего приложения:
Ниже представлен код класса MainActivity со всеми указанными выше замечаниями:

Установка WebViewClient

Установка WebViewClient нужна для того, чтобы пользователь нажимал на ссылку внутри веб-страницы нашего приложения и эта ссылка открывалась в нашем приложении, а не браузером по умолчанию.

Чтобы сохранить навигацию по ссылкам в нашем приложении с WebView, мы должны создать подкласс WebViewClient и переопределить метод shouldOverrideUrlLoading (WebView webView, String url). Давайте рассмотрим простой пример подкласса WebViewClient

Здесь мы видим, что метод shouldOverrideUrlLoading() возвращает false. Это означает, что по нажатию на ссылку откроется вкладка внутри нашего приложения, а не стандартного браузера.

А теперь давайте изменим наше приложение так, чтобы оно открывало только ссылки сайта http://javadevblog.com, а по нажатию на ссылки других сайтов — спрашивало каким браузером воспользоваться.

Для этого в методе shouldOverrideUrlLoading() нужно добавить всего лишь одно условие:

Навигация внутри Android WebView: нажатие кнопок вперед и назад

Если в разрабатываемом нами приложении нажать кнопку назад, то мы увидим, что приложение возвращается в главный экран, даже если мы осуществлять навигацию через несколько страниц внутри самого WebView. Чтобы использовать историю просмотра ссылок внутри WebView при нажатии кнопки назад, мы должны изменить переопределить функцию этой кнопки:

Мы переопределили метод onKeyDown() и теперь он сначала проверяет, что WebView может вернуться на предыдущую ссылку, потому что WebView поддерживает историю просмотра как обычный браузер. Если в истории ссылок нет, то нажатие на кнопку назад будет работать по умолчанию, то есть выходить из приложения.

Ниже весь код MainActivity с указанными выше функциями:

Теперь запустите ваше приложение и переходите по ссылкам внутри сайта. Вы увидите, что все переходы происходят внутри приложения:

webview android prologistic.com.ua

А все нажатия на ссылки, которые ведут на другие сайты спрашивают каким приложением открыть ссылку:

webview android prologistic.com.ua 2

Загрузка контента в WebView: источники и способы

Кроме перехода по ссылкам в WebView есть еще несколько способов загрузить контент, который предоставляется по средствам вызова метода loadUrl():

  • Метод работает с указанием префикса к ссылке http:// и https://
  • А также: file://путьКфайлу — открывает локальный файл
  • file:///android_asset/ — открывает файл, который находится в папке assets вашего приложения
  • content:// — работает с ContentProvider для получения контента.

Также есть метод  loadData(), который принимает в параметры строку с html-кодом, например:

Компонент WebView располагает большим количество методов для работы со ссылками, историей и другими элементами, однако мы рассмотрели наиболее используемые и полезные методы. Также мы написали небольшое приложение, которое открывает внутри себя только ссылки сайта http://javadevblog.com и спрашивает чем открыть ссылки на другие сайты.

Скачать исходный код проекта.

Если статья была Вам полезна, подписывайтесь на новые статьи по Android и Java — впереди Вас ждет много интересных и полезных статей по современной разработке!

8 Комментарии “Работа с WebView в Android: пример и описание возможностей

  1. а можно полностью обьядиняюший код примера а то ошибки когда последний код вставляю Error:(22, 53) error: cannot find symbol class SimpleWebViewClientImpl

  2. При работе только с WebView выдает следующую ошибку при наведении на любую строку с «WebView»: <>. Весь код делал как у вас, все переменные, разрешения прописаны.

    1. Сама ошибка: Cannot resolve symbol WebView. даже в строчке private WebView webView тоже выдает эту ошибку.

      1. Здравствуйте! Скорее всего Ваш проект еще не собран, попробуйте воспользоваться кнопкой Build в среде разработки Android Studio и затем запустить с помощью кнопки Run на устройстве или эмуляторе.

        1. Попробовал. В логе выдает три одинаковые ошибки — error: cannot find symbol class WebView. Указывает на именно те строчки, где прописано WebView. Не компилируется только файл MainActivity.java, все остальное вроде работает.

  3. Кое-что изменилось. Ошибки пропали, но теперь вместо отображения html страницы из интернета белый экран. Помогите пожалуйста, как исправить

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *