2021年3月31日星期三

WKWebView inside a StackView not re-sizing correctly

I have a TableView and in one of it's cells I have a StackView with a WKWebView inside of it. I am trying to re-size the WKWebView dynamically, and it works as it should when the view's height needs to be bigger than the previous height, but if I need to reduce the height, it doesn't adjust.

The content inside this cell is refreshed via the ViewModel function configure:

class AboutTableViewCell: UITableViewCell {      weak var delegate: AboutTableViewCellDelegate?          let aboutStackView: UIStackView = {          let sv = UIStackView()          sv.axis = .vertical          sv.distribution = .equalSpacing          sv.translatesAutoresizingMaskIntoConstraints = false          sv.spacing = 6          return sv      }()        let descriptionLabel: UILabel = {          let label = UILabel()          label.font = UIFont.customRobotoBold18          label.text = DESCRIPTION_LABEL_TEXT          label.translatesAutoresizingMaskIntoConstraints = false          return label      }()        let webview: WKWebView = {          var webview = WKWebView()          webview.isOpaque = true          webview.translatesAutoresizingMaskIntoConstraints = false          webview.scrollView.isScrollEnabled = false          return webview      }()        required init?(coder aDecoder: NSCoder) {          super.init(coder: aDecoder)      }        override init(style: UITableViewCell.CellStyle, reuseIdentifier: String?) {          super.init(style: style, reuseIdentifier: reuseIdentifier)          self.contentView.isUserInteractionEnabled = true          newCommentTextView.delegate = self          webview.navigationDelegate = self            addSubviews()          configure()          setupAutoLayout()      }        private func addSubviews() {          self.contentView.addSubview(aboutStackView)          aboutStackView.addArrangedSubview(descriptionLabel)          webViewHeightConstraint = webview.heightAnchor.constraint(equalToConstant: 1.0)          webViewHeightConstraint?.isActive = true          aboutStackView.addArrangedSubview(webview)      }        private func setupAutoLayout() {          NSLayoutConstraint.activate([              aboutStackView.topAnchor.constraint(equalTo: contentView.topAnchor, constant: 10),              aboutStackView.leadingAnchor.constraint(equalTo: contentView.leadingAnchor, constant: 10),              aboutStackView.trailingAnchor.constraint(equalTo: contentView.trailingAnchor, constant: -10),              aboutStackView.bottomAnchor.constraint(equalTo: contentView.bottomAnchor, constant: -10)          ])      }        private func configure() {          self.contentView.clipsToBounds = true          guard let session = RefreshToken.shared.session else {              return          }          self.contentView.backgroundColor = .mainBackgroundColor      }  }  

Here is the extension used to perform the height change after the loadHTMLString is triggered:

extension AboutTableViewCell: WKNavigationDelegate {      func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) {          webView.evaluateJavaScript("document.readyState", completionHandler: { result, error in                if result == nil || error != nil {                  return              }                webView.evaluateJavaScript("document.body.offsetHeight", completionHandler: { result, error in                  if let height = result as? CGFloat {                      self.webViewHeightConstraint?.constant = height                  }              })          })      }  }  

And here is the view Model used to populate the content:

class AboutViewModel {       private var rawHTML: String?       init(html: String) {         rawHTML = html     }        func configure(with cell: AboutTableViewCell) {          self.cell = cell            if let raw = self.rawHTML {              let headerString = "<head><meta name='viewport' content='width=device-width, initial-scale=0.7, maximum-scale=0.7, minimum-scale=0.7, user-scalable=no'/><link rel=\"preconnect\" href=\"https://fonts.gstatic.com\"><link href=\"https://fonts.googleapis.com/css2?family=Roboto&display=swap\" rel=\"stylesheet\"><style>a:link {color: #ffc000;text-decoration: none;}body{font-family: 'Roboto', sans-serif;}</style>"                        let finalHTML = raw.replacingOccurrences(of: "/data/", with: "https://" + NetworkService.HostName + "/data/").replacingOccurrences(of: "<pre>", with: "<small style='word-wrap:break-word;color:rgba(0,0,0,0.4);'>").replacingOccurrences(of: "</pre>", with: "</small>")                        cell.webview.loadHTMLString(headerString + finalHTML, baseURL: nil)          }      }  }  

Any ideas on why my content is not shrinking when the content requires it? As I mentioned it does work when the height needs to be expanded.

https://stackoverflow.com/questions/66897129/wkwebview-inside-a-stackview-not-re-sizing-correctly April 01, 2021 at 08:56AM

没有评论:

发表评论