Мобильная версияУ меня есть простой код, который извлекает два изображения. Первое изображение загружается из JavaScript, а второе изображение загружается из элемента html. Из-за процессов загрузки изображение HTML загружается быстрее, а обнаружение и отображение JavaScript в пользовательском интерфейсе занимает около 4–5 секунд. Теперь, как бы я реализовал индикатор прогресса, чтобы он продолжал показывать статус загрузки до тех пор, пока оба изображения не появятся и не будут готовы к отображению в пользовательском интерфейсе. Я попробовал, но он всегда загружается преждевременно, нарушая прогресс загрузки.
Здесь, в прямоугольнике, мне нужен заполнитель для индикатора прогресса:
Полный PoC-код:
импортировать SwiftUI импортировать WebKit структура ContentView: Просмотр { @StateObject частная var viewModel = WebViewModel() var body: some View { ВСтек { HStack { // Отображение изображения профиля пользователя если let userProfilePicURL = viewModel.content.userProfilePic, пусть url = URL (строка: userProfilePicURL) { AsyncImage(url: url) {изображение в изображение .изменяемый размер() .scaledToFill() .frame(ширина: 100, высота: 100) .clipShape(RoundedRectangle(cornerRadius: 10)) } заполнитель: { ПрогрессВью() .frame(ширина: 100, высота: 100) } } еще { Текст("Нет изображения профиля") .frame(ширина: 100, высота: 100) } // Отображение миниатюры изображения если пусть imageThumbnailURL = viewModel.content.imageThumbnail, пусть url = URL (строка: imageThumbnailURL) { AsyncImage(url: url) {изображение в изображение .изменяемый размер() .scaledToFill() .frame(ширина: 100, высота: 100) .clipShape(RoundedRectangle(cornerRadius: 10)) } заполнитель: { ПрогрессВью() .frame(ширина: 100, высота: 100) } } еще { Текст("Нет миниатюры") .frame(ширина: 100, высота: 100) } } .padding() Разделитель() Кнопка("Загрузить") { viewModel.loadPage(urlString: "https://www.instagram.com/p/CzAIEVDLJOZ/") } .padding() } } } структура WebViewContent { вар userProfilePic: String? var imageThumbnail: String? } класс WebViewModel: ObservableObject { @Published var content = WebViewContent() func loadPage (urlString: String) { охранник пусть URL = URL (строка: urlString) еще {возвращение} пусть запрос = URLRequest (url: URL) webView.load (запрос) } ленивый вар webView: WKWebView = { пусть webView = WKWebView() webView.navigationDelegate = координатор вернуть веб-представление }() ленивый координатор var: Координатор = { Координатор (сам) }() } Координатор класса: NSObject, WKNavigationDelegate { частный родительский вар: WebViewModel частный вар userProfilePicRetries = 3 init (_ родитель: WebViewModel) { self.parent = родительский } func webView(_ webView: WKWebView, DidFinish Navigation: WKNavigation!) { fetchContent (веб-просмотр) } частный let userProfilePicScript = "var img = document.querySelector('header img.xpdipgo.x972fbf'); img ? img.getAttribute('src') : null;" частный let imageThumbnailScript = "document.querySelector('meta[property=\"og:image\"]').getAttribute('content')" func fetchContent (_ webView: WKWebView) { fetchUserProfilePic (webView) webView.evaluateJavaScript(imageThumbnailScript) { (результат, ошибка) в если let value = результат как? Нить { self.parent.content.imageThumbnail = значение } } } func fetchUserProfilePic (_ webView: WKWebView) { webView.evaluateJavaScript(userProfilePicScript) { (результат, ошибка) в если let value = результат как? Нить { self.parent.content.userProfilePic = значение } else if self.userProfilePicRetries > 0 { DispatchQueue.main.asyncAfter(deadline: .now() + 3) { self.userProfilePicRetries -= 1 self.fetchUserProfilePic(webView) } } } } } структура ContentView_Previews: PreviewProvider { статические предварительные просмотры var: some View { КонтентПросмотр() } }
