HSPポータル
サイトマップ お問い合わせ


HSPTV!掲示板


未解決 解決 停止 削除要請

2011
1219
ミント「Artlet2D」 を使って 「画像を回転」 させたい11解決


ミント

リンク

2011/12/19(Mon) 16:43:44|NO.43847

どうもこんにちは。そうでない方は始めまして。


STG製作も大詰めになってきました。
その中でどうしてもPNGを使いたい場面があったためプラグインなどを探してました。
そして自分が一番使いやすいと思った【Artlet2D】を使うことにしました。


  -本題です-
「Artlet2D」を使って画像を表示できたのですが、画像の回転が出来なくって困っています。
「過去スレ、ネット検索」したのですが、自分が望むものはございませんでした。
自分の理解力が足りないせいかもしれませんが「ヘルプ」を見てもわからなかったので質問させていただきました。

アドバイスでもいいので教えていただければ幸いです。


  -以下ソース-

#include "a2d.hsp" ;Artlet2Dを使う ;仮想イメージを作成 alCreateImage 1,640,480 ;[P1,ID] [P2,横幅] [P3,高さ] ;画像ファイルから仮想イメージを作成 alCreateImageByFile 1,"自機.PNG";[P1,ID] [P2,読み込みファイル名] ;座標変換パラメータを設定 (回転してコピー) alTransModeRotateAt 50,14,20 ;[P1,回転角度] [P2,回転の中心X座標] [P3,回転の中心Y座標] ;画像コピー alCopyImageToScreen 1,0,100,100,29,41,1,0 /*/ [P1,コピー元の Image ID] [P2,コピー先のHSPスクリーン ID] [P3,コピー先矩形 左上X座標] [P4,コピー先矩形 左上Y座標] [P5,コピー矩形 幅] [P6,コピー矩形 高さ] [P7,コピー元矩形 左上X座標] [P8,コピー元矩形 左上Y座標] /*/ redraw

コメントで「P1とかP2」とか書かれているのはその役割です。
コメントで補足してあって少し見づらいかもしれませんがご了承くださいませ(初めての試みです)



この記事に返信する


晩御飯

リンク

2011/12/19(Mon) 23:12:00|NO.43851

こんばんわ
間にスクリーンを一枚かませないとだめみたいです
#include "a2d.hsp"
// スクリーンのIDに注意 // 1: 画像を読み込む用 // 2: 回転させる用 ;仮想イメージを作成 alCreateImage 1,640,480 ;画像ファイルから仮想イメージを作成 alCreateImageByFile 1,"自機.PNG" // 回転用のスクリーンを用意 alCreateImage 2 ;座標変換パラメータを設定 alTransModeRotateAt 50,14,20 // 回転させてコピー alCopyImageToImage 1, 2 // 画面にコピー alCopyImageToScreen 2, 0 redraw



ミント

リンク

2011/12/20(Tue) 09:46:55|NO.43856

>>晩御飯さん
基準命令じゃない質問に対して回答ありがとうございます!


なんとなくIDを指定しないといけない気がしたのですが・・・なるほど。
別スクリーンを作成して間に挟めばいいのですね。これで画像回転ができました!
これに関しては解決です!ありがとうございます!



が・・・!自分がやりたいことをやったら望みどおりにいかなかった!
ちなみにやりたいことは【画像をその場で回転させる】なんです・・・
回転させれば出来ると思ったんです・・・なんかごめんなさい・・・

しかしこの回転って【その座高を中心にした回転】なんだね・・・
もうちょっと調べてみます orz


  -以下ソース-

#include "a2d.hsp" ;仮想イメージを作成 alCreateImage 1,640,480 rag = 0.0 ; 回転用変数を宣言 ;***************メインループ************ *メイン redraw 0 : color : boxf ;***************カウンター************** color 255,255,255 pos 0,0 : mes "ragの数 " + rag ;*************************************** ;画像ファイルから仮想イメージを作成 alCreateImageByFile 1,"結晶.png" ;仮想イメージを作成 alCreateImage 2 ;回転用のスクリーンを用意 ;座標変換パラメータを設定 (回転) alTransModeRotateAt rag, 320,240 ;回転角度を加算すればいけるかと思ってた時期が(ry ;回転させてコピー alCopyImageToImage 1,2, 320,240, 64,64 ,1,0 ;画面にコピー alCopyImageToScreen 2,0, rag += 0.5 ; 回転用変数を加算 redraw : await 1 goto *メイン



 -基準命令での回転-

buffer 1 picload "自機.bmp" gsel 0,1 rag = 0.0 ; 回転用変数を宣言 ;***************メインループ************ *メイン redraw 0 : color : boxf ;*************************************** color ,255 pos 100,100 gmode 4,29,41,255 grotate 1,1,0,rag ; 回転して描画 rag += 0.1 ; 回転用変数を加算 redraw 1 : await 1 goto *メイン



通りすがり

リンク

2011/12/20(Tue) 10:55:40|NO.43857

こんな感じでやる見たいです。

#include "a2d.hsp" ;仮想イメージを作成 ;alCreateImage 1,640,480 ;画像ファイルから仮想イメージを作成 file = dir_exe + "\\sample\\demo\\logop.bmp" alCreateImageByFile 1,file alGetFileWidth file, sizex, sizey ;仮想イメージを作成 alCreateImage 2 ;回転用のスクリーンを用意 deg = 0.0 ; 回転用変数を宣言 ;***************メインループ************ *メイン redraw 0 : color : boxf color 255,255,255 : pos 0,0 : mes "ragの数 " + deg ;座標変換パラメータを設定 (回転) alTransModeRotateAt deg, ginfo_winx/2,ginfo_winy/2 ;回転させてコピー alCopyImageToImage 1,2, (ginfo_winx-sizex)/2,(ginfo_winy-sizey)/2;, sizex,sizey ,0,0 ;画面にコピー alCopyImageToScreen 2,0;, 0, 0, ginfo_winx, ginfo_winy, 0, 0 deg += 0.5 ; 回転用変数を加算 redraw : await 1 goto *メイン



ポチ

リンク

2011/12/20(Tue) 13:45:15|NO.43860

STGの完成・・・楽しみにしています。
頑張って下さい!



fortunehill

リンク

2011/12/20(Tue) 15:02:15|NO.43861

Bufferへの読み込みだけArtlet2でやって回転はcelputじゃ駄目なの?

buffer 1 boxf #include "a2d.hsp" alCreateImage 0,640,480 if (stat = -1) {end} alCreateImageByFile 0,dir_exe+"\\sample\\demo\\logop.bmp" alCopyImageToScreen 0,1,0,0 alDeleteImage 0 gsel 0,1 celdiv 1,360,148,180,74 pos 100,100 for ii,0,362,2 redraw 0 :boxf pos 320,240 celput 1,0,1,1,deg2rad(ii) redraw 1 wait 2 next



ミント

リンク

2011/12/20(Tue) 23:19:45|NO.43872

>通りすがりさん
回答していただきありがとう御座います。


ある程度は理解したのですが、説明しろ!と言われたらあうあうなので
もうちょっと時間をくださいませ・・・とりあえず返事のみで失礼させていただきます。
(何とか明日中には説明できたいな)



ミント

リンク

2011/12/21(Wed) 10:07:25|NO.43875

おはようございます。

やっていることがわかりました。
見たことがない命令で少し苦戦してました・・・(ginfo_winx)
んで、理解したところで自分なりに改造しちゃいました・・・これでいいのかな?



#include "a2d.hsp" ;仮想イメージを作成 ;alCreateImage 1,640,480 ;画像ファイルから仮想イメージを作成 alCreateImageByFile 1,"結晶.png" ;画像ファイルの幅、高さを取得 alGetFileWidth "結晶.png", sizex, sizey deg = 0.0 ; 回転用変数を宣言 ;***************メインループ************ *メイン redraw 0 : color : boxf ;***************カウンター************** color 255,255,255 pos 0,0 : mes "ragの数 " + deg ;*************************************** ;仮想イメージを作成 alCreateImage 2 ;回転用のスクリーンを用意 ;座標変換パラメータを設定 (回転) alTransModeRotateAt deg, 100, 100 ;回転させてコピー alCopyImageToImage 1,2, 100 - (sizex / 2), 100 - (sizey / 2) ;画面にコピー alCopyImageToScreen 2,0 deg += 0.5 ; 回転用変数を加算 redraw : await 1 goto *メイン



>>alTransModeRotateAt deg, 100, 100
回転の中心座標を置きたい場所として考えて(ダメだろ
数値を指定します。


>>alCopyImageToImage 1,2, 100 - (sizex / 2), 100 - (sizey / 2)
置きたい場所 - 画像の大きさ / 2 をやります (100 - 64/2 → 100-32 → 68)

これで画像の左上が「68」に置かれます。
そして回転の中心である「100,100」に来ると、画像の中心である「32」と重なります。
画像の中心が、回転の中心と重なるので、その場で回転します。


だいぶ計算方式変えちゃいましたけど・・・これでよかったんだろうか・・・
でも、自分にとってこっちのがわかりやすかったので改良しちゃいました ><
アドバイスとソースありがとうございます!



余談だけど、さらに一歩進んだことを今やっています。
そのときに「通りすがりさん」の計算方式か、私の計算方式の方がわかりやすいかわかるかも知れません。
もし一歩進んだことがわからなかったら質問しますが、その時もよろしくお願いいたします (なるべくギブアップはしたくないな・・・) 



ミント

リンク

2011/12/21(Wed) 10:28:53|NO.43876

>ポチさん
応援のお言葉ありがとうございます。
大詰めとかいっときながら、まだやることが沢山あったりします・・・!

「自機、タイトル、敵、ボス、BGM、SE」とまだまだある・・・


ってかまだ1面しか出来てないので、大詰めという言い方はおかしかった・・・orz
けど仰るとおりがんばるしかないですね!



>fortunehillさん
次はこのソースを解析だー!しばしお待ちを・・・



通りすがり

リンク

2011/12/21(Wed) 15:56:21|NO.43878

>ミントさん
参考になった様で何よりです。

>見たことがない命令で少し苦戦してました・・・(ginfo_winx)
もうご存知かと思いますが、これは命令ではなくマクロとして定義されています。
コンパイル前に ginfo_winx から ginfo(12) に置き換えられます。

>>alTransModeRotateAt pa, px, py
個人的にはこの命令は仮想画面を画用紙に見立てて
px, py の位置に画びょうを刺して pa ぶんクルクル回すイメージの方が分り易いですが
理解してやっていれば自分の分かりやすい様にやれば良いと思いますよ。
頑張ってください。



ミント

リンク

2011/12/21(Wed) 23:07:06|NO.43879

>fortunehillさん
回答していただきありがとうございます (長いです)


なるほど、これはこれでいいですね。

けど自分の持っている画像64*64のを試してみたら、若干ぶれるようです。
「何で若干ぶれるのか?」かはもうちょっと時間をかけないとわからないです。
とりあえず、64*64の場合・・・



#include "a2d.hsp" buffer 1 boxf ;仮想イメージを作成 alCreateImage 0,640,480 ;結果が整数値で代入される //if (stat = -1) {end} ;画像を正しく読み込めなかった場合、プログラム終了 ;画像ファイルから仮想イメージを作成 alCreateImageByFile 0,"結晶.png" alCopyImageToScreen 0,1 ;画像コピー alDeleteImage 0 ;仮想イメージを削除 gsel 0,1 ;HSPのスクリーン ID celdiv 1, 64,64, 32,32 ;画像素材の分割サイズを設定 /*/ P1: ウインドゥID P2: 横方向の分割サイズ ;画像の大きさを指定 P3: 縦方向の分割サイズ ;画像の大きさを指定 P4: 横方向の中心座標 ;画像の大きさの半分 P5: 縦方向の中心座標 ;画像の大きさの半分 /*/ // pos 100,100 for ii,0,362,2 ;変数名,初期値,終値,増分 redraw 0 : boxf pos 100,100 ;座標 (画像の半分がこの座標に来る) celput 1,0,1,1,deg2rad(ii) ;画像素材を描画 /*/ P1: 画像素材を持つウインドゥID P2: 分割画像No. P3: 横方向の表示倍率(実数) P4: 縦方向の表示倍率(実数) P5: 回転角度(単位はラジアン) /*/ redraw 1 : wait 2 next ;指定回数繰り返し終了


色々書いてあるのは自分が始めて見る命令なのです・・・(多すぎだろ)
for文に関してはC言語やってからめっきり使わなくなったので忘れてましたね・・・

けどこれだとずっと回らないからメインループ作って、ループさせたほうがいいかも?
ってなわけで改良してみた。



#include "a2d.hsp" ;Artlet2Dを使います宣言 buffer 1 : boxf ;画像ファイルから仮想イメージを作成 alCreateImageByFile 0,"結晶.png" ;画像ファイルの幅、高さを取得 alGetFileWidth "結晶.png", sizex, sizey ;画像コピー alCopyImageToScreen 0,1 ;仮想イメージを削除 alDeleteImage 0 gsel 0,1 ;HSPのスクリーン ID celdiv 1, sizex,sizey, sizex / 2,sizey / 2 ;画像素材の分割サイズを設定 ;***************メインループ************ *メイン redraw 0 : color : boxf ;*************************************** pos 100,100 ;座標 (画像の半分がこの座標に来る) celput 1,0, 1,1, deg2rad(deg) ;画像素材を描画 deg += 1 ; 回転用変数を加算 redraw : await 1 goto *メイン


早さである「deg」の数値を5とかに変えるとぶれるのがわかりますね。
>for ii,0,3000,10
for文の場合は終了値を(とりあえず)多めに設定して、増加量を変えるれば確認できるかと。


う〜ん。PNGだからおきるのだろうか?よくわからないなぁ・・・
ってなわけで円形の画像を用意して使ったら、やっぱりぶれて見えますね。
「bmp」形式でも同じ現象になることを確認しましたので、画像形式が問題じゃないようです。

> alCreateImageByFile 0,dir_exe+"\\sample\\game\\face.bmp"
この名前のファイルはちょうど64*64なんですよね。
んで、チェックしてみたけど、わかりずらい・・・orz
ってな生首ェ・・・



ちなみに私の「結晶.png」というのは・・・

ttp://commons.nicovideo.jp/material/nc14192

ニコニコ動画のコモンズにあるものを使用しております(頭にhを入れるの忘れないでね!)
(あくまでイメージ画像として使っています。作品を配布する場合は自分で作ります)


 -直リンクじゃ信頼できない人向け-
1:ニコニコ動画
2:一番上の「その他」にある「コモンズ」に移動
3:「素材ライブラリー」のタブに移動
4:右にある「検索サポート」を開く
5:キーワードで「東方」
6:「作品分類」を画像のみにして検索
7:その中の「低速移動のアレ」をDLすればおk!



ミント

リンク

2011/12/21(Wed) 23:20:44|NO.43880

>通りすがりさん
わざわざお返事ありがとうございます!


よく見たらマクロでしたた!
コンパイル前からなのか・・・そりゃすごいな・・・
いや、だからこそのマクロか。


>>個人的にはこの命令は仮想画面を画用紙に見立てて
>>px, py の位置に画びょうを刺して pa ぶんクルクル回すイメージの方が分り易いですが
私の場合は、適当な位置にコンパスを刺して、そこから円を描くイメージをしておりました。
通りすがりさんの考えかたで「pa ぶんクルクル回す」でだいぶイメージしやすくなりました。

今思えばそのコンパスどの位置から円を描くんだよ!っということを思いつけば理解が早かったかもです・・・w


そして応援のお言葉ありがとうございます。
次はなるべく質問じゃなく発表にしたいな!(フラグ → おいやめろ)
まあ、次のやっているやつも難しいんだが、そこはがんばるしかない・・・!


皆様。回答とアドバイスとソースありがとうございます!



ONION software Copyright 1997-2023(c) All rights reserved.