Share This
Связаться со мной
Крути в низ
Categories
//Взаимодействие SwiftUI с вебом. Часть первая: WebView

Взаимодействие SwiftUI с вебом. Часть первая: WebView

Рутинная задача, без которой не обходится ни один проект – взаимодействие нативных приложений iOS со всемирной паутиной. В первой статье цикла разбираемся, как загружать веб-приложения в SwiftUI Views. СПОЙЛЕР: дальше будут рассмотрены более сложные темы. Обсудить

vzaimodejstvie swiftui s vebom chast pervaja webview a384ec1 - Взаимодействие SwiftUI с вебом. Часть первая: WebView

Поскольку в SwiftUI еще нет своего элемента WebView, мы будем использовать WKWebView, который прекрасно справится с загрузкой веб-приложения или сайта.

В этом цикле статей мы рассмотрим следующие темы:

  1. Как сделать WebView с помощью WKWebView и протокола UIViewRepresentable в SwiftUI.
  2. Загрузить веб сайт или веб-приложение в WebView.
  3. Взаимодействовать между нативным iOS приложением и web-приложением через функции JavaScript.
  4. Перехватывать каждый переход (навигацию) веб-сайта или веб-приложения в приложении iOS.
  5. Перезагружать WebView и осуществлять переход вперед и назад.
  6. Загружать локальный файл .html из iOS-проекта в WebView

Проект доступен на Github. Добавляйте его в закладки, чтобы следить за изменениями. Шаг за шагом мы будем реализовывать новую функциональность. Коммиты ответствуют заголовкам в статье, в которых приведены примеры кода.

Создаем свой WebView

Пару слов о UIViewRepresentable

Протокол UIViewRepresentable – это обертка для UIKit View, благодаря которой мы можем интегрировать любую View из UIKit.

Процесс адаптации прост и занимает четыре шага:

  1. Создаем структуру которая реализует протокол UIViewRepresentable.
  2. Определяем необходимые свойства для своей View и т.п.
  3. В функции makeUIView() возвращаем любой UIView объект.
  4. В функции updateUIView() обновляем View.

Вот и все, теперь вы можете использовать свой View в SwiftUI.

Вот небольшой скелет обертки:

         struct myView: UIViewRepresentable {      func makeUIView(context: Context) -> some UIView {         // Return the UIView object     }      func updateUIView(_ uiView: some UIView, context: Context) {         // Update the view     } }     

Также, для взаимодействия между UIKit и SwiftUI View вам может потребоваться написать класс Coordinator.

struct WebView

Создадим структуру WebView, но прежде проведем небольшую подготовку:

  1. Зададим действия для определения веб-навигации (вперед, назад и перезагрузка).
  2. Опишем типы загружаемых URL (локальный файл, публичный адрес).

WebViewNavigationAction.swift

         enum WebViewNavigationAction {     case backward, forward, reload }     

URLType.swift

         enum URLType {     case local, `public` }     

Поскольку проект будет расти, мы сразу создадим группу Web и будем добавлять туда все связанное с вебом. Я создал для каждого перечисления отдельный файл.

Отлично! Мы подготовились и изучили базовые моменты. Теперь давайте проверим все на примере и напишем наш WebView. WebView.swift

         import Foundation import SwiftUI import Combine import WebKit import UIKit  struct WebView: UIViewRepresentable {          var type: URLType     var url: String?          func makeUIView(context: Context) -> WKWebView {         let preferences = WKPreferences()                  let configuration = WKWebViewConfiguration()         configuration.preferences = preferences                  let webView = WKWebView(frame: CGRect.zero, configuration: configuration)                  webView.allowsBackForwardNavigationGestures = true         webView.scrollView.isScrollEnabled = true         return webView          }          func updateUIView(_ webView: WKWebView, context: Context) {         if let urlValue = url  {             if let requestUrl = URL(string: urlValue) {                 webView.load(URLRequest(url: requestUrl))             }         }     } }     

Добавим WebView в ContentView и протестируем созданный код.

vzaimodejstvie swiftui s vebom chast pervaja webview e282cf8 - Взаимодействие SwiftUI с вебом. Часть первая: WebView

В следующей части цикла мы научим WebView взаимодействовать со SwiftUI, и напишем несложный интерфейс для веб-навигации.

Happy code!

Дополнительные материалы:

  • Как начать разрабатывать iOS-приложения с нуля;
  • 5 навыков, необходимых iOS-разработчику;
  • Как начинающему iOS-разработчику успешно пройти собеседование.

  • 13 views
  • 0 Comment

Leave a Reply

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

Этот сайт использует Akismet для борьбы со спамом. Узнайте, как обрабатываются ваши данные комментариев.

Свежие комментарии

    Рубрики

    About Author 01.

    blank
    Roman Spiridonov

    Моя специальность - Back-end Developer, Software Engineer Python. Мне 39 лет, я работаю в области информационных технологий более 5 лет. Опыт программирования на Python более 3 лет. На Django более 2 лет.

    Categories 05.

    © Speccy 2020 / All rights reserved

    Связаться со мной
    Close