Swift WKWebView適配內容大小、暗黑、尾部追加文案

以加載htmlString爲例html

1、適配web

一、適配字體大小：app

let headerString : String = "<header><meta name='viewport' content='width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no'><style>img{max-width:100%}</style></header>" self.WK_webView.loadHTMLString(headerString + body , baseURL: nil)

二、尾部追加內容,如：免責聲明ide

func gethandleInfoContentwithTitle(title : String , body : String) -> String { return "<html><head><meta name=\"viewport\" content=\"width=device-width,initial-scale=1.0\"><style>html {width: 100%%;margin: 0;padding: 0;} body {width: 100%%;font-family: \"PingFangSC-Regular\", \"Helvetica Neue\", Helvetica, Arial, sans-serif;color: #555;font-size: 16px;margin: 0;padding: 0;} .wrapper { padding: 15px; } h2 { width: 100%%; display: block; } img {width: 100%%;display: block;} p { margin-bottom: 15px; line-height: 1.6 } .tip-declare { margin-top: 30px; color: #666; padding-bottom: 20px; } .declare-title { font-size: 14px; } .declare-text { color: #999999; font-family: \"PingFangSC-Regular\"; font-size: 13px; } </style> </head> <body> <div class=\"wrapper\"> <h2>%@</h2>%@<div class=\"tip-declare\"> <span class=\"declare-title\">[免責聲明]</span> <div class=\"declare-text\">本資訊信息來源於第三方機構，資訊中的內容和意見僅供參考，並不構成對所述證券買賣作出保證。投資者不該將本資訊做爲投資決策的惟一參考因素，亦不該以本資訊取代本身的判斷。在任何狀況下，本機構不對任何人因使用本平臺中的任何內容所引致的任何損失負任何責任。</div> </div> </div> </body> </html>" + title + body }

2、修改背景顏色 字體

1、lua

//首先修改wkwebview的底色spa

webview.scrollView.backgroundColor = UIColor.dy_color(lightColor: .white, darkColor: Background_dark)//適應暗黑模式 文章底部

//在加載完成後對文字顏色背景色進行修改scala

func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) { //字體顏色
self.SMML_webView.evaluateJavaScript("document.getElementsByTagName('body')[0].style.webkitTextFillColor= '#F8F8FF'", completionHandler: nil) //背景顏色 
 self.SMML_webView.evaluateJavaScript("document.body.style.backgroundColor=\"#1E1E1E\"", completionHandler: nil) }

二、適配暗黑模式的顏色code

須要監聽模式變化來改變htm

//監聽 暗黑模式變化
 override func traitCollectionDidChange(_ previousTraitCollection: UITraitCollection?) { super.traitCollectionDidChange(previousTraitCollection) if #available(iOS 13.0, *) { //判斷模式
 if traitCollection.userInterfaceStyle == .dark { changeTextBackgroundStyle() }else { changeTextBackgroundStyle(style: "light") } } }

// 設置字體背景 暗黑 白色
     func changeTextBackgroundStyle(style : String = "dark"){ if style == "dark" { //字體顏色
self.SMML_webView.evaluateJavaScript("document.getElementsByTagName('body')[0].style.webkitTextFillColor= '#F8F8FF'", completionHandler: nil) //背景顏色
 self.SMML_webView.evaluateJavaScript("document.body.style.backgroundColor=\"#1E1E1E\"", completionHandler: nil) }else{ self.SMML_webView.evaluateJavaScript("document.getElementsByTagName('body')[0].style.webkitTextFillColor= '#000000'", completionHandler: nil) self.SMML_webView.evaluateJavaScript("document.body.style.backgroundColor=\"#FFFFFF\"", completionHandler: nil) } }

3、對UIColor擴展適配暗黑模式

import UIKit extension UIColor { /// 動態顏色 /// - Parameter lightColor: lightMode Color /// - Parameter darkColor: darkMode Color

    static func dy_color(lightColor: UIColor, darkColor: UIColor) -> UIColor { var color: UIColor = lightColor if #available(iOS 13.0, *) { color = UIColor.init { (trainCollection: UITraitCollection) -> UIColor in

                if trainCollection.userInterfaceStyle == UIUserInterfaceStyle.dark { // 黑暗模式

                    return darkColor }else { // 其餘模式

                    return lightColor } } } return color } /// 動態顏色(16進制) /// - Parameter lightColor: lightMode Color /// - Parameter darkColor: darkMode Color

    static func dy_color(lightColor: Int, darkColor: Int) -> UIColor { var color = UIColor.gl_hex(hex: lightColor) if #available(iOS 13.0, *) { color = UIColor.init { (trainCollection: UITraitCollection) -> UIColor in

                if trainCollection.userInterfaceStyle == UIUserInterfaceStyle.dark { // 黑暗模式

                    return UIColor.gl_hex(hex: darkColor) }else { // 其餘模式

                    return UIColor.gl_hex(hex: lightColor) } } } return color } /// 16進制轉UIColor /// - Parameter hex: 16進制值 /// - Parameter alpha: 透明度

    static func gl_hex(hex: Int, alpha: CGFloat = 1.0) -> UIColor { return self.init(red:CGFloat(((hex & 0xff0000) >> 16)) / 255.0, green: CGFloat(((hex & 0xFF00) >> 8)) / 255.0, blue: CGFloat((hex & 0xFF)) / 255.0, alpha: alpha) } }