Flashゲーム作成の初心者がアクションスクリプトでテキストの描画位置を変える方法を教えてください

このQ&Aのポイント
  • Flashゲーム作成の初心者がアクションスクリプトを学び始めた際、テキストの描画位置を変える方法について困っています。
  • 画面上に指定したテキストを描画する際、縦方向の位置を変更することができず、困っています。
  • テキストの表示位置の縦方向を変更する方法を教えていただけないでしょうか?
回答を見る
  • ベストアンサー

アクションスクリプト ビットマップデータ 描画

Flashゲーム作成のため、アクションスクリプトを学び始めた初心者です。 ゲーム作成中にプレイヤーがミスをした場合、"MISS!!"という文字を画面に描画し、下から上へスクロールさせる処理を考えています。 ビットマップデータにテキストフィールドで指定したテキストを描画しているのですが、その描画位置を指定できなくて困っています。 canvas = new BitmapData(WIDTH, HEIGHT, true, 0x0);// 透明、初期色0x00000000 var bitmap:Bitmap = new Bitmap(canvas); bitmap.scaleX = bitmap.scaleY = 1;// 1倍表示 addChild(bitmap); var tf:TextField = new TextField(); tf.defaultTextFormat = new TextFormat("MS ゴシック", 50, 0xFF0E0E ,true); tf.width = stage.stageWidth; // 幅 tf.height = 50; tf.autoSize = TextFieldAutoSize.CENTER; tf.y = 240; tf.text = "MISS!!"; canvas.draw(tf); これで実行すると、画面上にMISS!!と表示されて、tf=240が適応されません、どうしたらテキストの表示位置の縦方向の位置を変えることができるのでしょうか?教えていただきたいです。

  • Flash
  • 回答数1
  • ありがとう数1

質問者が選んだベストアンサー

  • ベストアンサー
  • BlurFiltan
  • ベストアンサー率91% (1611/1754)
回答No.1

「TextField柄」で塗り潰すのですから その TextField がどこにあっても同じです。 場所は関係ありません。 例えば ハンカチの「花柄」。 「花柄」は「花柄」です。 「山のどの辺りに咲いていた花か」などのような 花が咲いていた位置は「花柄」には関係ありません。 もし咲いていた位置が要るのでしたら ハンカチを「山柄」などにするべきでしょう。 例えば「山柄」にした上でその中に「花」を描くべきです。 (山頂付近に花を描くとか,山の麓に花を描くとか…。)   というわけで, TextField の位置が要るのでしたら, TextField 入りの Sprite でも用意して その「Sprite 柄」でBitmapDataを塗れば良いと思います。 // ~~~以上は略~~~~~~~~~~~~ var tf:TextField = new TextField(); tf.defaultTextFormat = new TextFormat("MS ゴシック",50,0xFF0E0E,true); tf.width = stage.stageWidth;// 幅 tf.height = 50; tf.autoSize = TextFieldAutoSize.CENTER; tf.y = 240; tf.text = "MISS!!"; //---↑以上は変更ナシ↑--- //↓2行付け加え var sp:Sprite = new Sprite(); sp.addChild(tf); //↓引数をSpriteに変更 canvas.draw(sp); //(↓念のため参照を切っておきます) tf = null; sp = null; // ~~~~~~~~~~~~~~~~~~

nyanjirou7878
質問者

お礼

tf.y=240の位置に文字を表示することができました。 ありがとうございます。 まだSpriteやBitmapDataに関する知識が薄いので、見直してみようと思います。 本当にありがとうございました^^

関連するQ&A

  • 下記二つのbitmapDataに関するサンプルソースですが、なぜ問題な

    下記二つのbitmapDataに関するサンプルソースですが、なぜ問題なくaddChildされるのでしょうか? 普通に考えると上から下へパブリッシュされていると思っていたのですが、 厳密には違うということでしょうか? ---------------------------------- var txt:TextField = new TextField(); txt.text = 'あああ'; var bitmapdata = new BitmapData(txt.width,txt.height); var bmp:Bitmap = new Bitmap(bitmapdata); bitmapdata.draw(txt); addChild(bmp); ---------------------------------- bitmapdata.draw(txt); の記述位置をaddChild()の下に記述してもエラーが出ること無く実行されます。 しかし、 bitmapdata.draw(txt); の記述がなければエラーが出ませんが、描画されません。 ---------------------------------- var txt:TextField = new TextField(); txt.text = 'あああ'; var bitmapdata = new BitmapData(txt.width,txt.height); var bmp:Bitmap = new Bitmap(bitmapdata); addChild(bmp); bitmapdata.draw(txt); ---------------------------------- 単純にaddChild()した後に、draw()することができるということでしょうか? よろしくお願いいたします。

    • ベストアンサー
    • Flash
  • Paraflaで以下のようなスクリプトを書いたのですが、文字が表示され

    Paraflaで以下のようなスクリプトを書いたのですが、文字が表示されません。 何がいけないのでしょうか? var text_field = new TextField(); stage.addChild(text_field); text_field.border = true; text_field.x = 50; text_field.y = 100; text_field.width = 200; text_field.height = 20; text_field.Text = "表示テスト";

    • ベストアンサー
    • Flash
  • VB.NETのグラフィック描画で困っています

    VB.NETでのグラフィックの記述方法ですが 何かをクリックすると描画させるのではなく 単にあるsubプロシージャ内でグラフィックを描画させる記述する方法として pictureBox1.Image=New Bitmap(PictureBox1.width,pictureBox1.Height) Dim g As Graphics = Graphics.FromImage(PictureBox1.Image) を教えていただきました。そこで private sub xy_keisan() '座標を計算させるプロシージャ disp_x() 'x座標に目盛りを表示させるプロシージャ disp_Y() 'xの目盛り数によってY座標の位置を変えて表示させるプロシージャ end sub private sub disp_x() pictureBox1.Image=New Bitmap(PictureBox1.width,pictureBox1.Height) Dim g As Graphics = Graphics.FromImage(PictureBox1.Image) g.DrawLine(****** end sub private sub disp_y() pictureBox1.Image=New Bitmap(PictureBox1.width,pictureBox1.Height) Dim g As Graphics = Graphics.FromImage(PictureBox1.Image) g.DrawLine(****** end sub のような記述(引数とか細かい所は端折っています)ですとdisp_yは描画されていますが,disp_xは消えてしまいます。 pictureBox1.Image=New Bitmap(PictureBox1.width,pictureBox1.Height) が消えてしまう原因だとおもって宣言場所を変えてみましたが同じです 逆にこれが無いと描画させることが出来なくなります。 これの意味も今ひとつ判りません よろしくお願い致します

  • HTML5のcanvasで描画がされない

    HTML5のcanvas要素を使って描画をしようとしたのですが、図形が表示されません。 コードは以下の通りです。 ・index.html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>canvasで図形を描く</title> <script type="text/javascript" src="paint.js"></script> </head> <body onLoad="draw()"> <canvas id="mycanvas"width="800" height"800"> </canvas> </body> </html> ・paint.js function draw() { //描画コンテキストの取得 var canvas = document.getElementById('mycanvas'); if (canvas.getContext) { var ctx = canvas.getContext('2d'); ctx.arc(180,150,20,Math.PI*1,Math.PI*2,true); } } このコードでは(180,150)の位置に半径20の円が描画されるはずなのですが、何も表示されませんでした。 どこかコードに誤りがあるのでしょうか? よろしくお願いします。

  • 複数の変数宣言を、for文で一気にやる方法ってありますでしょうか?

    複数の変数宣言を、for文で一気にやる方法ってありますでしょうか? たとえば、tfという変数を3つ作りたいとき、 var tf1:TextField = new TextField(); var tf2:TextField = new TextField(); var tf3:TextField = new TextField(); ↑このように普通に書くのではなく for(var i:int=0; i<3; i++){  var this["tf" + i]:TextField = new TextField(); } ↑このようにfor文で一気に書こうとしたのですがエラーになります。 複数の変数宣言を、for文で一気にやる方法ってありますでしょうか? ご存知のかたいらっしゃいましたら、よろしくお願いいたします。

    • ベストアンサー
    • Flash
  • 有効桁数の数え方・誤差

    actionscriptをやっているのですが、有効桁数の数え方がよくわかりません。 たとえばNumber(有効桁数15桁)で public function sample() { var tf : TextField = new TextField(); var suuji : Number = 0.999; var suuji2 : Number = 1.001; var kekka : Number; kekka = suuji2 - suuji; tf.text = "" suuji2 + "-" suuji + "=" + kekka; } というものを実行させた場合kekkaが0.0019999999999998908になるのですが、この際の各々の変数の有効桁数は suuji 3桁 suuji2 4桁 kekka 0桁 という解釈で良いのでしょうか? そしてこの場合は桁落ちが起きていると言えるのでしょうか? また、この際にkekkaに誤差がでるのはNumberの有効桁数が15桁であるため、それ以降の桁に勝手に数字が入れられるということでしょうか? (0.999が勝手に0.9990000000000001092になる) もうひとつわからないことがあって、これは型の有効桁数を調べるプログラムなんですけど、 public function sample2() { var n : int; var sb : Number,sn : Number,t : Number; var tf : TextField = new TextField(); tf.border = true; tf.width = 400; tf.height = 300; n = 1; sn = t = 1.0; sb =0.0; while(sn != sb){ tf.appendText(n + ":" + sn + ":" + t + "\n"); n++; t = t / 10.0; sb = sn; sn = sb + t; } addChild(tf); } を実行すると 1:1:1 2:1.1:0.1 3:1.11:0.01 4:1.111:0.001 5:1.1111:0.0001 6:1.11111:0.00001 7:1.111111:0.0000010000000000000002 8:1.1111111:1.0000000000000002e-7 9:1.11111111:1.0000000000000002e-8 10:1.111111111:1.0000000000000003e-9 11:1.1111111111:1.0000000000000003e-10 12:1.11111111111:1.0000000000000003e-11 13:1.1111111111110001:1.0000000000000002e-12 14:1.1111111111111:1.0000000000000002e-13 15:1.11111111111111:1.0000000000000002e-14 16:1.1111111111111112:1e-15 と表示されるのですが、これだと16行目の有効桁数が16桁になっているのでしょうか? しかしそれだと型の有効桁数と矛盾するので、たまたま16桁目が1だっただけで有効桁数は15ということでしょうか? また、tに2や3の数字が勝手に入れらていますが、これも上記のように有効桁数ではない部分に勝手に数字を入れられているということでしょうか? 長文、また見辛く申し訳ありません。

  • C# PictureBoxへの描画を行うとメッセージボックスが表示されません。

    いつもお世話になっております。 ふと、PictureBoxに描画をしてみようかと思い Paintイベントに以下のようにして描画を行いました。   myBitmap = new Bitmap(pictureBox1.Width, pictureBox1.Height);   Graphics g = Graphics.FromImage(myBitmap);   pictureBox1.Image = myBitmap;      ・      ・(g.FillRectangle(・・・);など)      ・ (myBitmapはBitmap型のグローバル変数です。) PictureBoxは、自由にサイズ変更可能なフォームに貼り付け、四方をanchorで固めています。 そのためサイズが変更されるたびに、描画するときBitmapのサイズも変更しないといけないので この処理を毎回通っています。 (その部分が何だか無駄な気がするのですが、他にいい方法が思いつきませんでした。) ところが、描画はうまくいったのですが、メッセージボックスを出すと そのメッセージボックスが一度Altキーを押さないと表示されません。 色々調べて、ダブルバッファリングというものがあると知りました。 そこでPaintイベントで最初にこの処理をし   Image image = new Bitmap(pictureBox1.Width, pictureBox1.Height);   g = Graphics.FromImage(image); gに描画し終わってから   e.Graphics.DrawImage(image, 0, 0); としてみると、今度はフォームを移動するのにも一瞬フリーズするようになってしまいました。 (あまり深くプログラミングをしたことがないので、理解しきれなくてやり方が悪いのかも知れません・・・) メッセージボックスが表示されないのは、PictureBoxの描画のため 他のコントロールの描画ができていなためだと推測しているのですが どう直していいかわかりません。 どなたか、わかる方がいましたらよろしくお願いします。 <補足> OS:Vista VisualStudio2008 .NET Framework3.5

  • Androidアプリ開発 画像の回転について

    CANVASに画像を表示し、その画像を回転させるようにしたいのですが、どうにもうまくいかなくて困っています。 画像の中心を軸に回転させたいと思って以下のように実装してみたのですが、うまくいきません。 //////////////////////////////以下抜粋//////////////////////////////// Matrix matrix; // Bitmap のサイズの取得 int width = bmp.getWidth(); int height = bmp.getHeight(); matrix = new Matrix(); // 画像の中心を軸に回転させるようにする(ここがうまくいっていないっぽい・・・) matrix.postRotate(5.0f, width / 2.0f, height / 2.0f); // 回転させた画像を生成する bmp2 = Bitmap.createBitmap(bmp, 0, 0, width, height, matrix, true); // CANVASに画像を描画する canvas.drawBitmap(bmp2 , 10.0f, 10.0f, paint); ////////////////////////////////////////////////////////////////////// 上記のコードで画像自体は回転するのですが、中心軸がずれてしまっているようです。 画像のサイズは横15ピクセル、縦15ピクセルとなっております。 また、matrix.postRotateの前でmatrix.postTranslate()にて軸を設定してみたのですが、 これもうまくいきませんでした。 きれいに画像を回転させるにはどのようにすればよいか、わかる方いましたら教えて いただけないでしょうか?

    • ベストアンサー
    • Java
  • SuzukaのAction Scriptについて

    SuzukaでのAction Scriptについて質問があります。 スプライト(インスタンス名:c_sprite)の中にテキスト(変数名、インスタンス名:c_text)を配置して、 _rootより、Action Scriptによってこのテキストの色を変更しようとしました。 しかしながら、色が変わりません。 当該部分のプログラムは以下のとおりです。 var c_text_tf = new TextFormat(); c_text_tf.color = 0x0000FF; _root.c_sprite.c_text.setNewTextFormat(c_text_tf); _root.c_sprite.c_text = "■"; テキストは次のように設定しています。 ・自動サイズ、ダイナミックテキストにチェック ・それ以外(テキスト入力、HTMLなど)はチェックなし ・文字は「■」を埋め込み ・初期テキストなし どのようにすれば改善できるでしょうか。 よろしくお願いいたします。

    • ベストアンサー
    • Flash
  • drawImageの描画順序の指定について

    いつもお世話になっております。 drawImageメソッドを使用し、Canvasへ画像を描画するプログラムを作成しています。 画像は全部3枚あり、座標をずらしてすべて重ねて表示します。 画像のファイルサイズはすべて異なります。 画像描画のタイミングは選択中のセレクトボックスの項目に変更があった場合です。 この際、フォームの情報によって描画順序を決定します。 本題ですが、現在のコーディングですと、指定した描画順序のとおりに描画されません。 複数の画像に対してonloadを使用しており、画像の読み込みが完了した順番に描画 されているような気がします。指定したとおりに描画できる方法はないでしょうか? ・html <canvas id=main width=160 height=160 style=border:1px solid gray></canvas> <form> <hr> 描画順序 <select name=order onChange=Main(this.form)> <option value=0>1,2,3</p> <option value=1>1,3,2</p> <option value=2>2,1,3</p> <option value=3>2,3,1</p> <option value=4>3,1,2</p> <option value=5>3,2,1</p> </select> </form> ・外部ファイル(js) function Main(f) { var canvas = document.getElementById('main'); if (!canvas || !canvas.getContext) { return false; } var Canvas = canvas.getContext('2d'); Canvas.clearRect(0, 0, 320, 240); var Image1 = new Image(); var Image2 = new Image(); var Image3 = new Image(); if (f.order.value == 0) { Image1.onload = function() { Canvas.drawImage(Image1, 0, 0); } Image2.onload = function() { Canvas.drawImage(Image2, 20, 20); } Image3.onload = function() { Canvas.drawImage(Image3, 40, 40); } Image1.src = GetImageFileName(1); Image2.src = GetImageFileName(2); Image3.src = GetImageFileName(3); } else if (f.order.value == 1) { Image1.onload = function() { Canvas.drawImage(Image1, 0, 0); } Image3.onload = function() { Canvas.drawImage(Image3, 20, 20); } Image2.onload = function() { Canvas.drawImage(Image2, 40, 40); } Image1.src = GetImageFileName(1); Image3.src = GetImageFileName(3); Image2.src = GetImageFileName(2); } else if (f.order.value == 2) { Image2.onload = function() { Canvas.drawImage(Image2, 0, 0); } Image1.onload = function() { Canvas.drawImage(Image1, 20, 20); } Image3.onload = function() { Canvas.drawImage(Image3, 40, 40); } Image2.src = GetImageFileName(2); Image3.src = GetImageFileName(3); :(以降省略) よろしくお願いいたします。

専門家に質問してみよう