使用Swift开发一个MacOS的菜单状态栏App

本文详细介绍了如何使用Swift开发一个MacOS菜单栏应用,专注于创建一个显示天气信息的状态栏App。从创建工程、删除默认窗口、设置状态栏Icon、重构代码、集成天气API、解析JSON数据到显示天气,一步步教你打造属于自己的天气应用。
摘要由CSDN通过智能技术生成

猴子原创,欢迎转载。转载请注明: 转载自Cocos2Der-CSDN,谢谢!
原文地址: http://blog.csdn.net/cocos2der/article/details/52054107

这两天突然想看看OSX下的App开发,看了几篇文章。下面这一篇我觉得入门是非常好的。我仅转述为中文,并非原文翻译。原文地址:http://footle.org/WeatherBar/

下面开始介绍如何使用Swift开发一个Mac Menu Bar(Status Bar) App。通过做一个简单的天气app。天气数据来源于OpenWeatherMap

完成后的效果如下:
这里写图片描述

一、开始建立工程

打开Xcode,Create a New Project or File ⟶ New ⟶ Project ⟶ Application ⟶ Cocoa Application ( OS X 这一栏)。点击下一步。
这里写图片描述

二、开始代码工作

  1. 打开MainMenu.xib,删除默认的windows和menu菜单。因为我们是状态栏app,不需要菜单栏,不需要主窗口。
    这里写图片描述

  2. 添加一个Menu菜单
    这里写图片描述
    删除其中默认的2个子菜单选项,仅保留1个。并将保留的这个改名为“Quit”。

  3. 打开双视图绑定Outlet

    • 将Menu Outlet到AppDelegate,命名为statusMenu
      这里写图片描述

    • 将子菜单Quit绑定Action到AppDelegate,命名为quitClicked
      这里写图片描述

    • 你可以删除 @IBOutlet weak var window: NSWindow! ,这个app中用不上。

  4. 代码

    • 在AppDelegate.swift中statusMenu下方添加

      let statusItem = NSStatusBar.systemStatusBar().statusItemWithLength(NSVariableStatusItemLength)
    • applicationDidFinishLaunching函数中添加:

      statusItem.title = "WeatherBar"
      statusItem.menu = statusMenu
    • 在quitClicked中添加:

      NSApplication.sharedApplication().terminate(self)
    • 此时你的代码应该如下:

import Cocoa

@NSApplicationMain
class AppDelegate: NSObject, NSApplicationDelegate {

    @IBOutlet weak var statusMenu: NSMenu!

    let statusItem = NSStatusBar.systemStatusBar().statusItemWithLength(NSVariableStatusItemLength)

    @IBAction func quitClicked(sender: NSMenuItem) {
        NSApplication.sharedApplication().terminate(self)
    }

    func applicationDidFinishLaunching(aNotification: NSNotification) {
        statusItem.title = "WeatherBar"
        statusItem.menu = statusMenu
    }

    func applicationWillTerminate(aNotification: NSNotification) {
        // Insert code here to tear down your application
    }

}

运行,你可以看到一个状态栏了。

三、进阶一步,让App变得更好

你应该注意到了,当你运行后,底部Dock栏里出现了一个App启动的Icon。但实际上我们也不需要这个启动icon,打开Info,添加 “Application is agent (UIElement)”为YES。
这里写图片描述

运行一下,不会出现dock启动icon了。

四、添加状态栏Icon

状态栏icon尺寸请使用18x18这里写图片描述, 36x36(@2x)这里写图片描述, 54x54(@3x),添加这1x和2x两张图到Assets.xcassets中。
这里写图片描述

在applicationDidFinishLaunching中,修改为如下:

let icon = NSImage(named: "statusIcon")
icon?.template = true // best for dark mode
statusItem.image = icon
statusItem.menu = statusMenu

运行一下,你应该看到状态栏icon了。

五、重构下代码

如果我们进一步写下去,你会发现大量代码在AppDelegate中,我们不希望这样。下面我们为Menu创建一个Controller来管理。

  • 新建一个NSObject的StatusMenuController.swift, File ⟶ New File ⟶ OS X Source ⟶ Cocoa Class ⟶ Next
    这里写图片描述

代码如下:

// StatusMenuController.swift

import Cocoa

class StatusMenuController: NSObject {
    @IBOutlet weak var statusMenu: NSMenu!

    let statusItem = NSStatusBar.systemStatusBar().statusItemWithLength(NSVariableStatusItemLength)

    override func awakeFromNib() {
        let icon = NSImage(named: "statusIcon")
        icon?.template = true // best for dark mode
        statusItem.image = icon
        statusItem.menu = statusMenu
    }

    @IBAction func quitClicked(sender: NSMenuItem) {
        NSApplication.sharedApplication().terminate(self)
    }
}
  • 还原AppDelegate,修改为如下:
// AppDelegate.swift

import Cocoa

@NSApplicationMain
class AppDelegate: NSObject, NSApplicationDelegate {
    func applicationDidFinishLaunching(aNotification: NSNotification) {
        // Insert code here to initialize your application
    }
    func applicationWillTerminate(aNotification: NSNotification) {
        // Insert code here to tear down your application
    }
}

注意,因为删除了AppDelegate中的Outlet注册,所以你需要重新连Outlet,但在这之前我们需要先做一件事。(你可以试试连接StatusMenuController中的Outlet,看看会怎么样?)

  • 打开MainMenu.xib,添加一个Object。
    这里写图片描述
    将该Object的Class指定为StatusMenuController
    这里写图片描述
    重建Outlet到StatusMenuControllerÿ
评论 6
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值