Home > Uncategorized > Creating a #macOS App using HTML and #Javascript

Creating a #macOS App using HTML and #Javascript

Screenshot 2018-10-06 at 20.38.30

You can create great macOS apps with Swift, and if you’ve got the time to learn a new language, then this is the way to go. But if you already have something cool made with HTML and Javascript, then you can turn it into a macOS app with a few simple steps.

TL;DR;

If you want to skip to the end, you can just clone the GIT repo at https://github.com/infiniteloopltd/UnderTheCryptOSX

But, if you fancy going step by step, – open up XCode and create a new macOS / Cocoa app. Drop a WKWebView onto the form, and set it’s constraints so that it fills the view. Then drag an outlet called;

@IBOutlet weak var webkitview: WKWebView!

You’ll need to add a reference to WebKit as follows;

import WebKit

Then in the viewDidLoad, add the following lines

let url = Bundle.main.url(forResource: “index”, withExtension: “html”)!
webkitview.loadFileURL(url, allowingReadAccessTo: url)
let request = URLRequest(url: url)
webkitview.load(request)

You can then go Add files to … and add your index.html to the project. Now, if you run this now, you may get a white page. To get around this, you will need to go to the project > Capabilities > App Sandbox and click “Outgoing connections (Client)”

Screenshot 2018-10-06 at 20.44.41

Another thing that you may have to do, or else the app may get rejected by apple, is to exit the app when the window is closed. you do this in AppDelegate.swift as follows;

func applicationShouldTerminateAfterLastWindowClosed(_ sender: NSApplication) -> Bool
{
return true
}

 

Advertisements
Categories: Uncategorized
  1. No comments yet.
  1. No trackbacks yet.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

%d bloggers like this: