大佬教程收集整理的这篇文章主要介绍了WKWebview 中的动态类型与设置不匹配，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。
我正在开发一个 SwiftUI iOS 应用程序，我有一个 WKWebVIEw 加载本地 HTML 文件和 CSS。我使用 -apple-system 和 iu-rounded 系列的 ui-sans-serif 字体，但是当我进入设置并将字体大小更改为更大的设置时，页面上的字体保持不变（动态类型不调整），即使重新启动应用程序后，字体也始终相同（应用程序的其余字体按预期更改）。
确实应用了字体系列，但没有应用大小。
我如何将 WKWebvIEw 添加到 SwiftUI：
import SwiftUI
import WebKit
struct WebVIEw : UIVIEwRepresentable {
func makeUIVIEw(context: Context) -> WKWebVIEw {
return WKWebVIEw()
}
func updateUIVIEw(_ uiVIEw: WKWebVIEw,context: Context) {
if let url = Bundle.main.url(forResource: "help",withExtension: "HTML") {
uiVIEw.loadfileURL(url,allowingReadAccessto: url.deletingLastPathComponent())
}
}
}
struct HelpVIEw: VIEw {
@Environment(\.presentationMode) var presentationMode: Binding<PresentationMode>
var body: some VIEw {
//some other stuff here (a Title and a dismiss button)
WebVIEw()
}
}
HTML：
<!DOCTYPE HTML>
<HTML lang="en">
<head>
<Meta charset="utf-8">
<Meta @R_403_6889@="vIEwport" content="wIDth=device-wIDth,initial-scale=1">
<Title>Help</Title>
<link rel="stylesheet" href="style.CSS">
</head>
<body>
<!-- A bunch of HTML here-->
<h2>Some headings</h2>
<p>And some text in paragraphs and Lists</p>
</body>
</HTML>
CSS：
:root {
color-scheme: light dark;}
--background:#ffffff;
--text: #212121;
--accent: #6C10EA;
}
HTML {
Font:-apple-system-body;
}
body {
background-color: var(--background);
line-height: 1.4;
Font-family: ui-sans-serif;
}
h2 {
Font:-apple-system-largeTitle;
Font-family:ui-rounded;
}
img {
max-wIDth: 100%;
}
@media screen and (prefers-color-scheme: dark) {
:root {
--background:#171619;
--text: #F3EBFF;
--accent: #9140FF;
}
}
如果有人遇到同样的问题，我可以通过将当前正文文本大小传递给 HTML 并将其设置为默认值来模拟它。只需确保您的其他字体使用相对字体大小 (em)，以便在您更改正文字体大小时它们会增加大小：
添加网页视图的代码：
import SwiftUI
import WebKit
struct WebView : UIViewRepresentable {
func makeUIView(context: Context) -> WKWebView {
return WKWebView()
}
func updateUIView(_ uiView: WKWebView,context: Context) {
let bodySize = UIFont.preferredFont(forTextStyle: UIFont.TextStyle.body).pointSize
if let url = Bundle.main.url(forResource: "help",withExtension: "html"),let param = URL(string: "?size=\(bodySize)",relativeTo: url) {
uiView.loadFileURL(param,allowingReadAccessTo: url.deletingLastPathComponent())
}
}
}
struct HelpView: View {
@Environment(\.presentationMode) var presentationMode: Binding<PresentationMode>
var body: some View {
// Other content here
WebView()
}
}
}
HTML：
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>Help</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<h2>Some Headings</h2>
<p>Some content</p>
<script>
const queryString = window.location.search;
const urlParams = new URLSearchParams(queryString);
const size = urlParams.get('size');
document.body.style.fontSize = size + "px";
</script>
</body>
</html>
以上是大佬教程为你收集整理的WKWebview 中的动态类型与设置不匹配全部内容，希望文章能够帮你解决WKWebview 中的动态类型与设置不匹配所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。