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


##経緯
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](https://qiita-image-store.s3.amazonaws.com/0/5365/5733d383-a347-7532-0a4a-9a9aacc5e398.png "スクリーンショット 2014-11-12 23.08.58.png")

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

![スクリーンショット 2014-11-12 23.00.13.png](https://qiita-image-store.s3.amazonaws.com/0/5365/3c61f895-8676-f4ef-1e98-40edf79e51b6.png "スクリーンショット 2014-11-12 23.00.13.png")

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

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

参考：
[カスタムなウィンドウを表示した状態でNSStatusItemをハイライトする](http://questbeat.hatenablog.jp/entry/2013/07/17/232454)

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

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

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

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

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

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

[NSCollectionのドキュメント](https://developer.apple.com/library/mac/documentation/Cocoa/Reference/NSCollectionView_Class/index.html)や[Appleのガイド](https://developer.apple.com/library/mac/documentation/cocoa/Conceptual/CollectionViews/Introduction/Introduction.html)見ながら進めていきます。

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

####大枠の構成

![スクリーンショット 2014-11-12 23.58.53.png](https://qiita-image-store.s3.amazonaws.com/0/5365/e233dac5-7611-7f8b-0db0-5e1522744b32.png "スクリーンショット 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周りの実装。

```hogeViewListController
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](https://qiita-image-store.s3.amazonaws.com/0/5365/973277ea-2f11-e610-2287-81d05d6e9448.png "スクリーンショット 2014-11-13 0.11.44.png")

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

![スクリーンショット 2014-11-13 0.17.56.png](https://qiita-image-store.s3.amazonaws.com/0/5365/7cd8115f-ba35-e2ea-9f60-0f3dfc7db05b.png "スクリーンショット 2014-11-13 0.17.56.png")

続いてContentの設定。

![スクリーンショット 2014-11-13 0.22.26.png](https://qiita-image-store.s3.amazonaws.com/0/5365/27b53982-f627-05a7-4854-5bf4a9e67a19.png "スクリーンショット 2014-11-13 0.22.26.png")

後は、CollectionViewItemの設定。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/5365/e55e0e68-78bf-d35e-ee27-647249d6db59.png "image.png")

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

buildするとこんな感じに。

![スクリーンショット 2014-11-13 0.31.41.png](https://qiita-image-store.s3.amazonaws.com/0/5365/59c24d74-e91d-4952-ab43-5c327ea0bc63.png "スクリーンショット 2014-11-13 0.31.41.png")

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

##結論

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