ionicプロジェクトのsplash.pngを自動でリサイズしながら9-patchする「make-9patched-splash-ionic」
先日、nodejsで9-patch画像を自動生成する方法について書いた。
琴線探査: nodejsで9-patch画像を自動生成する「FourSide1px9patcher」
その後、このコードを使いやすいようにnodeモジュール化した。
junkoro/four-sides-1px-9patcher
ここからが本番。ionicプロジェクトでsplash.pngを自動的にリサイズしつつ9-patchするコードを書くときがキタ(・∀・)!!
すでにnodeモジュール化して公開済み。
junkoro/make-9patched-splash-ionic
インストール方法やコード内容についてはgithubに譲るとして、ここでは開発時に困ったことについて書いておきたいと思う。
9-patchについては開発済みだったので何の問題も無かったが、画像のリサイズが困った。node-canvasでもリサイズはできるのだが、リサイズ後の画像のクオリティーがとても使えたものではないのだ(´・ω・`)
この問題はブラウザ上のJSでも同じで、以前に研究したことがあった。
琴線探査: HTML5 Canvasで画像のリサイズするならコレ!「JS-Image-Resizer」
というわけで、再びこの「JS-Image-Resizer」を使わせていただくことにした。結果は上々だ。
ただ、「JS-Image-Resizer」はブラウザ用のJSコードなので、node用に多少変更する必要があった。と言っても、「modules.exports」行の追加とエラーになる部分(WebWorker部)をコメントするくらいだったが。
これでこの件にコメントすることができるようになった。
Bad splashscreen ratio with Android using CLI new feature - ionic - Ionic
この件は自分も困っていたが、他にも多くの人が困っているようなので、このコードが助けになればと思う。
琴線探査: nodejsで9-patch画像を自動生成する「FourSide1px9patcher」
その後、このコードを使いやすいようにnodeモジュール化した。
junkoro/four-sides-1px-9patcher
ここからが本番。ionicプロジェクトでsplash.pngを自動的にリサイズしつつ9-patchするコードを書くときがキタ(・∀・)!!
すでにnodeモジュール化して公開済み。
junkoro/make-9patched-splash-ionic
インストール方法やコード内容についてはgithubに譲るとして、ここでは開発時に困ったことについて書いておきたいと思う。
9-patchについては開発済みだったので何の問題も無かったが、画像のリサイズが困った。node-canvasでもリサイズはできるのだが、リサイズ後の画像のクオリティーがとても使えたものではないのだ(´・ω・`)
この問題はブラウザ上のJSでも同じで、以前に研究したことがあった。
琴線探査: HTML5 Canvasで画像のリサイズするならコレ!「JS-Image-Resizer」
というわけで、再びこの「JS-Image-Resizer」を使わせていただくことにした。結果は上々だ。
ただ、「JS-Image-Resizer」はブラウザ用のJSコードなので、node用に多少変更する必要があった。と言っても、「modules.exports」行の追加とエラーになる部分(WebWorker部)をコメントするくらいだったが。
これでこの件にコメントすることができるようになった。
Bad splashscreen ratio with Android using CLI new feature - ionic - Ionic
この件は自分も困っていたが、他にも多くの人が困っているようなので、このコードが助けになればと思う。
コメント
コメントを投稿