スクリプト -> 9Patch
9Patch ファイルを出力するスクリプト。
【環境】
Photoshop:CS6
OS:Windows 10 Home 64bit
Photoshop:CS6
OS:Windows 10 Home 64bit
作り方
以前、Android アプリを製作したときの記事。
draw9patch.bat
元画像の外周に 1px の余白を取り、黒（#000000）の塗りつぶしを付ける
.9.png という拡張子で保存する（png でなくてもいいみたい？）
引き伸ばす領域
元画像の左端の余白、該当箇所にマーキング。基本は上下２箇所
元画像の上端の余白、該当箇所にマーキング。基本は左右２箇所
コンテンツ領域
引き伸ばしたくない領域
元画像の右端の余白、該当箇所にマーキング。基本は内部１箇所
元画像の下端の余白、該当箇所にマーキング。基本は内部１箇所
基本タイプイメージ
| patch 領域 | |||||||||
| 引き伸ばし領域 | |||||||||
| コンテンツ領域 | |||||||||
JSX
仕様
- 引き伸ばす範囲は、元画像の周囲 1px 部分
- コンテンツ領域は、元画像の周囲 1px 以外の部分
- —
- ２行目に元となる PSD ファイル名を列挙（利用者が入力）
- Android 側、解像度名に対応する順番にすること
- 現仕様では、６種のサイズを吐き出すことになっているけど、不要なものは削除可能
- 不要なものを削除する場合は、ファイル名と同時に、Android 側、解像度名も削除すること
- 元画像の幅と高さは自由
- 元画像は全て同一ディレクトリに配置
- スクリプト実行前に、元画像の最初の PSD ファイルを開いておく
- 元画像と同一ディレクトリに .9.png ファイルが保存される
- .9.png ファイルの名称は、splash_（Android 側、解像度名）
- —
- 元画像のアクティブレイヤーが「塗りつぶし」できないレイヤーだとエラーになる
- ExtendScript Toolkit から実行したので、Photoshop 本体からの実行は試してない
コード
iG:Syntax Hiliter だとバグるので、CodePen。。。
See the Pen Making 9Patch with Photoshop CS6 by muchag (@muchag) on CodePen.
参考サイト
Life goes on：PhotoShop CS5でAndroid用9patchを作るのに便利なjsx（2011-08-12）