2014/12/03(水) [n年前の日記]
#1 [dxruby] DXRubyとスプライトエディタ
この記事は
_DXRuby Advent Calendar 2014
の3日目です。
2日目の記事は、しのかろさんの _「デジゲー博2014イベント・リポート インディー・ゲームとDXRuby」 でした。Ruby＋DXRubyを用いたADVっぽいゲームエンジンの実装事例、興味深いです。Ruby は Perl同様、テキストファイルに対する処理が書きやすい印象もあるので、各自がシナリオファイルのフォーマットを改変して作業効率改善が期待できるかも、などと夢想してしまったりして。
さて。自分、今年は、「DXRubyとスプライトエディタ」というお題で書いてみました。せっかくだから、試しにスライドを作って SlideShare にアップロードしてみたりして。これで多少は読みやすいはず…？
この日記ページにちゃんと貼り付けられてるか不安なので、一応 _元になったPDF も置いておきます。
もっとも、現状では、アタリ範囲等を指定できないので、そのままではゲーム内で使えないような気もしていますが…。Windows.drawEx() で描画してる部分を、Sprite へ値を設定する処理に書き換えれば、どうにかなってくれないものかしら。
まあ、スプライトエディタで連番画像をエクスポートして、それをDXRubyで表示して使うほうが全然楽ですけど。画像サイズ・容量が問題にならないなら、それが一番いいような気がします。
てなわけで、今回の記事は以上です。
明日の記事は、しのかろさんの _「DXRuby機能リクエスト」 です。
2日目の記事は、しのかろさんの _「デジゲー博2014イベント・リポート インディー・ゲームとDXRuby」 でした。Ruby＋DXRubyを用いたADVっぽいゲームエンジンの実装事例、興味深いです。Ruby は Perl同様、テキストファイルに対する処理が書きやすい印象もあるので、各自がシナリオファイルのフォーマットを改変して作業効率改善が期待できるかも、などと夢想してしまったりして。
さて。自分、今年は、「DXRubyとスプライトエディタ」というお題で書いてみました。せっかくだから、試しにスライドを作って SlideShare にアップロードしてみたりして。これで多少は読みやすいはず…？
この日記ページにちゃんと貼り付けられてるか不安なので、一応 _元になったPDF も置いておきます。
◎ DXRubyでSpriterファイルを表示してみる。 :
というわけで、スライドの最後のあたりで書いてましたが、
_スプライトエディタ Spriter
のプロジェクトファイルをDXRubyで表示できましたので、スクリプト一式を置いておきます。下のような表示ができます。
_spritersconparser.rb.txt
_spritersconparser_20141203.zip
_spritersconparser.rb.txt
_spritersconparser_20141203.zip
- Windows7 x64 + Ruby 1.9.3 p545 mingw32 + DXRuby 1.4.1 の環境で動作確認しました。
- スクリプトソースや、サンプル画像、サンプル.scon は、Public Domain ということで。
◎ 使い方。 :
ひとまず動作する様子を見てみるなら、
任意の Spriterファイルを表示したいなら、
他のスクリプトから呼び出して使いたいなら、以下の記述例を参考にしてください。
ruby main.rbを実行してください。順にアニメが表示されるはずです。
任意の Spriterファイルを表示したいなら、
ruby spritersconparser.rb Spriterファイル.sconという形で実行してください。表示テストができます。.scml (.xml)ではなく、.scon (json)を指定することに注意してください。img00/フォルダ以下にサンプルファイルをいくつか入れときましたので、
ruby spritersconparser.rb girl_spriter.scon ruby spritersconparser.rb sample01.scon ruby spritersconparser.rb sample02.scon ruby spritersconparser.rb sample03.scon ruby spritersconparser.rb sample04.scon ruby spritersconparser.rb sample05.sconてな感じで確認できると思います。
他のスクリプトから呼び出して使いたいなら、以下の記述例を参考にしてください。
require 'dxruby'
require_relative 'spritersconparser'
ani = SpriterSconParser.new("img00/girl_spriter.scon")
ani.set_anime("default", "run")
Window.loop do
ani.draw(320, 240 + 120)
ani.update
end
水平垂直反転表示や、回転表示も対応済みです。詳しくは、doc/index.html を見てください。
◎ 現在分かってる不具合。 :
- Spriter上で全体を管理するボーンを入れようとした場合、0度以外で作ってしまうと、反転表示の向きがおかしくなる。全体を管理するボーンを入れる場合、0度のボーン(右方向に向かって伸びるボーン)にしてください。(※ 反転表示がおかしくなったときだけ気にすればいいと思います。)
- 処理が重い。使うとしたら、大きいボスキャラを一体だけ出す時ぐらいしか使えないかも…。プレイヤーキャラや、わらわら出てくる雑魚敵に使うと、たぶん処理落ちします。
- これは Spriter の問題ですが、時間の値が整数のみなので、60FPS (= 1フレーム16.666...ms) ピッタリのデータを作れません。1フレーム 16ms、62.5FPSで設定して、1秒 = 960ms (16ms x 60フレーム) と思いながらデータを作ればOKかなと。
もっとも、現状では、アタリ範囲等を指定できないので、そのままではゲーム内で使えないような気もしていますが…。Windows.drawEx() で描画してる部分を、Sprite へ値を設定する処理に書き換えれば、どうにかなってくれないものかしら。
まあ、スプライトエディタで連番画像をエクスポートして、それをDXRubyで表示して使うほうが全然楽ですけど。画像サイズ・容量が問題にならないなら、それが一番いいような気がします。
てなわけで、今回の記事は以上です。
明日の記事は、しのかろさんの _「DXRuby機能リクエスト」 です。
[ ツッコむ ]
#2 [dxruby] Advent Calendarのネタが無い時は
DXRuby Advent Calendar のネタが無い時は、DXRuby のサンプルスクリプトを紹介する記事を書くのもアリかもしれないなあと思いついたのでつぶやいてみるテスト。去年も誰かがそういうことを言ってた気もするのですが。
スクリプトを動かして、スクリーンショットをアニメGIFで撮って、ひたすら羅列していくだけでも、DXRuby がどんなライブラリか結構伝わりそうだな、という気もするし。
スクリプト数が多いから、たぶん1回の紹介じゃ終わらなくて。DXRuby 1.4.1 のサンプルスクリプトだけでも、フォルダ数で数えれば、
Ruby や DXRuby に全然詳しくなくても、動かしてスクリーンショットを撮って「こういうスクリプトだったよ」と言っていくだけだから、誰でも書ける。
場合によっては、その記事を元にして/スクリーンショットを使わせてもらって、DXRuby Wiki 上でちゃんとしたサンプル紹介ページにまとめることもできそう。何でもそうだけど、叩き台があれば、その後の作業が楽になるわけで。
問題は、スクリーンショットを撮って並べてく作業がメンドウクサイことですわな。トホ。
スクリプトを動かして、スクリーンショットをアニメGIFで撮って、ひたすら羅列していくだけでも、DXRuby がどんなライブラリか結構伝わりそうだな、という気もするし。
スクリプト数が多いから、たぶん1回の紹介じゃ終わらなくて。DXRuby 1.4.1 のサンプルスクリプトだけでも、フォルダ数で数えれば、
- classic_sample
- new_sample
- new_sample2
- scroll_sample
- shader_sample
Ruby や DXRuby に全然詳しくなくても、動かしてスクリーンショットを撮って「こういうスクリプトだったよ」と言っていくだけだから、誰でも書ける。
場合によっては、その記事を元にして/スクリーンショットを使わせてもらって、DXRuby Wiki 上でちゃんとしたサンプル紹介ページにまとめることもできそう。何でもそうだけど、叩き台があれば、その後の作業が楽になるわけで。
問題は、スクリーンショットを撮って並べてく作業がメンドウクサイことですわな。トホ。
[ ツッコむ ]
#3 [windows] Node.jsとかnpmとかインストール
テーブルもサポートしたMarkdown仕様 ―― 例えば GFM (GitHub Flavored Markdown) に沿って、エディタ上で打って、HTMLプレビューできないものかなと思ったわけですよ。
自分は Windowsユーザなので、普段は _MarkdownPad 2 を使ってるのですが。MarkdownPad 2 は有料版じゃないとテーブルをサポートしてないわけで。
ヨサゲなツールはないかな、とググってたら、marked なるツールがあり、それなら GFM もサポートしてるらしいと知ったので、インストールしてみようかなと。
しかし marked をインストールするには、Node.js、npm が必要らしくて。名前はよく見かけるんだけど、どうせ Windows だからインストールは…と半分諦めつつ調べたら、どうやら Windows でもインストールできる様子。だったら入れてみるかと。
以下を参考にしながら作業。
_簡単にNode.jsをインストールする【windows編】 - Qiita
_Windowsに Bower環境を Chocolatelyで整える - H2O BLOG
_npmでインストールしたライブラリが動かないと思ったらNODE_PATHを設定し忘れていた(Windows) - 唯物是真 @Scaled_Wurm
Chocolatey を使って、Node.js と npm をインストール。Chocolatey は Atomエディタをインストールする際に入れておいたはず…。
Chocolatey 経由でアプリやツールがインストールされる場所は、%ChocolateyInstall% で決まっているらしい。自分の環境では、以下の場所になってた。
Chocolatey のバージョンは、choco version で確認できる。
Node.js と npm をインストール。
以下がインストールされた。
node -v でバージョンが表示されるか確認。
環境変数 NODE_PATH を設定する。Windows の場合は、以下がグローバルなインストール場所になるらしい？
marked をインストールしてみた
場所を確認。
自分は Windowsユーザなので、普段は _MarkdownPad 2 を使ってるのですが。MarkdownPad 2 は有料版じゃないとテーブルをサポートしてないわけで。
ヨサゲなツールはないかな、とググってたら、marked なるツールがあり、それなら GFM もサポートしてるらしいと知ったので、インストールしてみようかなと。
しかし marked をインストールするには、Node.js、npm が必要らしくて。名前はよく見かけるんだけど、どうせ Windows だからインストールは…と半分諦めつつ調べたら、どうやら Windows でもインストールできる様子。だったら入れてみるかと。
以下を参考にしながら作業。
_簡単にNode.jsをインストールする【windows編】 - Qiita
_Windowsに Bower環境を Chocolatelyで整える - H2O BLOG
_npmでインストールしたライブラリが動かないと思ったらNODE_PATHを設定し忘れていた(Windows) - 唯物是真 @Scaled_Wurm
Chocolatey を使って、Node.js と npm をインストール。Chocolatey は Atomエディタをインストールする際に入れておいたはず…。
Chocolatey 経由でアプリやツールがインストールされる場所は、%ChocolateyInstall% で決まっているらしい。自分の環境では、以下の場所になってた。
> echo %ChocolateyInstall% C:\ProgramData\chocolatey
Chocolatey のバージョンは、choco version で確認できる。
> choco version found : 0.9.8.27 name : chocolatey latestCompare : 000000000000.000000000009.000000000008.000000000028 verMessage : A more recent version is available latest : 0.9.8.28 foundCompare : 000000000000.000000000009.000000000008.000000000027
Node.js と npm をインストール。
choco install nodejs.install choco install npm choco install nodejs
以下がインストールされた。
nodejs.install v0.10.33 npm v1.4.9 nodejs.commandline v0.10.33
node -v でバージョンが表示されるか確認。
> node -v v0.10.33
環境変数 NODE_PATH を設定する。Windows の場合は、以下がグローバルなインストール場所になるらしい？
C:\Users\ユーザー名\AppData\Roaming\npm\node_modules
marked をインストールしてみた
> npm install marked -g C:\Users\ユーザ名\AppData\Roaming\npm\marked -> C:\Users\ユーザ名\AppData\Roaming\npm\node_modules\marked\bin\marked marked@0.3.2 C:\Users\ユーザ名\AppData\Roaming\npm\node_modules\marked
場所を確認。
> which marked "C:\Users\ユーザ名\AppData\Roaming\npm\marked" "C:\Users\ユーザ名\AppData\Roaming\npm\marked.cmd"インストールできているっぽい。
◎ Atomエディタを使えばそもそもMarkdownのHTMLプレビューができた。 :
ここまでやっておいて気がついたのだけど。Atomエディタをインストールしてあるなら、Atom で Markdown の HTMLプレビューをすればよかったのでは…。
Atom で *.md を開いて、Ctrl + Shift + M を叩くと、HTMLプレビューウインドウが開く。素のMarkdown仕様ではなく、GFM (GitHub Flavored Markdown) に対応してるので、テーブル等の記述も使える。
最初からコレを使えばよかった。トホホ。
Atom で *.md を開いて、Ctrl + Shift + M を叩くと、HTMLプレビューウインドウが開く。素のMarkdown仕様ではなく、GFM (GitHub Flavored Markdown) に対応してるので、テーブル等の記述も使える。
最初からコレを使えばよかった。トホホ。
[ ツッコむ ]
#4 [nitijyou] 某所に行ってきた
朝に「直接来て作業してくれないとわからん」てなメールが来たので、電動自転車で行ってきた。AM10:30-11:45まで作業。
作業内容は、Inbox toolbar や 24x7Help その他のアンインストール作業と、業務用システム？で使うロゴ画像を修正するための作業の把握。
作業内容は、Inbox toolbar や 24x7Help その他のアンインストール作業と、業務用システム？で使うロゴ画像を修正するための作業の把握。
◎ Inbox toolbar の削除。 :
Inbox toolbar をインストールすると、IEの何かが書き換えられるようで、日本語ページ等が文字化けしてしまうので困る、との話で。
以下のページを参考にして作業。
_Inboxツールバーへの対処について - Yahoo!知恵袋
_最近また猛威を振るい始めたウィルス PCPowerSpeed/24×7Help/Inbox - NAVER まとめ
タスクマネージャで以下を終了させて。
コントロールパネル → プログラムの追加と削除で、以下をアンインストール。
OS再起動後、IEのホームページ設定や検索設定をデフォルトに戻す。
以下のページを参考にして作業。
_Inboxツールバーへの対処について - Yahoo!知恵袋
_最近また猛威を振るい始めたウィルス PCPowerSpeed/24×7Help/Inbox - NAVER まとめ
タスクマネージャで以下を終了させて。
PCPowerSpeed PCFixSpeed 24×7 Help Rebateinformer AppGraffiti Inboxとつくものすべて Crawler Toolbar Online Vault SiteRanker
コントロールパネル → プログラムの追加と削除で、以下をアンインストール。
PCPowerSpeed PCFixSpeed 24×7 Help Rebateinformer AppGraffiti Inboxとつくものすべて Crawler Toolbar Online Vault SiteRanker
OS再起動後、IEのホームページ設定や検索設定をデフォルトに戻す。
◎ ロゴ画像修正。 :
詳細はGRPでメモ。
[ ツッコむ ]
以上、1 日分です。