Zenn
😊

Xcode 12でmacOS用のQuick Look機能拡張を作成する

2020/10/09に公開
Xcode
macOS
#
qicklook
#
enchantmoon
tech

Xcode 12には Quick Look のプラグイン.qlgeneratorを作成するプロジェクトが存在しない。すでに macOS でも iOS 同様の機能拡張Application Extension（.appex）を使用した Quick Look が標準になっているからだろう。

今回は Xcode 12 に用意されている Quick Look Application Extension の Target を用いる方法で Quick Look 機能拡張を作成してみる。

プロジェクトの作成

Quick Look 機能拡張は基本的にアプリケーションに含まれる形で配布されるのでその方法で作成していく。

手順としては以下の通り

  1. アプリケーションの Project を新規作成
    今回のサンプルのプロジェクト名は eMQuickLook。
  2. File - New - Target… から Application Extension の Quick Look Preview Extension を選択
    今回のサンプルのターゲット名は enchantMOON。
  3. scheme をアクティブにするか確認するダイアログでは Activate を選択

以上でプロジェクトの作成は終了。
eMQuickLook プロジェクトに eMQuickLook と enchantMOON のフォルダ（グループ）ができている。

サポートするファイル形式の UTI を info.plist に加える

次は Quick Look 機能拡張がプレビューを作成できるファイルの情報をinfo.plistに用意する。
enchantMOON のinfo.plistに既に雛形はできているのでQLSupportedContentTypes配列にサポートするファイルの UTI を加えていけば良い。

下記は UTI としてdyn.ah62d4rv4ge80455tr2を加えた画面。

これで UTI がdyn.ah62d4rv4ge80455tr2のファイルをプレビューできるようになる。

因みにファイルの UTI を調べる方法はこちら

PreviewViewController にプレビュー描画のコードを書く

PreviewViewController.swiftにあるPreviewViewControllerクラスがプレビュー画面の ViewController になる。

プレビューを表示する時にシステムから
preparePreviewOfFile(at url: URL, completionHandler handler: @escaping (Error?) -> Void)
が呼ばれるので、そこでプレビュー画面を描画する。

引数の url にはプレビュー時に選択されているファイルの URL、handler には描画が終わったら呼び出すブロックが渡されるので以下の手順で処理を行う。

  1. url で示されるファイルを読み込む
  2. ファイルの内容に合わせてプレビュー画面を描画
  3. handler(nil)をコールして終了

描画は通常の ViewController と同じに行える。view に直接描画しても良いし、PreviewViewController.xibに UI を乗せても良い。

ビルド

enchantMOON の scheme を選んでcommand+bでビルドできる。この状態で既に機能拡張はシステムに読み込まれているので、適当なファイルを選択してプレビューすれば内容が表示されるはず。

機能拡張のオン／オフは「システム環境設定」の「機能拡張」にある「クイックルック」から行うことができる。

左側にはアプリケーションの名前、右には機能拡張の名前が表示される。
上の例の場合 eMQuickLook はアプリケーション名、enchantMOON は機能拡張の名前になる。これはアプリケーション、機能拡張共にプロジェクトで名称を変更することで変えらえる。

Quick Look 機能拡張のデバッグ

機能拡張は Xcode のデバッガを使ってデバッグすることができるが、Quick Look の場合通常の機能拡張とはやり方が違う。
enchantMOON の scheme を選択したらcommand+rで実行するとアプリケーションを選択するダイアログが表示されるので Quick Look Simulator を選択。
特に何もない Quick Look Simulator が起動する。

ここでサポートする適当なファイルを選択してプレビューすれば、Xcode のブレークポイントで処理を一時停止することができる。（初回起動時はプログレスサークルがクルクル回ってかなり待たされるので注意。）

後は普通のアプリと同じようにデバッグできる。

サンプル

今回は昔懐かしい enchantMOON の info.json を表示できる機能拡張を作ってみた。
ただし、.json を全て enchantMOON のファイルだと認識してしまうのは面倒なことになるだけなので、今回は info.json を info.moon と拡張子を変えて、それをプレビューできるようにしてみた。

因みにこの場合の UTI がdyn.ah62d4rv4ge80455tr2になる。

表示サンプル

サンプルコード

まとめ

Application Extension 形式の Quick Look 機能拡張は以前の .qlgenerator 形式で作っていた頃に比べるとかなり作りやすくなっている。以前はテンプレートで用意されていた .c ファイルを .m に書き換えて Objective-C で書いたりして面倒だったし、何より Swift で書けるようになったのが大きい。
macOS Catalina ではまだ .qlgenerator 形式のプラグインでも動作するが、macOS Big Sur になった時にも動作するかどうかはわからないので、独自形式のドキュメントを作成するアプリを作る際には Application Extension 形式で Quick Look プレビュー機能を提供するのが良いだろう。

ところで、今回はサンプルとして enchantMOON の info.json をプレビューできる機能拡張を作成したが、enchantMOON のページやシールのデータをまだ持っている人はどのくらいいるのだろうか？　自分の場合はたまたま別件で昔のストレージを漁っていたら出てきて懐かしくなって機能拡張を作ったが、多くの人は PC にはデータを保存しておらずに本体がどこかにポツンと放置されている状態だろうか。コンセプトはとても良かったと思うガジェットだけに、実用に足る物を実現するには全体的にパワー不足だったと思われるのが本当に残念。

取っ手付きでヘビーデューティーな手書きタブレット、また出てこないかな〜

Discussion