Turning our app into a status bar app
Now, we are going to turn our app into a status bar app. To do this we are going to migrate the native code from Objective-C to Swift. In all honesty, this is not 100% necessary - we could do this without Swift, but... I don't know Objective-C and I also don't want to learn it! It has very complicated syntax, and outside mac native development there is very little use for it.
When I started developing my apps on macOS I knew very little Swift, but it's much more similar to JavaScript and C-like languages than Objective-C, so it makes sense to migrate our base app to Swift.
Migrating to Swift#
There are quite a few steps here, so I'm going to be as thorough as possible.
1. Remove the existing Obj-C code#
Delete the following files from the project
AppDelegate.h
AppDelegate.m
main.m
ViewController.h
ViewController.m
You have to delete them from XCode to remove the internal references, otherwise your project might be left in a broken state.
2. Create a AppDelegate.swift file#
In your project's -macos folder, right-click and select create new file, then select Swift and create an AppDelegate.swift file.
Once you create it, XCode will ask if you want to create a bridging header file. Accept the prompt. The bridging header file will expose Obj-C libraries to our Swift code, a requirement if you write any Swift in an XCode project.
The bridging header simply allows exposing Obj-c libraries to Swift - within this bridging header add the following content:
#import <React/RCTBridgeModule.h>#import <React/RCTBridge.h>#import <React/RCTEventDispatcher.h>#import <React/RCTRootView.h>#import <React/RCTUtils.h>#import <React/RCTConvert.h>#import <React/RCTBundleURLProvider.h>and in AppDelegate you can replace the following content (we will walk through it next):
import Foundation
import Cocoa
@NSApplicationMain
class AppDelegate: NSObject, NSApplicationDelegate {
var popover: NSPopover!
var window: NSWindow!
var statusBarItem: NSStatusItem!
func applicationDidFinishLaunching(_ aNotification: Notification) {
let jsCodeLocation: URL
#if DEBUGjsCodeLocation = RCTBundleURLProvider.sharedSettings().jsBundleURL(forBundleRoot: "index", fallbackResource:nil)
#elsejsCodeLocation = Bundle.main.url(forResource: "main", withExtension: "jsbundle")!
#endiflet rootView = RCTRootView(bundleURL: jsCodeLocation, moduleName: "buildingApps", initialProperties: nil, launchOptions: nil)
let rootViewController = NSViewController()
rootViewController.view = rootView
popover = NSPopover()
popover.contentSize = NSSize(width: 700, height: 800)
popover.animates = true
popover.behavior = .transient
popover.contentViewController = rootViewController
statusBarItem = NSStatusBar.system.statusItem(withLength: CGFloat(60))
if let button = self.statusBarItem.button {
button.action = #selector(togglePopover(_:))
button.title = "buildingApps"
}
#if DEBUGwindow = NSWindow(
contentRect: NSRect(x: 0, y: 0, width: 1, height: 1),
styleMask: [.titled, .closable, .miniaturizable, .resizable],
backing: .buffered,
defer: false)
This page is a preview of Building React Native Apps for Mac