Creating Themes

IMUPThemeDocument

このドキュメントは、ImageUp のテーマを作成しようと思う方のために、imuptheme 形式のテーマを作成する方法を解説するものです。

はじめに

ImageUp のテーマは、画像ファイルとプロパティリストファイルを一つのパッケージへまとめたものが、その実体となっています。これにより、テーマを作成する皆さんにとっては、画像を作成することが主な作業となるでしょう。画像を作成するのは PNG ファイルを出力できるどのようなソフトでも構いません。この文書ではそれ以外の部分を解説します。

またこの文書で解説する内容は、現在の ImageUp のみで保証され、将来のバージョンアップで仕様の変更がおこなわれる可能性があることをご了承ください。

ファイル構成

まずは既存のテーマを見てみましょう。ImageUp.app のコンテキストメニューから「パッケージの内容を表示』を選択し、ImageUp.app/Contents/SharedSupport/Themes/ とフォルダーを開いていきましょう。imuptheme を拡張子とする3つのファイルが見つかると思います。これらが環境設定にテーマとして表示されているものです。

imuptheme 形式ファイルのコンテキストメニューから「パッケージの内容を表示」を選ぶと、テーマファイルの中身を見ることができます。このことから、これが単なるパッケージであることが分かります。ただのフォルダーに imuptheme という拡張子をつけただけのものです。試しに、適当な名前をつけたフォルダーに .imuptheme と付け加えてみてください。ImageUp がインストールされた環境では、アイコンが変わり、パッケージとして表示されるようになります。

それでは中身を見ていきましょう。

  • Info.plist
  • ApplicationIconDefault.png
  • ApplicationIconJa.png
  • ApplicationIconEn.png
  • ColorBarDefault.png
  • ColorBarJa.png
  • ColorBarEn.png
  • CursorMarkerDefault.png
  • CursorMarkerJa.png
  • CursorMarkerEn.png
  • StatusItemIconDefault.png
  • StatusItemIconJa.png
  • StatusItemIconEn.png
  • ColorMenuBar.plist
  • Preview.png

上に示したファイル名のリストと同じものが入っています。プロパティリストファイルが2つと PNG ファイルが13あります。ここで、似たファイル名なのに最後だけが違うものが多いことに注目してください。ファイル名の終わりに DefaultJaEn とついているものはそれぞれセットになっています。基準となる Default と、日本語入力モードのときの Ja、そして英語入力モードのときの En という風なルールによって名前を決められています。

プロパティリストファイルは、このドキュメントの最後に値の無いキーだけが設定されたものを添付します。テンプレートとして利用してください。

それでは個別のファイルについてみていきましょう。

Info.plist

テーマ全体の情報を保存するためのプロパティリストファイルです。いくつかのキーと値のセットが記入されています。Mac の開発環境がインストールされていれば、Property List Editor というアプリケーションで編集することができます。そうでない場合は、単純な XML ファイルですのでお好きなエディターで編集可能です。ここでは Property List Editor を使用するものとして説明します。

それではキーと値の意味をそれぞれ解説します。

IMUPThemeArtist
テーマの作成者を表しています。このキーに指定された値が、環境設定に表示されます。
IMUPThemeIdentifier
テーマファイル固有の値をここに設定します。逆 DNS 記法と呼ばれる方法を用います。インターネットのドメインをお持ちでしたら、お持ちのドメインを利用して com.example.imageup.theme_name のような形で記入します。特にお持ちでない方は、他のテーマファイルとかぶらないように、お好きな値を設定されて構いません。この値は将来のバージョンでテーマファイルを識別するのに利用される可能性があります。
IMUPThemeName
テーマの名前を設定します。ここに設定された値が環境設定に表示されます。テーマファイルのファイル名ではなく、こちらが表示されることに注意してください。
IMUPThemePreviewImage
環境設定に表示される、テーマのプレビューを設定します。ここに設定されたファイル名のファイルが読み込まれます。
IMUPThemeCompatible
キーと値のペアで、テーマが対応している表示方法を設定します。チェックの無い項目は、テーマが非対応であるとして環境設定より優先して表示されなくなります。できる限りすべての表示方法に対応することを推奨しますが、何らかの事情で困難な場合はチェックを外してください。

ApplicationIcon

ApplicationIcon という文字で始まるファイルは、Dock に表示されるアイコンに使われる PNG 形式の画像です。。512ピクセル四方の PNG ファイルで作成してください。

ColorBar

ColorBar という文字で始まるファイルは、画面上下のカラーバーに使われる PNG 形式の画像です。画像のサイズは任意のものでかまいませんが、Default のサイズが基準となることに注意してください。高さはそのまま適用され、横幅は画面の横幅まで引き延ばされるようになっています。また、画面下に表示されるものは上下に反転されます。

CursorMarker

CursorMarker という文字で始まるファイルは、マウスカーソル右下に表示されるマーカーに使われる PNG 形式の画像です。画像のサイズは任意のものでかまいませんが、Default のサイズが基準となることに注意してください。表示される位置は、マウスカーソルのクリックされるポイントから画像の中心まで、一定距離離れた場所になります。

StatusItemIcon

StatusItemIcon という文字で始まるファイルは、メニューバーの右側にあるステータス領域に表示されるアイコンとなる、PNG 形式の画像ファイルです。画像のサイズは、高さは22ピクセルまで、横幅は任意です。Default のサイズが基準となることに注意してください。

ColorMenuBar.plist

メニューバーの色を設定するためのプロパティリストファイルです。RGB それぞれに値を設定することで色合いを設定します。また、Alpha というキーには不透明度を設定します。このとき、0から1までの小数で値を設定することに注意してください。

Preview

Info.plist ファイルで指定されたプレビュー画像です。環境設定に表示されます。高さ300ピクセル、横幅400ピクセルを推奨します。

おわりに

これらのファイルを作成し、フォルダーにまとめます。そしてフォルダーの名前に .imuptheme の拡張子をつけると、テーマファイルの出来上がりです。このファイルをダブルクリックすることで自動的にテーマフォルダーへコピーされます。このときのテーマフォルダーは ~/Library/Application Support/ImageUp/Themes/ となり、存在しなければ自動的に作成されます。同じファイル名のテーマが既にあった場合は、古い方がゴミ箱へ移動され、新しいものに置き換わります。こうしてインストールされたテーマは、環境設定に自動的に追加され、すぐに選択可能です。

これで一通り説明が終わりました。ImageUp はまだ開発の途上にあり、テーマファイルにも仕様変更が及ぶかも知れません。しかしながら、できる限り互換性を保つように配慮します。多くの方が、自分の好みのテーマを作成されることを切に願います。また、もしよろしければ、他の方がそのテーマを利用できるように、インターネット上に公開していただければと思います。

何か疑問点や要望などありましたら、連絡をいただければ幸いです。

Download

プロパティリストのテンプレート