LoginSignup
195
196

More than 5 years have passed since last update.

SwiftでFinderライクなOSXアプリ開発

Posted at

経緯

iosは少しづつ慣れてきたので、果敢にもまだ慣れていないswiftでosxのアプリを開発してみようと挑戦してみました。
slack、kobitoなど流行っているサービスにはやっぱりMacアプリは存在しています。結局より良いUI/UXを必要とするサービスには、そのプラットフォームでのアプリは欠かせないですよねー。

ios vs osx

何が違うの?

ios osx
言語 objective-c/swift objective-c/swift
開発ツール Xcode Xcode
フレームワーク Cocoa Touch Framework Cocoa Framework
アプリ数 120万以上 不明
ドキュメントやソースの数 △ or ☓

書籍もUIKitなら迷うほどあるのに、Appkitはない。。。
Cocoapodsも調べてみた感じ、ios用の10分の1程度。

ざっくり出してみるとまぁフレームワークが微妙に違うだけだよね〜と油断してしまいます。

ところどころやっぱり違うので同じ頭でいくと悩まされますw
まぁ僕の場合は慣れてない and ソースの少ないswiftで攻めたのでってのもありますが。。。

一緒な部分は?

言語/IDEは同じですし、それ故大枠の構成は勿論そこまで変わりません。
Foundation, Core Data, Core Animationはios同様使えます。

ですのでNSが頭につくようなクラス群も基本同じです。
(NSArray, NSString etc...)

Yosemiteがリリースされ、NSViewControllerはUIViewControllerとかなり近くなっているようです。
Apple自体がiosにUIも近づけていますし、まぁだんだんとかなり近いところまではいくのではないでしょうか。

Example

早速xcodeでOSXアプリを作っていきます。

スクリーンショット 2014-11-12 23.08.58.png

サーバのapiを叩いてfinderのように名前/画像を出すような簡単なアプリを作っていきます。

スクリーンショット 2014-11-12 23.00.13.png

最初からすでにちょっと違います。
メニュータブが・・・!! テンション上がりますね。

メニューバーに常駐するアプリをよく見かけますが、
NSStatusItemというものを使えば実装できます。

参考:
カスタムなウィンドウを表示した状態でNSStatusItemをハイライトする

Storybord上のパーツにも見たことないものが沢山。
実際に見てもらうのが早いかと。

とりあえず今回はCollectionViewを使うかという事でStorybord上に設置。
さて、ちょっくら世の中の人がどうやって実装しているかを参考にしようかなとググってみる。

「nscollectionview tutorial」とかでググるとまぁそれなりには出る。
※swiftをも加えて検索しましたが、参考になるサイトは見つからず。。

今回のハードルは大きく3点。

・NSCollectionViewの使い方が分かっていない。
・Xcode6に対応しているsampleは見つからなかったので、少しxcode上の操作が違う。
・Swiftで書いているので、objective-cからの変換が必要。

ほう('A`)中々手強い。
Rubymotionで培ったメンタリティを持っている僕にはダメージはない。

NSCollectionのドキュメントAppleのガイド見ながら進めていきます。

とりあえずサーバとのやりとりはお決まりのAFNetworkingを使う。
なんかSwift製の物も出てるらしいけどCocoapodsで管理できないみたいだから、手を出さずこっちでいきます。

大枠の構成

スクリーンショット 2014-11-12 23.58.53.png

まぁこんな感じで大体つかめたので、細かい部分を作っていく。

一旦サーバーへのつなぎ込みは無視してmodel部分を作る。

hoge.swift

import Foundation
import AppKit

class Hoge: NSObject {
    var name: String
    var image: NSImage!

    override init() {
        self.name = "test"
        self.image = NSImage(named:"moriyaman.png")
    }
}

次はNSCollectionViewを載せているController周りの実装。

import Foundation
import AppKit

class AccountListViewController: NSViewController, NSCollectionViewDelegate {

    var hoge: Hoge!
    var hogeArray: NSMutableArray!

    @IBOutlet weak var hogeCollectionView: NSCollectionView!
    @IBOutlet var arrayController: NSArrayController!

    override func viewDidLoad() {
        super.viewDidLoad()
        let itemPrototype = self.storyboard?.instantiateControllerWithIdentifier("collectionViewItem")
            as NSCollectionViewItem
        hogeCollectionView.itemPrototype = itemPrototype
        hoge = Hoge()
        hogeArray = NSMutableArray(array:[hoge, hoge, hoge])
        hogeCollectionView.content = accountArray
    }
}

次はxcode上でNSCollectionViewのContentにarrayControllerのarrangedObjectsをBindingします。

スクリーンショット 2014-11-13 0.11.44.png

続いてNSArrayControllerの方にも設定を書いていきます。
まずはClassの設定。

スクリーンショット 2014-11-13 0.17.56.png

続いてContentの設定。

スクリーンショット 2014-11-13 0.22.26.png

後は、CollectionViewItemの設定。

image.png

ちょっと見にくいですけど、こういった具合にコンテンツとvalueを紐付けていきます。

buildするとこんな感じに。

スクリーンショット 2014-11-13 0.31.41.png

まぁなんとかできました。
ネットワークの部分もやりましたが、長くなるので、一旦これで終わり!

結論

・iosやった事ある人は、そこまで抵抗なくはじめられる!
・AppKit特有のものも結構あるので、UIKitできるから"ちょちょいでしょ"みたいに食って掛かるとやられますw
・詰まった時にiosほど解決策が出てこないのがちょっと苦しい。
・Appleの動きを見ていると、iphoneはじめiosとosxがリンクされるように設計されてきているので、もっと出来る事やMacアプリがあるとウマウマ~(゚∀゚)な事は増えてきそう。

195
196
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
195
196