プログラミング言語KuinまとめWiki
プログラミング言語KuinまとめWiki

Draw

標準ライブラリ - Draw

説明

Drawは、文字や画像や3Dデータといったものを動かしたり、変形して表示させたりすることが出来るメソッドを多数持っています。
ステージ全体に効果を与えるものと、クラスからインスタンスを生成してごにょごにょするものと2種類あるので、注意しよう。


所有メソッド

LoadTex(path:[]char) : @CTex

説明

指定したファイルパスに存在するテクスチャ(俗にいう画像ファイル)をロードします。
この処理はそこそこ重たいので極力呼び出さないようにしましょう(基本は初回のみで)
ちなみに解放処理はオートでやってくれます。メモリ解放忘れで闇だった旧GBerryとは違うのだ(しろめ)

引数

  • path:[]char
    • ファイルパスを指定します
    • dbgresディレクトリからの相対パスにも対応しています。
    • 指定することが出来るテクスチャデータは、KuinTexを使用して.kntexというファイルフォーマットに変換したもののみが使用出来ます。

戻り値

  • Draw@CTex
    • Draw@CTex型のクラスインスタンスが返ります。
    • このLoadTexで得たクラスインスタンスを利用して、表示とか変形とかの処理を行います。

サンプルコード(Ver0.031)

  1. func Main()
  2. 	{Draw@CTexの項で嫌ほど使うので省略します}
  3. end func

LoadFont(path:[]char) : @CFont

説明

指定したファイルパスに存在するフォントデータ(.ttfとかとか)をロードします。
この処理はそこそこ重たいので極力呼び出さないようにしましょう(基本は初回のみで)
ちなみに解放処理はオートでやってくれます。メモリ解放忘れで闇だった旧GBerryとは違うのだ(しろめ)

引数

  • path:[]char
    • ファイルパスを指定します
    • dbgresディレクトリからの相対パスにも対応しています。
    • 指定することが出来るフォントデータは、ttcやttfでは動作を確認しました。(TrueTypeフォント系は少なくとも大丈夫っぽい。)

戻り値

  • Draw@CFont
    • Draw@CFont型のクラスインスタンスが返ります。
    • このLoadFontで得たクラスインスタンスを利用して、色んな(≒任意の)文字列のテクスチャーデータを生成することができます。

サンプルコード(Ver0.031)

  1. func Main()
  2. 	{Draw@CFontの項で嫌ほど使うので省略します}
  3. end func

LoadObj(path:[]char) : @CObj

説明

指定したファイルパスに存在する3Dデータ(独自形式knobj)をロードします。
この処理はそこそこ重たいので極力呼び出さないようにしましょう(基本は初回のみで)
ちなみに解放処理はオートでやってくれます。メモリ解放忘れで闇だった旧GBerryとは違うのだ(しろめ)

引数

  • path:[]char
    • ファイルパスを指定します
    • dbgresディレクトリからの相対パスにも対応しています。
    • 指定することが出来る3Dデータは、KuinObjで変換したものでは動作を確認しました

戻り値

  • Draw@CObj
    • Draw@CObj型のクラスインスタンスが返ります。
    • このLoadObjで得たクラスインスタンスを利用して、表示とか変形の処理を行います。

サンプルコード(Ver1.00)

  1. func Main()
  2. 	{Draw@CObjの項で嫌ほど使うので省略します}
  3. end func


テンプレメソッド(ひきすー:ひきすうかたー) : もどりちー

説明

テンプレメソッドの説明をここにー

引数

  • ひきすー:ひきすうかたー
    • ひきすーのせつめー

戻り値

  • もどりちかたー
    • もどりちせつめいー

サンプルコード(Ver0.031)

  1. func Main()
  2. 	{素敵なソースコードをここにー}
  3. end func


CTex

説明

Kuinでテクスチャ(画像)を扱う為に使うクラスです。
基本的には[#LoadTex]メソッドの戻り値でインスタンスを得るため、このクラスを自分でインスタンス生成することはないです[要出典]
ちなみに、このクラスのコンストラクタを呼び出すと、16#00010006の実行時エラーを吐きます。

補足

なお、今回の説明で、何ぶん画像がないと説明しづらい部分があるので、特別にくいなちゃんを用意しました(256x256)。
このくいなちゃんを｢kuina.png｣で保存し、KuinTexで｢kuina.png.kntex｣となったものを｢kuina.kntex｣にリネームし、以降のサンプルコード中に使用するものとする。

所有メソッド

Draw(sx:float,sy:float,sw:float,sh:float,dx:float,dy:float,r:float,g:float,b:float,a:float) : なし

  • 説明
このインスタンスに指定されている.kntexの画像データを、指定した座標や色情報を元にKuin上に表示します。
このメソッドはDrawScaleのラッパーです。つまりは、拡大率100%(拡大縮小無し)の、DrawScaleを内部で呼び出してるのと全く同じです。
  • 引数
    • sx : float
      • 略称はおそらく「ソースx座標」の意味だと思います
      • 画像ファイルの中の、表示したい左上の座標のx座標を指定します。
      • いつもは0.0だと思いますが、例えばbullet.pngに色んな弾をまとめて1枚の画像としてkntexに変換した時なんかに、左上の座標を切り替えるだけで、1つのインスタンスから何種類もの弾丸を取り出すことが出来ます。こうすることで扱いやすさ的にも処理速度的にもプラスに出来ます。
    • sy : float
      • 略称はおそらく「ソースy座標」の意味だと思います
      • sxのy座標バージョンです。
      • 正直浮動小数点である理由はよく分かりません。整数のピクセル値以外を左上の座標に指定するメリットがある場面が想像出来ませんし、○○.0って打つ作業が面倒くさいのでint型にして欲しいです（消される）
    • sw : float
      • 略称はおそらく「ソースwidth(横幅)」の意味だと思います
      • 画像ファイルの中の、表示したい横幅pxを指定します
      • 解釈を変えれば、(右下のx座標 - 左上のx座標)の座標を指定するとも取れますね。
    • sh : float
      • 略称はおそらく「ソースheight(縦幅)」の意味だと思います
      • 画像ファイルの中の、表示したい縦幅pxを指定します
      • 解釈を変えれば、(右下のy座標 - 左上のy座標)の座標を指定するとも取れますね。
      • どうでもいいけどsw,shに関してもint型に（ｒｙ
    • dx : float
      • 略称はおそらく「ディスプレイx座標」の意味だと思います
      • Kuin上の表示したいx座標を指定します。
      • 0.0と指定したら左端に画像が表示されるし、100.0と指定したら左側から100px右に移動した位置に表示されます。
    • dy : float
      • 略称はおそらく「ディスプレイy座標」の意味だと思います
      • Kuin上の表示したいy座標を指定します。
      • 0.0と指定したら上端に画像が表示されるし、100.0と指定したら上側から100px下に移動した位置に表示されます。
    • r : float
      • 画像の赤っぽさ成分を指定します。
      • 基本的には1.0で。赤っぽさを弱めたい場合には0.0に近づけると赤っぽくなくなります。
    • g : float
      • 画像の緑っぽさ成分を指定します。
      • 基本的には1.0で。緑っぽさを弱めたい場合には0.0に近づけると緑っぽくなくなります。
    • b : float
      • 画像の青っぽさ成分を指定します。
      • 基本的には1.0で。青っぽさを弱めたい場合には0.0に近づけると青っぽくなくなります。
    • a : float
      • 画像の不透明度成分を指定します。
      • 基本的には1.0で。不透明度を弱めたい場合には0.0に近づけると＼ｱｯｶﾘｰﾝ／します
  • 戻り値
    • なし
      • ないよっ
  • サンプルコード(Ver0.031)
  1. func Main()
  2. 	var kuinaImage : Draw@CTex :: Draw@LoadTex("kuina.kntex") {kntexファイルをLoadしてくる}
  3. 	while(true)
  4. 		do Kuin@Act()
  5.  
  6. 		{
  7. 			kuina.kntexの画像ファイルから、
  8. 			座標(0,0)の位置から横幅256px、縦幅256pxを取り出し
  9. 			Main_dbg.exeウィンドウの左上から(100,100)の位置に
  10. 			RGBAの全てを100%出力で、画像を表示させる
  11. 		}
  12. 		do kuinaImage.Draw(0.0,0.0,256.0,256.0,100.0,100.0,1.0,1.0,1.0,1.0)
  13. 	end while
  14. end func

DrawScale(sx:float,sy:float,sw:float,sh:float,dx:float,dy:float,dw:float,dh: float,r:float,g:float,b:float,a:float) : なし

  • 説明
画像の表示だけならDrawで行えますが、画像の拡大縮小を考慮した上で表示したい場合は、こちらのDrawScaleを使用します
拡大縮小ができるってだけで、基本的にはDrawと一緒なので、引数もDrawと異なる部分だけを説明します
なお、dwやdhに負数を入れることで、画像の左右反転や上下反転が可能になります。
かなりエグいサンプルコードを用意しましたので、参考になりませんがそちらもどうぞ。
  • 引数
    • sx : float
    • sy : float
    • sw : float
    • sh : float
    • dx : float
    • dy : float
    • dw : float
      • 略称はおそらく「ディスプレイwidth(横幅)」の意味だと思います
      • Kuin上の表示したい横幅を指定します。
      • swと同じにしたら等倍で表示されるし、swの2倍の値を入れたら2倍横長になります
      • 負数を入れたら左右反転します。そこそこ重要なテクニックです。
    • dh : float
      • 略称はおそらく「ディスプレイheight(縦幅)」の意味だと思います
      • Kuin上の表示したい縦幅を指定します。
      • shと同じにしたら等倍で表示されるし、shの2倍の値を入れたら2倍横長になります
      • 負数を入れたら上下反転します。そこそこ重要なテクニックです。
    • r : float
    • g : float
    • b : float
    • a : float
  • 戻り値
    • なし
      • ないよっ
  • サンプルコード(Ver0.031)
  1. func Main()
  2. 	var kuinaImage : Draw@CTex :: Draw@LoadTex("kuina.kntex") {kntexファイルをLoadしてくる}
  3.  
  4. 	const FPS  : int :: 30 {Ver0.031では30fpsなので30という定数を入れる}
  5. 	var scale  : float
  6. 	var sin    : float
  7. 	var cos    : float
  8. 	var dy     : float
  9. 	var width  : float
  10. 	var height : float
  11.  
  12. 	while(true)
  13. 		do Kuin@Act()
  14.  
  15. 		{
  16. 			kuina.kntexの画像ファイルから、
  17. 			座標(0,0)の位置から横幅256px、縦幅256pxを取り出し
  18. 			Main_dbg.exeウィンドウの左上から(200,100)の位置で、横幅128px、縦幅128pxを基準の大きさにして
  19. 			横幅の値を1秒周期で-128~128に変化させ、あたかもdx:100pxを中心に横方向回転してるかの如く表現し
  20. 			縦幅の値を1秒周期で96~160に変化して、パースを付けて立体感を表現する
  21. 			その際に、y座標にバイアスをかけて位置に違和感がないようにする
  22. 			RGBAの全てを100%出力で、画像を表示させる
  23. 		}
  24.  
  25. 		do scale  :: ((Kuin@Cnt()-1)%FPS*12) $ float {FPS(30)で割った余りを12倍してfloatにキャストすると0≦scale<360の値になる}
  26. 		do scale  :* Lib@Pi / 180.0       {それをπ/180倍することで、ラジアンの値に変換する}
  27. 		do sin    :: Lib@Sin(scale)       {それをsinの値にすると、 0⇒+1⇒ 0⇒-1⇒ 0の順番で値が変化していく}
  28. 		do cos    :: Lib@Cos(scale)       {それをcosの値にすると、+1⇒ 0⇒-1⇒ 0⇒+1の順番で値が変化していく}
  29. 		do width  :: cos * 128.0          {cosを128倍すると、        +128⇒   0⇒-128⇒  0⇒+128の順番で値が変化していく}
  30. 		do height :: 128.0 + (sin * 32.0) {sinを32倍して128に足すと、+128⇒+160⇒+128⇒+96⇒+128の順番で値が変化していく}
  31. 		do dy     :: -((sin * 32.0)/2.0)  {heightの増分の半分の大きさの符号反転の値だけy方向に移動させることで、違和感を無くす}
  32. 		do kuinaImage.DrawScale(0.0,0.0,256.0,256.0,200.0,100.0+dy,width,height,1.0,1.0,1.0,1.0)
  33.  
  34. 		{理解の助けになるように、widthだけ変化させたものを400,400に表示します}
  35. 		do kuinaImage.DrawScale(0.0,0.0,256.0,256.0,400.0,400.0,width,128.0,1.0,1.0,1.0,1.0)
  36.  
  37. 		{理解の助けになるように、height(とdy)だけ変化させたものを50,400に表示します}
  38. 		do kuinaImage.DrawScale(0.0,0.0,256.0,256.0,50.0,400.0+dy,128.0,height,1.0,1.0,1.0,1.0)
  39. 	end while
  40. end func

DrawRot(sx:float,sy:float,sw:float,sh:float,dx:float,dy:float,dw:float,dh: float,cx:float,cy:float,angle:float,r:float,g:float,b:float,a:float) : なし

  • 説明
画像を回転させる必要もある場合にはこのDrawRotを使用します。
これも毎度のことながら、DrawScaleとほぼ同じなので、引数の説明は適宜省略していきます。
  • 引数
    • sx : float
    • sy : float
    • sw : float
    • sh : float
    • dx : float
    • dy : float
    • dw : float
    • dh : float
    • cx : float
      • 略称はおそらく「サークル(円形)x座標」の意味だと思います。もしかしたら「センター(中心)x座標」かもしれない。
      • 回転中心となるx座標を指定します。これはdxからの相対値です。
      • どういう回転をさせるかにもよるけど、大抵はdwの半分の値か、0.0だと思いますね。
    • cy : float
      • 略称はおそらく「サークル(円形)y座標」の意味だと思います。もしかしたら「センター(中心)y座標」かもしれない。
      • 回転中心となるy座標を指定します。これはdyからの相対値です。
      • どういう回転をさせるかにもよるけど、大抵はdhの半分の値か、0.0だと思いますね。
    • angle : float
      • 回転する角度を指定します。
      • 単位はラジアンです。degreeだと思ってドヤ顔で360.0とか打たないでください死んでしまいます
    • r : float
    • g : float
    • b : float
    • a : float
  • 戻り値
    • なし
      • ないよっ
  • サンプルコード(Ver0.031)
  1. func Main()
  2. 	var kuinaImage : Draw@CTex :: Draw@LoadTex("kuina.kntex") {kntexファイルをLoadしてくる}
  3.  
  4. 	const FPS : int :: 30 {Ver0.031では30fpsなので30という定数を入れる}
  5. 	var angle : float
  6.  
  7. 	while(true)
  8. 		do Kuin@Act()
  9.  
  10. 		{
  11. 			kuina.kntexの画像ファイルから、
  12. 			座標(0,0)の位置から横幅256px、縦幅256pxを取り出し
  13. 			Main_dbg.exeウィンドウの左上から(100,100)の位置で、横幅128px、縦幅128pxに縮小して
  14. 			また、回転中心を(64.0,64.0)として、1秒間に1回転するスピードでぐるぐる回す
  15. 			RGBAの全てを100%出力で、画像を表示させる
  16. 		}
  17.  
  18. 		do angle :: ((Kuin@Cnt()-1)%FPS*12) $ float {FPS(30)で割った余りを12倍してfloatにキャストすると0.0≦angle<360.0の値になる}
  19. 		do angle :* Lib@Pi / 180.0 {それをπ/180.0倍することで、ラジアンの値に変換する}
  20. 		do kuinaImage.DrawRot(0.0,0.0,256.0,256.0,100.0,100.0,128.0,128.0,64.0,64.0,angle,1.0,1.0,1.0,1.0)
  21. 	end while
  22. end func

Width() : float

  • 説明
読み込んだ.kntexファイルの横幅を得ます。メソッドなので、当然Getterです。
  • 引数
    • なし
      • ないよっ
  • 戻り値
    • float
      • .kntexファイルの横幅(px)を返します。
  • サンプルコード(Ver0.031)
  1. func Main()
  2. 	var kuinaImage : Draw@CTex :: Draw@LoadTex("kuina.kntex") {kntexファイルをLoadしてくる}
  3. 	do Dbg@Log("横幅は" ~ kuinaImage.Width().ToStr() ~ "pxです") {横幅は256pxです と表示される}
  4. end func

Height() : float

  • 説明
読み込んだ.kntexファイルの縦幅を得ます。メソッドなので、当然Getterです。
  • 引数
    • なし
      • ないよっ
  • 戻り値
    • float
      • .kntexファイルの縦幅(px)を返します。
  • サンプルコード(Ver0.031)
  1. func Main()
  2. 	var kuinaImage : Draw@CTex :: Draw@LoadTex("kuina.kntex") {kntexファイルをLoadしてくる}
  3. 	do Dbg@Log("縦幅は" ~ kuinaImage.Height().ToStr() ~ "pxです") {縦幅は256pxです と表示される}
  4. end func


CFont

説明

Kuinで文字を表示させる場合に便利なクラスとしてCFontがあります。
CFontはttf(TrueTypeFont)のようなデータを利用して表示させるため、従来のKuin0.02xのように、自分で文字を画像化して。。。の作業を簡単化＆動的化できるスグレモノです。是非マスターしましょう。

補足

なお、この説明の本筋とは逸れますが、PCにすでにインストールされているフォントのデータを取り出す方法を紹介します。(Win7のみです。それ以外のOSは各自ググってください)
  1. コントロールパネルを開きます
  2. 表示方法を｢カテゴリ｣にします
  3. デスクトップのカスタマイズを選択します
  4. ページが遷移されるので、項目の中から｢フォント｣を選択します
  5. ページが遷移され、フォント一覧が出てくるので、その中から使用したいフォントをコピーします
  6. コピーしたフォントデータをKuin側のdbgresディレクトリに突っ込めばバッチリです。

所有メソッド

MakeTex(size:int,str:[]char,margin:int) : Draw@CTex

  • 説明
Draw@LoadFontメソッドで読み込んだCFontを文字の書かれたCTexに変換します。
このメソッドの戻り値であるCTexデータは、.kntexからLoadTexした場合と同様に、Drawメソッド等で描画できます。
PhotoShop等のソフトを使用している方なら、｢フォントデータのラスタライズを行います｣と説明すれば分かりやすいんじゃないでしょうか。
このメソッドはそんなに頻繁に呼び出すべきではないのは確かなのですが、ノベルゲーム等、文字の自動スクロールなどを実装する場合は頻繁に呼び出さざるを得ない場面があり、悲しみを生みます。
しかしLoadFontと明確に役割が分割されたので旧GBerryよりは高速化も図れていい着地点についたのではないでしょうか。
  • 引数
    • size : int
      • フォントサイズを指定します
      • pxと必ずしも一致するとは限りません。というか大抵一致しません。あくまでフォントサイズなので注意。
    • str : []char
      • テクスチャー化するときの文字を指定します
      • ここに与える文字を、数フレームごとに増やしていくと、ノベルゲームっぽい自動スクロールも作れます。詳しくはサンプルコードで。
    • margin : int
      • 文字の間の余白を指定します。
      • きっちりつめて表示するなら0、だだっ広く表示するなら正の整数、重ねて表示させるなら負の整数を入れます。
      • ちなみに余談ですがこのメソッド単体では複数行に対応していません。
      • CFont.MakeFontメソッドで複数個のCTexを作成して、それのDrawする位置を調節することで、複数行には対応します。故に行間設定は存在しません。
  • 戻り値
    • Draw@CTex
      • 作成された文字のテクスチャが返ります。CTexの使い方は、Draw@CTexを参照されたし。
  • サンプルコード
  1. func Main()
  2. 	const FPS : int :: 30
  3.  
  4. 	var fontData : Draw@CFont :: Draw@LoadFont("meiryo.ttc")
  5. 	var fontMes : []char :: "くいなちゃん６さい"
  6. 	var fontImage : Draw@CTex :: fontData.MakeTex(24,fontMes,0)
  7.  
  8. 	var fontMesStream : []char :: ""
  9. 	var fontImageStream : Draw@CTex :: fontData.MakeTex(24,fontMesStream,0)
  10. 	var showCnt : int :: 0
  11.  
  12. 	{Width()やHeight()を使えば文字テクスチャーの長さがpxで取得できる}
  13. 	do Dbg@Log("横幅 : " ~ fontImage.Width().ToStr() ~ ",縦幅 : " ~ fontImage.Height().ToStr())
  14.  
  15. 	while(true)
  16. 		do Kuin@Act()
  17.  
  18. 		{(50,50)の位置に、文字を表示する}
  19. 		do fontImage.Draw(0.0,0.0,fontImage.Width(),fontImage.Height(),50.0,50.0,1.0,1.0,1.0,1.0)
  20.  
  21. 		{(50,100)の位置に、0.5秒ごとに1文字づつ表示させる}
  22. 		if(Kuin@Cnt()%(FPS/2) = 0)
  23. 			if(showCnt < fontMes.Len())
  24. 				do fontMesStream :~ fontMes[showCnt].ToStr()
  25. 				do showCnt :+ 1
  26. 			else
  27. 				do fontMesStream :: ""
  28. 				do showCnt :: 0
  29. 			end if
  30. 			do fontImageStream :: fontData.MakeTex(24,fontMesStream,0) {テクスチャーの更新}
  31. 		end if
  32. 		{
  33. 			RGBAの部分を調節することで文字の色を変更することも可能
  34. 			例えば、16#21E9DF(水色っぽい感じの色)を表示させたかったら、
  35. 			rに 「(16#21 $ float) / (16#ff $ float)」の値を
  36. 			gに 「(16#e9 $ float) / (16#ff $ float)」の値を
  37. 			bに 「(16#df $ float) / 816#ff $ float)」の値を
  38. 			それぞれ与えてやれば、水色っぽい色になる。
  39. 		}
  40. 		do fontImageStream.Draw(0.0,0.0,fontImageStream.Width(),fontImageStream.Height(),50.0,100.0,(16#21$float)/(16#ff$float),(16#e9$float)/(16#ff$float),(16#df$float)/(16#ff$float),1.0)
  41. 	end while
  42. end func


ソースコードをUTF-8で保存しないと全角文字が文字化けします！（情報置いとくので整備おねがいします・・・）



CObj

説明

Kuinで3Dモデルを扱う為に使うクラスです。

補足


所有メソッド

Draw(tex:CTex , normal:CTex , group:int , anim:float) : なし

  • 説明

  • 引数
    • tex : CTex
      • 3Dモデルに使用するテクスチャの画像を指定します。LoadTexで作成したオブジェクトを指定してください。
      • nullでも動作しますが、3Dモデルの表面は真っ黒になります。
    • normal : CTex
      • 3Dモデルの表面の凹凸を表す画像を指定します。LoadTexで作成したオブジェクトを指定してください。
      • 使用しない場合はnullを指定してください
    • group : int
      • 描画する3Dモデル内のグループの番号(0から始まるインデックス)を指定してください。
    • anim : float
      • アニメーションのキーフレームを指定する。0.0なら1番目のキー、1.0なら2番目のキーになり、0.5なら1番目と2番目のキーの中間の変形具合になります。
  • 戻り値
    • なし
      • ないよっ
  • サンプルコード(Ver1.00)
  1. func Main()
  2. 	var model : Draw@CObj :: Draw@LoadObj("sample.knobj") {knobjファイルをLoadしてくる}
  3. 	var tex : Draw@CTex :: Draw@LoadTex("kuina.kntex") {kntexファイルをLoadしてくる}
  4.  
  5. 	while()
  6. 		do Kuin@Act()
  7.  
  8. 		{
  9. 			ここにはいい感じサンプルコードと説明が書かれる予定
  10. 		}
  11.  
  12. 		do model.Draw(tex, null, 0, 0.0)
  13. 	end while
  14. end func

タグ：

+ タグ編集
  • タグ：

このサイトはreCAPTCHAによって保護されており、Googleの プライバシーポリシー と 利用規約 が適用されます。

タグの更新に失敗しました
エラーが発生しました。ページを更新してください。
ページを更新
「Draw」をウィキ内検索
最終更新：2014年02月09日 20:44
添付ファイル