it-swarm.com.ru

сделать WKWebview "настоящим" полноэкранным на iPhone X (удалить безопасную область из WKWebView

Я пытаюсь реализовать «настоящий» полноэкранный режим в приложении WebView, то есть я хочу, чтобы веб-контент полностью ушел в никуда, несмотря ни на что.

Это текущая ситуация, с которой я сталкиваюсь при формировании WebView в границах суперпредставлений:  wkwebview on iPhone X Красная граница - это граница веб-вида (также размер экрана). Твиттер имеет 100% высоту и ширину на теле.

Я понимаю, что веб-сайты не могут иметь ширину 100% в Safari и что поведение по умолчанию в браузере приложений учитывает safearea, но особенно в моем случае, когда веб-страницы несколько разработаны для приложения, мне нужно использовать полную пространство.

Я не мог понять, как настроить веб-просмотр, чтобы придать его контенту полный размер. Есть ли способ изменить safearea?

Фрагмент кода:

private var webView : WKWebView!

override func viewDidLoad() {
    super.viewDidLoad()

    self.webView = WKWebView(frame: .zero)

    self.webView.layer.borderColor = UIColor.red.cgColor
    self.webView.layer.borderWidth = 2

    self.webView.load(URLRequest(url: URL(string: "https://www.Twitter.com")!))

    self.view.addSubview(self.webView)
}

override func viewDidLayoutSubviews() {
    self.webView.frame = self.view.bounds
}
7
j0h4nn3s

После небольшой попытки и ошибки, это решение, которое я придумала . Подкласс WKWebView и создаю собственный класс. Перезаписать safeAreaInsets:

import Foundation
import WebKit

class FullScreenWKWebView: WKWebView {
    override var safeAreaInsets: UIEdgeInsets {
        return UIEdgeInsets(top: 0, left: 0, bottom: 0, right: 0)
    }
}
24
j0h4nn3s

Вместо этого используйте ограничения AutoLayout:

NSLayoutConstraint.activate([
    webView.topAnchor.constraint(equalTo: view.topAnchor),
    webView.bottomAnchor.constraint(equalTo: view.bottomAnchor),
    webView.leftAnchor.constraint(equalTo: view.leftAnchor),
    webView.rightAnchor.constraint(equalTo: view.rightAnchor)
])

Не забудьте добавить viewport-fit=cover к метатегу области просмотра вашей веб-страницы и использовать новые переменные Safari для добавления отступов к своему контенту, чтобы убедиться, что он учитывает безопасные области.

/* iOS 11 */
constant(safe-area-inset-*);
/* iOS 11.2 */
env(safe-area-inset-*);

Правка

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

webView.evaluateJavascript("document.querySelector('meta[name=viewport]').content = document.querySelector('meta[name=viewport]').content + ', viewport-fit=cover'", completionHandler: nil)

Кстати, это для использования в WKWebView, и вам нужно будет выполнить его после того, как веб-страница явно загрузится. Также, вероятно, следует выполнить некоторую обработку ошибок, так как это вызовет исключение, если метатег с именем viewport отсутствует, а содержимое будет , viewport-fit=cover, если содержимое пустое для начала.

5
Anders

Вы также можете расширить safeAreaInsets из WKWebView. 

extension WKWebView {
    override open var safeAreaInsets: UIEdgeInsets {
        return UIEdgeInsets(top: 0, left: 0, bottom: 0, right: 0)
    }
}
2
quemeful