CODEWITHSUNDEEP
macosxcode11html5-apps
Steve Brooker
Steve Brooker

Reputation: 1183

How do I create a WKWebView App for MacOS

I have an HTML5 App developed in XCode in the IOS App Store and I wish to create a copy of that app for the Mac App Store. I thought this would be easy but I cannot find any easy tutorials to follow, certainly not using XCode 11 and Swift 5.1. I do not want to go down the automated route provided in Mac OS 10.15

When I built the default Hello World App that comes with XCode 11, it will not run on 10.14! I do not want to upgrade to 10.15 yet, primarily because I want the app to work on earlier versions of MacOS

Anyone who can provide me with a reference to a working example of a WKWebView App loading local files that runs in XCode 11 on Max OS 10.14 will be my hero.

Upvotes: 7

Views: 8674

Answers (2)

droidix
droidix

Reputation: 103

Using Xcode 12 and Big Sur I had to go to the project properties, select the Signing & Capabilities tab, and check Outgoing Connections (Client) under the App Sandbox to get the excellent answer from Steve Brooker to work.

Upvotes: 6

Steve Brooker
Steve Brooker

Reputation: 1183

Step 1 - Install XCode 11 and open it.

Step 2 - Select "File" and "New" and "Project" from the main menu.

Step 3 - Select "App" (top left) and Select "Next" (bottom right).

Step 4 - Give your app a name, for User Interface select "Storyboard" and then select "Next".

Step 5 - Select a folder for where to store your new app on your computer and select "Create".

Step 6 - In XCode Navigator (left hand pane) select "Add Files" from the context menu.

Step 7 - Select the folder containing your html/javascript/css/image files - in this example I assume the folder will have the name "www" but it can be anything - just remember to change "www" in the code shown below to what you want.

Step 8 - Select "Create folder references for any added folders" and select "Add"

Step 9 - Select "ViewController.swift" from the Navigator pane and replace everything with with code shown below, changing "www" to the folder name containing your html etc and changing "AppName" to the name of your html file.

Step 10 - Press "Run" and use your new app.

For how to publish it and add other functionality (such as in app purchases) refer to Apple Developer and other internet resources/stack overflow questions.

import Cocoa
import WebKit

class ViewController: NSViewController, WKUIDelegate
    {
    var webView: WKWebView!

    override func loadView()
        {
        let webConfiguration = WKWebViewConfiguration ();
        webConfiguration.preferences.setValue(true, forKey: "allowFileAccessFromFileURLs");
        webView = WKWebView (frame: CGRect(x:0, y:0, width:800, height:600), configuration:webConfiguration);
        webView.uiDelegate = self ;
        view = webView;
        }

    override func viewDidLoad() {
    super.viewDidLoad()

    if let url = Bundle.main.url ( forResource: "AppName"
                                 , withExtension: "html"
                                 , subdirectory: "www")
        {
        let path = url.deletingLastPathComponent();
        self.webView.loadFileURL ( url
                                 , allowingReadAccessTo: path);
        self.view = webView ;
        }
    }
}

Upvotes: 7

Related Questions