I am currently doing a project to convert website to ios application and successfully created it. The only problem is that the application can be zoom in and out. One more thing, whenever any form is click, the form will be zoomed. I am new to xcode (1 week of knowledge) pls guide me. Thanks!
Below is my current code.
WebView.swift
import SwiftUI
import WebKit
import UIKit
class ViewController: UIViewController{
override func viewDidLoad() {
super.viewDidLoad()
}
}
struct SwiftUIWebView: UIViewRepresentable {
let url: URL?
func makeUIView(context: Context) -> WKWebView {
let prefs = WKWebpagePreferences()
prefs.allowsContentJavaScript = true
let config = WKWebViewConfiguration()
config.defaultWebpagePreferences = prefs
return WKWebView(
frame: .zero,
configuration: config
)
}
func updateUIView(_ uiView: WKWebView, context: Context) {
guard let myURL = url else {
return
}
let request = URLRequest (url: myURL)
uiView.load(request)
}
}
ContentView.swift
import SwiftUI
struct ContentView: View {
var body: some View {
NavigationView{
SwiftUIWebView(url: URL(string: "THE URL"))
.navigationTitle("NAVIGATION NAME")
}
}
}
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}
Related
I'm new to SwiftUI and trying to inject some custom CSS/JS into a page loaded with WKWebView:
import SwiftUI
import WebKit
struct WebView: UIViewRepresentable {
func makeUIView(context: Context) -> WKWebView {
return WKWebView()
}
func updateUIView(_ webView: WKWebView, context: Context) {
let request = URLRequest(url: URL(string: "https://example.com")!)
WKWebsiteDataStore.default().removeData(ofTypes: [WKWebsiteDataTypeDiskCache, WKWebsiteDataTypeMemoryCache], modifiedSince: Date(timeIntervalSince1970: 0), completionHandler:{ })
webView.load(request)
webView.configuration.userContentController.addUserScript(WKUserScript( source: "alert('debug')", injectionTime: .atDocumentEnd, forMainFrameOnly: true))
}
}
Which is load like this:
struct ContentView: View {
var body: some View {
WebView()
}
}
Sadly, the code doesn't seem to actually inject anything. I've tried running it before webView.load as well. Having been googling quite a bit, I only see examples done in UIKit and unfortunately, I'm too inexperienced to wrap UIKit in a way that I can use with SwiftUI.
Any guidance would be greatly appreciated.
First of all try to avoid including business code in your views whenever you can. You may use two functions in the Webkit API if you want to include/inject JS to the webview content: EvaluateJS and AddUserScript. You may use "AddUserScript" before the "load" starts. Also please not that "alert" function in JS, would not work in current Mobile Safari. You should have see the text colors to appear in blue with the script below.
Result:
import SwiftUI
import WebKit
struct ContentView: View {
var body: some View {
VStack {
CustomWebview()
}
.padding()
}
}
struct SwiftUIWebView: UIViewRepresentable {
typealias UIViewType = WKWebView
let webView: WKWebView
func makeUIView(context: Context) -> WKWebView {
webView
}
func updateUIView(_ uiView: WKWebView, context: Context) {
}
}
final class SwiftUIWebViewModel: ObservableObject {
#Published var addressStr = "https://www.stackoverflow.com"
let webView: WKWebView
init() {
webView = WKWebView(frame: .zero)
loadUrl()
}
func loadUrl() {
guard let url = URL(string: addressStr) else {
return
}
webView.configuration.userContentController.addUserScript(WKUserScript( source: """
window.userscr ="hey this is prior injection";
""", injectionTime: .atDocumentStart, forMainFrameOnly: false))
webView.load(URLRequest(url: url))
// You will have the chance in 8 seconds to open Safari debugger if needed. PS: Also put a breakpoint to injectJS function.
DispatchQueue.main.asyncAfter(deadline: .now() + 8.0) {
self.injectJS()
}
}
func injectJS () {
webView.evaluateJavaScript("""
window.temp = "hey here!";
document.getElementById("content").style.color = "blue";
""")
}
}
struct CustomWebview: View {
#StateObject private var model = SwiftUIWebViewModel()
var body: some View {
VStack {
SwiftUIWebView(webView: model.webView)
.padding()
}
}
}
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}
import SwiftUI
import SafariServices
struct ContentView: View {
#State var urlString = "http://pistore.info"
var body: some View {
VStack {
SafariView(url: URL(string: urlString)!)
}
}
}
struct SafariView: UIViewControllerRepresentable {
let url: URL
func makeUIViewController(context: UIViewControllerRepresentableContext<SafariView>) -> SFSafariViewController {
return SFSafariViewController(url: url)
}
func updateUIViewController(_ uiViewController: SFSafariViewController, context: UIViewControllerRepresentableContext<SafariView>) {
}
}
If I use WebKit, there are many things that don't work, so I decided to use Safari Service
I want to get rid of the red bar in my hair
This is a web browser app for macOS. To keep things organized, I’m moving some bookmark buttons from ContentView to their own struct, but now the webview doesn’t load the site after clicking any of the buttons.
They only work if they’re stored inside ContentView and I'm not sure why.
struct bookmarkbuttons: View {
#State var webView: WebView?
var body: some View {
Button {
webView?.youtube()
}
...........
}
ContentView
#State var webView: WebView?
struct ContentView: View {
................
bookmarkbuttons()
webView
}
.onAppear {
webView = WebView(webModel: webModel) }
}
WebView
struct WebView: NSViewRepresentable {
#ObservedObject var webModel: WebStateModel
let wkWebview = WKWebView()
func makeNSView(context: Context) -> WKWebView {
if let theUrl = webModel.url {
let request = URLRequest(url: theUrl, cachePolicy: .returnCacheDataElseLoad)
wkWebview.load(request)
}
return wkWebview
}
}
func updateNSView(_ nsView: WKWebView, context: Context) {
if let theUrl = webModel.url {
let request = URLRequest(url: theUrl, cachePolicy: .returnCacheDataElseLoad)
nsView.uiDelegate = context.coordinator
nsView.load(request)
}
func youtube() {
wkWebview.load(URLRequest(url: (URL(string: "https://www.youtube.com")!)))
}
}
I can't see the buttons that should be on top of the web view that make it go back and forward. I don't know if this is a web view taking up the whole screen problem, or something else. I've tried making a new view with the buttons and putting the view in there. I don't know.
Here is my code:
import WebKit
import SwiftUI
struct Webview : UIViewRepresentable {
let request: URLRequest
var webview: WKWebView?
init(web: WKWebView?, req: URLRequest) {
self.webview = WKWebView()
self.request = req
}
func makeUIView(context: Context) -> WKWebView {
return webview!
}
func updateUIView(_ uiView: WKWebView, context: Context) {
uiView.load(request)
}
func goBack(){
webview?.goBack()
}
func goForward(){
webview?.goForward()
}
}
struct ContentView: View {
#State var searchURL = "https://google.com"
var body: some View {
VStack {
HStack {
//MARK: BACK BUTTON
Button(action: {
Webview(web: nil, req: URLRequest(url: URL(string: "\(searchURL.prefix(4) == "http" ? searchURL : "https://\(searchURL)")")!)).goBack()
}) {
Image("arrowshape.turn.up.backward")
}
//MARK: FOREWARD BUTTON
Button(action: {
Webview(web: nil, req: URLRequest(url: URL(string: "\(searchURL.prefix(4) == "http" ? searchURL : "https://\(searchURL)")")!)).goForward()
}) {
Image("arrowshape.turn.up.foreward")
}
}
Webview(web: nil, req: URLRequest(url: URL(string: "\(searchURL.prefix(4) == "http" ? searchURL : "https://\(searchURL)")")!))
}
}
}
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}
The button action should not be a view in itself but should just update a variable that stores the URL to be displayed by the webview. However that is not required.
Take a look at this. Should cover all the scenarios you need without the need to manually manager URLs
I'm a beginner, sorry I did webview with swift, but a link with target _blank doesn't work
I've created a UIViewRepresentable class for the WKWebView from UIKit. The UIViewRepresentable class can be used to create and manage views(UIView) from UIKit in SwiftUI. There are two views in the project,
ContentView lists the urls from string array. Selecting an url navigates to the Detail view.
The Detail view shows the web page for the selected url using WKWebView.
Hope this helps. Here's the code.
import SwiftUI
import UIKit
import WebKit
struct ContentView: View {
var urls: [String] = ["https://www.stackoverflow.com", "https://www.yahoo.com"]
#State private var hideStatusBar = false
var body: some View {
NavigationView {
List {
ForEach(urls, id: \.self) { url in
VStack {
NavigationLink(destination: DetailView(url: url)) {
Text(url)
}
}
}
}
.navigationBarTitle("Main")
}
}
}
struct DetailView: View {
var url: String = ""
var body: some View {
VStack {
Webview(url: url)
Spacer()
}
.navigationBarHidden(true)
}
}
struct Webview: UIViewRepresentable {
var url: String
typealias UIViewType = WKWebView
func makeUIView(context: UIViewRepresentableContext<Webview>) -> WKWebView {
let wkWebView = WKWebView()
guard let url = URL(string: self.url) else {
return wkWebView
}
let request = URLRequest(url: url)
wkWebView.load(request)
return wkWebView
}
func updateUIView(_ uiView: WKWebView, context: UIViewRepresentableContext<Webview>) {
}
}