mieki256's diary



2014/02/07(金) [n年前の日記]

#3 [cg_tools][unity][dxruby] レンダリング画像からドット絵モドキを作るbatファイルを作り込んだり

_2014/02/02にアップロードした大崎一番太郎のスプライトシート を、Unity上で表示してみたところ、なんだかゴミが表示されてしまって。

Unityに限らず、HTML5+JavaScriptでゲームを作る時もそうだけど。ドット絵の各パターンの上下左右に、1ドット程度の余白を入れておかないと、隣のパターン内のドットまで拾ってきて描画されてしまうことをすっかり忘れていたわけで。

仕方ないので、EDGE2で怪しいところを修正したけれど。今後もこういう実験をする機会がありそうだなと。

なので、 _2013/09/07に書いたbatファイル を ―― 3DCGソフトのレンダリング画像を縮小・黒縁をつけて、ドット絵っぽくするbatファイルを修正して、上下左右に1ドット幅の余白をつけるようにしてみたり。例えば、64x64ドットの出力結果を要求すると、62x62ドットで一旦作って、その画像の周囲に枠をつける、みたいな。

ついでに、/? や /h をつけると、ヘルプを表示するようにしてみたり。

_png2dotimg.bat
@echo off

rem ImageMagickのフォルダパス
set IMPATH=C:\Prog\ImageMagick-6.8.7-Q16

rem 縮小画像ファイルの頭につける文字列
set SMALL_STR=__tmp_small

if "%1"=="" goto USAGE
if "%1"=="/?" goto USAGE
if "%1"=="/h" goto USAGE
if "%1"=="-h" goto USAGE
if "%1"=="--help" goto USAGE
goto JOB

:USAGE
echo ImageMagickを使って、ドット絵モドキを作ります。以下の処理をします。
echo 縮小 → 黒縁追加 → 画像の周りに1ドットの余白を追加 → 一つの画像にまとめる
echo.
echo usage:
echo.
echo png2dotimg.bat 元画像名 出力画像名 縮小横ドット数 縮小縦ドット数 横に並べる個数
echo png2dotimg.bat 元画像名 出力画像名 縮小横ドット数 縮小縦ドット数 横に並べる個数 noborder
echo png2dotimg.bat /?
echo.
echo example:
echo.
echo png2dotimg.bat src_*.png out.png 64 64 8
echo png2dotimg.bat src_*.png out.png 64 64 8 noborder
echo png2dotimg.bat /?
echo.
echo * 元画像名は、hoge_*.png の形で指定
echo * noborderをつけると、1ドット余白を追加する処理をしない
echo * /? , /h , -h , --help を渡すと、このヘルプを表示
echo.
goto END

:JOB
set SRC=%1
set OUTIMG=%2
set IW=%3
set IH=%4
set TW=%5

if "%6"=="" goto BORDER
if "%6"=="noborder" goto NOBORDER

:BORDER
rem 1ドットの余白をつける場合の処理

set /a SW=IW-2
set /a SH=IH-2
set SIMGSIZE=%SW%x%SH%
set IMGSIZE=%IW%x%IH%
set INUM=0

for %%A in (%SRC%) do (
rem 縮小、かつ、アルファチャンネルを2値化
%IMPATH%\convert %%A -resize %SIMGSIZE% -channel A -threshold 70%% __tmp0.png

rem 黒縁をつける
%IMPATH%\convert __tmp0.png ^( +clone -channel A -morphology EdgeOut Diamond +channel +level-colors black ^) -compose DstOver -composite __tmp1.png

rem 上下左右に1ドットの余白をつける
%IMPATH%\convert __tmp1.png -matte -bordercolor none -border 1 %SMALL_STR%_%%~nA.png

rem 一時ファイルを削除
del __tmp0.png
del __tmp1.png

set /a INUM=INUM+1
)
goto TILES

:NOBORDER
rem 1ドットの余白をつけない場合の処理

set SIMGSIZE=%IW%x%IH%
set IMGSIZE=%IW%x%IH%
set INUM=0
for %%A in (%SRC%) do (
%IMPATH%\convert %%A -resize %SIMGSIZE% -channel A -threshold 70%% __tmp0.png
%IMPATH%\convert __tmp0.png ^( +clone -channel A -morphology EdgeOut Diamond +channel +level-colors black ^) -compose DstOver -composite %SMALL_STR%_%%~nA.png
del __tmp0.png
set /a INUM=INUM+1
)

:TILES
rem 一枚の画像に結合
set /a TH=((INUM-1)/TW)+1
echo image count = %INUM%
echo tile = %TW% x %TH%
%IMPATH%\montage -tile %TW%x%TH% -geometry %IMGSIZE% -background none %SMALL_STR%*.png %OUTIMG%

echo %OUTIMG% を作成しました
goto END

:END

使い方はこんな感じ。
> png2dotimg.bat /?
ImageMagickを使って、ドット絵モドキを作ります。以下の処理をします。
縮小 → 黒縁追加 → 画像の周りに1ドットの余白を追加 → 一つの画像にまとめる

usage:

png2dotimg.bat 元画像名 出力画像名 縮小横ドット数 縮小縦ドット数 横に並べる個数
png2dotimg.bat 元画像名 出力画像名 縮小横ドット数 縮小縦ドット数 横に並べる個数 noborder
png2dotimg.bat /?

example:

png2dotimg.bat src_*.png out.png 64 64 8
png2dotimg.bat src_*.png out.png 64 64 8 noborder
png2dotimg.bat /?

* 元画像名は、hoge_*.png の形で指定
* noborderをつけると、1ドット余白を追加する処理をしない
* /? , /h , -h , --help を渡すと、このヘルプを表示
> png2dotimg.bat src\osaki_*.png out.png 64 64 8
image count = 74
tile = 8 x 10
out.png を作成しました

ImageMagickに与えるオプションについてメモ。 :

画像の周りに余白をつけたい場合、以下の指定でもできるらしい。
convert src.png -matte -bordercolor none -border 1 dst.png
  • -matte は、アルファチャンネル情報に関係してるらしいけど、ちょっとよく分からず。+matte 、-alpha off 、-alpha on 等、色々あるようで。
  • -bordercolor none で、枠の色を指定してる。フツーは、gray とか black とかを指定するけど、noneを指定してるので…たぶん透明色を指定してるのかなと。
  • -border 1 で、1ドット幅の枠を指定してる。-border 10x0 なら、左右に10ドット枠をつけるけど上下にはつけない。-border 0x10 なら、上下に10ドット枠をつけるけど左右にはつけない、という指定になる。
以下のページが参考になりました。ありがたや。

_Cutting and Bordering -- IM v6 Examples : Adding/Removing Image Edges
_Masks -- IM v6 Examples : Controlling Image Transparency

以上です。

過去ログ表示

Prev - 2014/02 - Next
1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28

カテゴリで表示

検索機能は Namazu for hns で提供されています。(詳細指定/ヘルプ


注意: 現在使用の日記自動生成システムは Version 2.19.6 です。
公開されている日記自動生成システムは Version 2.19.5 です。

Powered by hns-2.19.6, HyperNikkiSystem Project