macos
AppKit
GoodpatchDay 10

声に出して読みたいAppleのmacアプリサンプルコード集

なにこれ

macアプリの開発ってiOSと同じノリでやろうとすると勝手が違うので結構つまづきます。
情報もなかなか落ちていないので、「絶対mac標準のUIなのにどうやって作ってんだこれ...」みたいなことになります。(僕は)

そんな時にApple公式のサンプルコードが役に立ちます。
以下に、役に立ちそうなものをいくつか挙げていきます。

なお、古いサンプルは当然のごとくObjective-Cだったりしますが、情報があるだけありがたいという安らかな気持ちです😌

サンプルコード集

どこにあんの

ここ → Guides and Sample Code

AppKit って書いてあるやつはmacアプリです。

ベーシックなもの

Customizing NSSavePanel

スクリーンショット 2017-12-08 12.27.42.png

こちらはSavePanelのサンプルです。
テキストエディタのアプリになっており、ファイル保存時の流れを確認することができます。

Packaged Document for OS X

スクリーンショット 2017-12-09 19.29.22.png

NSDocumentNSFileWrapperを使用して、パッケージ化されたドキュメント(俗に言うファイル)を開いたり、編集したり、保存したりするためのテキストエディタアプリのサンプルです。
加えて、パッケージ化されたドキュメントをiCloudに保存する解説もあります。

このサンプルでは↑のような写真とテキストを入力して保存すると.txpcファイルができます。

スクリーンショット_2017-12-09_19_28_58.png

OutlineView

スクリーンショット 2017-12-08 12.30.18.png

シンプルなOutlineView(▼ボタンがついて階層化されたTableViewのイメージ)の実装サンプルです。
使用しているMacのフォルダ階層をOutlineViewで表しています。

NSPathControl Basics

0b2b28af65fc83c83c3ee5bee551209a.gif

NSPathControlはFile Systemなどのパス情報を表示するControlです。
このサンプルではNSPathControlDelegateを含むNSPathControl機能や使用方法が記載されています。

新しめなもの

NSTouchBar Catalog: Creating and Customizing NSTouchBar

TouchBarでできることがだいたいのってます。
以下は抜粋です。

Button

3db6ce60580ab72067d39013a2d3f79c.gif

Slider

04d1eefad034ddeab8f0e8b84f2c5018.gif

Color Picker

4e2faf1d52b544465ca93ece8a969d58.gif

Scroll View

1641d74c0a95d9a72074a529e0c317ad.gif

ちなみに
SimulatorでTouchBarの動きを見たい場合はメニューから以下を選択します。

Window → Show Touch Bar (Command + Shift + 5)

ForceTouchCatalog: Using the Force Touch Trackpad API

406c534ae2b11c098ae88a90981afeee.gif

Force Touch Trackpad APIのサンプルコードです。
3タブで構成されています。

  • Squire: Force Touchを使ってボタン押下時の圧力レベルでインジケーターの表示を変える
  • Knight: 圧力レベルで線の太さが変わるお絵かき
  • Master: 触覚フィードバック

AlignmentGuides: AppKit Haptic Feedback Filtering using NSAlignmentFeedbackFilter

48c04a37fc04e52bfcbe5a188c8dbc6f.gif

NSAlignmentFeedbackFilterを使った触覚フィードバック(Haptic Feedback)のサンプルです。
上記の画像だけではわかりにくいのですが、矩形をforce clickしながらdragして矩形の線と背景の線が重なる時にTrackPadが振動します。

描画系のアプリなど正しい位置に整列する時にスナップに加えて、こういった触覚フィードバックを返すとより直感的なるかと思います。

触覚フィードバックについて詳しくはHuman interface guidelines等にも記載されていますので興味がありましたらご覧ください。

おまけ

TextEdit

みんな大好き(要出典)TextEditのソース

スクリーンショット 2017-12-09 21.01.11.png

まとめ

いかがでしたでしょうか。
ググっても情報が出てこなかったらとりあえずAppleのサンプルコードにすがってみるのがいいと思います。
(僕はなんて検索すればいいかわからなくて結局困ったりします😞)

なお、上記ではアプリに絞って挙げましたが、Mac向けドライバのサンプルなども豊富にありますので興味がありましたらぜひ漁ってみてください。