V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
exitoffline
V2EX  ›  iOS

如何在 SwiftUI 里面实现一个 List View,其中每个 List 项是一个 WKWebView

  •  
  •   exitoffline · 2020-08-09 14:12:55 +08:00 · 2204 次点击
    这是一个创建于 1567 天前的主题,其中的信息可能已经有所发展或是发生改变。

    我想在 SwiftUI 里面实现一个 List View,其中每一个 list 项就是一个 WKWebView 。就像一个论坛的帖子,每个跟帖就是一个 list 项目,每个跟帖的数据是一个 html 字符串,可能里面有图片或其他东西。

    但是我的代码实现(在最末尾是全部代码)加载速度超级慢。如果往下滑动,好多项目还没加载,如果再往上滑动,加载的项目也没有了。伴随有很多错误。就像这样的

    2020-08-08 22:44:15.493387-0700 WKWebViewTest[2205:76254] WF: === Starting WebFilter logging for process WKWebViewTest 2020-08-08 22:44:15.493682-0700 WKWebViewTest[2205:76254] WF: _userSettingsForUser : (null) 2020-08-08 22:44:15.493865-0700 WKWebViewTest[2205:76254] WF: _WebFilterIsActive returning: NO 2020-08-08 22:44:15.622585-0700 WKWebViewTest[2205:76254] WF: _userSettingsForUser : (null) 2020-08-08 22:44:15.622787-0700 WKWebViewTest[2205:76254] WF: _WebFilterIsActive returning: NO

    我不知道究竟如何才能实现这样一个功能。请大神赐教

    import SwiftUI
    import WebKit
    
    struct ContentView: View {
        init() {
            UITableView.appearance().separatorStyle = .none
            UITableViewCell.appearance().selectionStyle = .none
            UITableViewCell.appearance().backgroundColor = UIColor.clear
            UITableView.appearance().backgroundColor = UIColor.clear
        }
    
        let htmlText = "<p>This is the paragraph</p>"
        
        var body: some View {
            List{
                ForEach(0...20, id: \.self) { _ in
                    VStack {
                        PostWebView(text: self.htmlText)
                            .frame(height: 50)
                        Divider()
                    }
                }
            }
            .listRowInsets(.init(top: 0, leading: 0, bottom: 0, trailing: 0))
        }
    }
    
    struct ContentView_Previews: PreviewProvider {
        static var previews: some View {
            ContentView()
        }
    }
    
    struct PostWebView : UIViewRepresentable {
        let text: String
        
        init(text: String) {
            self.text = text
        }
    
        class Coordinator: NSObject, WKNavigationDelegate {
            var parent: PostWebView
    
            init(_ parent: PostWebView) {
                self.parent = parent
            }
        }
    
        func makeCoordinator() -> Coordinator {
            Coordinator(self)
        }
    
        func makeUIView(context: Context) -> WKWebView  {
            let webview = WKWebView()
            webview.scrollView.bounces = false
            webview.scrollView.isScrollEnabled = false
            webview.navigationDelegate = context.coordinator
            let htmlStart = "<HTML><HEAD><meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0, shrink-to-fit=no, maximum-scale=1.0, user-scalable=no\"></HEAD><BODY>"
            let htmlEnd = "</BODY></HTML>"
            let postHtml = text
            let htmlString = "\(htmlStart)\(postHtml)\(htmlEnd)"
            webview.loadHTMLString(htmlString, baseURL:  nil)
            return webview
        }
    
        func updateUIView(_ uiView: WKWebView, context: Context) {
        }
    }
    
    9 条回复    2020-08-10 05:04:41 +08:00
    mcluyu
        1
    mcluyu  
       2020-08-09 14:58:28 +08:00
    不太懂 swiftUI,但是 webview 是比较耗性能的控件,你同时加载一堆肯定是不行的,你倒不如直接用一个 webview 加载 HTML 来实现你要的 list view 效果得了。
    imaning
        2
    imaning  
       2020-08-09 16:16:05 +08:00
    你为什么不把 html 放服务器上,然后去请求 URL?
    yov123456
        3
    yov123456  
       2020-08-09 21:09:52 +08:00
    html 也能渲染成 uilabel 或者有很多类似 yytext 的库能处理 不需要 webview
    leschans
        4
    leschans  
       2020-08-10 02:57:13 +08:00 via iPhone
    不太熟 ListView 但是你可以参考一下官方 SwiftUI 教程,里面似乎有提到这种
    exitoffline
        5
    exitoffline  
    OP
       2020-08-10 04:51:46 +08:00 via iPhone
    @yov123456 谢谢,我去研究一下。不光是显示富文本,yytext 也能显示图片吗
    exitoffline
        6
    exitoffline  
    OP
       2020-08-10 04:52:23 +08:00 via iPhone
    @mcluyu 谢谢,可能是耗资源太多,不能好多个一起用
    exitoffline
        7
    exitoffline  
    OP
       2020-08-10 04:54:22 +08:00 via iPhone
    @imaning 这是可行,但我主要还是想很多类型的 view 混排,不仅仅只是显示 webview
    exitoffline
        8
    exitoffline  
    OP
       2020-08-10 04:54:46 +08:00 via iPhone
    @leschans 我去看看,但好像官方没有这种说明
    exitoffline
        9
    exitoffline  
    OP
       2020-08-10 05:04:41 +08:00 via iPhone
    @yov123456 或者更进一步显示内嵌的可播放的视频。yytext 可能不支持 swiftui
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   1278 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 36ms · UTC 17:59 · PVG 01:59 · LAX 09:59 · JFK 12:59
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.