support - wkwebview navigation swift

Cómo crear un WKWebView de tamaño en Swift 3/iOS 10

Question

Estoy intentando agregar un WKWebView a mi aplicación que ocupa aproximadamente ~ 2/3 de la pantalla (dejando espacio en la parte inferior). Como parece que no hay forma de agregar WKWebView al guión gráfico, agregué un UIView regular. Luego, en mi método viewDidAppear trato de crear un WKWebView con los mismos límites. ¿Es este un enfoque sensato?

Mi código se ve así:

 @IBOutlet var conversationView: UIView!
override func viewDidAppear(_ animated: Bool) {
let webView = WKWebView(frame: conversationView.frame)
if let url = URL(string: "https://www.google.com") {
webView.load(URLRequest(url: url))
}
// conversationView = webView // <-- doesn''t work :/
conversationView.addSubview(webView) // works!
}

El intercambio directo de las vistas no funciona del todo, así que en su lugar agrego la vista web como una subvista de la vista temporal que agregué al guión gráfico. Esto al menos me permite restringir su posición y tamaño, pero aún así se siente muy pesado y debe haber una mejor manera de hacerlo.

Answer 1

Si desea dar restricciones de ese tamaño y posicionar la vista web con respecto a su vista de contenedor, puede hacer esto.

 @IBOutlet weak var wkWebBackgroundView: UIView!
var wkWebView:WKWebView!
override func viewDidLoad() {
super.viewDidLoad()
setUpView()
}
func setUpView(){
self.wkWebView = WKWebView(frame: CGRect.zero)
self.wkWebBackgroundView.addSubview(wkWebView)
let height = NSLayoutConstraint(item: wkWebView, attribute: .height, relatedBy: .equal, toItem: wkWebBackgroundView, attribute: .height, multiplier: 1, constant: 0)
let width = NSLayoutConstraint(item: wkWebView, attribute: .width, relatedBy: .equal, toItem: wkWebBackgroundView, attribute: .width, multiplier: 1, constant: 0)
let top = NSLayoutConstraint(item: wkWebView, attribute: .top, relatedBy: .equal, toItem: wkWebBackgroundView, attribute: .top, multiplier: 1, constant: 0)
let leading = NSLayoutConstraint(item: wkWebView, attribute: .leading, relatedBy: .equal, toItem: wkWebBackgroundView, attribute: .leading, multiplier: 1, constant: 0)
view.addConstraints([leading, top, height, width])
}

Answer 2

Ese es un muy buen enfoque; es perfectamente razonable tener una "vista de contenido" cuyo trabajo es meramente guiar la vista web en su lugar, por así decirlo. Pero sería aún mejor agregar la vista web más las restricciones de ese tamaño y posición.

Answer 3

Puede simplemente dimensionar el marco de la vista web como desee sin usar una vista diferente.

let webView = WKWebView(frame: CGRect(x: 0, y: 0, width: view.bounds.width, height: view.bounds.height * 0.66).integral)
view.addSubview(webView)

Sin embargo, si necesita la vista en el guión gráfico para alinear otras restricciones de subvista, entonces su método funciona bien.

Editar: Acabo de ver tu captura de pantalla añadida con un comentario que indica que la vista está debajo de una etiqueta:

let webView = WKWebView(frame: CGRect(x: label.frame.maxX + (whatever distance you want between label bottom and webView top), y: 0,
width: view.bounds.width, height: view.bounds.height * 0.66).integral)
view.addSubview(webView)

Answer 4

Ninguna de las otras respuestas funcionó para mí. La respuesta de Samip Shah está en el camino correcto, pero las restricciones no son del todo correctas. Lo importante para recordar es establecer traduceAutlasizingMaskIntoConstraints a falso.

Entonces, aquí está mi solución. En el guión gráfico, cree una UIView con las restricciones y el diseño que desee para WKWebView. En su controlador de vista, agregue el código:

@IBOutlet var contentView: UIView!
var wkWebView:WKWebView!
override func viewDidLoad() {
super.viewDidLoad()
wkWebView = WKWebView(frame:contentView.frame)
contentView.addSubview(wkWebView)
constrainView(view: wkWebView, toView: contentView)
let request = URLRequest(url: /* your url here */)
wkWebView.load(request)
}

El código para restringir la vista. Puede agregar esto a una clase de utilidades si desea usarlo más de un controlador de vista.

func constrainView(view:UIView, toView contentView:UIView) {
view.translatesAutoresizingMaskIntoConstraints = false
view.leadingAnchor.constraint(equalTo: contentView.leadingAnchor).isActive = true
view.topAnchor.constraint(equalTo: contentView.topAnchor).isActive = true
view.trailingAnchor.constraint(equalTo: contentView.trailingAnchor).isActive = true
view.bottomAnchor.constraint(equalTo: contentView.bottomAnchor).isActive = true
}