ExcelVBAゲームプログラミング?

初心者でもきっとできる!
Excelさえ持っていれば特別なソフトは不要!
すぐにでも始められる簡単ゲームプログラミング!
今すぐ始めよう!

サンプルやゲームのダウンロードができる別館も好評運営中です。
ご意見やご質問、ゲームの感想等は掲示板までお気軽に。是非、皆さんの声を聞かせてください。運営、開発の励みになります。



各種ダウンロードはコチラ ↓ 意見・感想・質問はコチラ ↓
影倉庫 Shadow warehouse サポート掲示板
ブログの全体像はコチラ ↓ リンクのページはコチラ ↓
サイトマップ 自分本位なリンク


スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。






Chapter.25 [ 画像表示の発展形 ]

■ゲームに於ける画像

さて、前回はゲーム画面となるユーザーフォーム上に、任意の画像を表示する方法を解説しました。
それには、イメージコントロールを使うのでしたね。
細かな設定方法は、前回を参照していただくのが手っ取り早いです。

さて、今回は、前回解説仕切れなかった、さらなる発展形のテクニックを解説したいと思います。これらをうまく活用することで、実際のゲームに使用するのに適したイメージコントロールが出来上がりますよ。

さて、それでは早速始めましょう。

今回は、次の画像を用意しましたので、使ってみてください。

FIGHTER_2.gif


この画像は、一見すると前回使った画像とほとんど同じに見えます。ですが、実は全然違います。それこそ天と地ほど違います。
その違いとは何でしょうか?

その違いとは、透過処理がしてあるかどうかです。
透過処理というのは、画像の一部あるいは全てに、透明な場所を設定することを言います。今回の画像は、キャラクターの部分以外の、余白となる部分が全て透明になるように処理されています。これにより、ゲーム画面上では、キャラクターの部分以外が透けて、背景が見えるように設定することも可能な状態になっています。
これについては、手順をおって、あとで詳しく説明します。

それでは、前回のときと同様に、イメージコントロールにサンプル画像ファイルをロードしてみましょう。
イメージコントロールのPictureプロパティを使って、画像ファイルをロードするんでしたね。
すると次のようになったと思います。

130_20071030121920.gif


これで準備は完了です。


■様々な視覚効果

さて、ここまでの画面で、前回の時との違いがわかるでしょうか。
まず第一に、ロードした画像のフチが表示されていませんね。前回は白いフチが表示されていましたが、今回はフチが表示されていないので、画像の境界がどこだかわかりません。
これは、画像に施した透過処理の影響です。
先にも述べたとおり、この画像は透過処理が施されていますので、キャラクターの部分以外は表示されません。そのため、イメージコントロールの地の色が透けて見えているのです。
ためしに、イメージコントロールのBackColorプロパティを変更してみましょう。BackColorプロパティは、コントロールの背景色を定義するプロパティでしたね。これは以前説明しました。これを変更すると、透過処理の意味がよくわかると思います。プロパティを変更するには、これまで同様プロパティウィンドウを使います。

131.gif

    ▼
132.gif

    ▼
133.gif

    ▼
134.gif


どうですか? イメージコントロールの背景色が、どんな色に変化しても、画像のフチは表示されません。つまり、キャラクター以外の部分は、透明な状態になっているのです。

しかし、画像自体は透過処理が施されていますが、これだけではまだゲームに使うのに最適な状態とは言えません。
なぜなら、ゲームに使うとなれば、ゲーム画面の背景が透けて見えていないと意味が無いからです。
そこで、イメージコントロール自体が、背景を透けて表示するように変更しなくてはいけません。その時に活躍するのが『BackStyleプロパティ』です。

BackStyleプロパティには、規定値で『FmBackStyleOpaque』が設定されています。これは、背景を不透明にする、つまり、背景が透けないように設定されているということです。このプロパティを、『fmBackStyleTransparent』に変更すると、イメージコントロール自体に透過処理が掛かり、背景が透けて見えるようになります。
BackStyleプロパティを変更して、背景が見えるようにすると、こんな感じになります。

135.gif


フォーム上のグリッドを表す点々が見えるようになりましたね。
これで、イメージコントロール自体が透明になりました。
ちなみに、これ以降の講座では、あえてプロパティウィンドウから設定できます、とか言いません。プロパティの変更は、基本的にプロパティウィンドウから変更できることを覚えておきましょう。


■実際に使える状態にする

ここまできたら、あとは仕上げの設定をします。

まず、前回と同様に、画像サイズとイメージコントロールのサイズをピッタリ同じに調節します。
これにはWidthプロパティやHeightプロパティを使うんでしたね。ただ単純にピクセルサイズを指定せず、ポイント単位に変換するのを忘れないように注意しましょうね。
今回の画像ファイルは、前回と同じ32ピクセルなので、ポイント単位に変換すると24ポイントになりますよ。

大きさの調整が済んだら、あとは余分な枠線を消してしまいましょう。
これにはBorderStyleプロパティを使います。
このプロパティの使い方は、前々回の講座でも解説しましたね。
BorderStyleプロパティに、fmBorderStyleNoneを設定すると、枠線が綺麗サッパリ消えてなくなります。

さて、ここまでくると、下の画像のようになったのではないでしょうか。

136.gif


この状態が、ゲームで使用する基本の状態と言えます。
ここでポイントとなるのは、以下の条件を満たしていることです。
・背景が透けている
・適切な大きさに調整されており余分な余白がない
・枠線などの無駄なものがない



■さらなる探求

ここから解説するのは、場合によっては役に立つことですが、実際には知らなくても問題のない部分です。興味のある方はご覧ください。まぁ、知っていれば色んなところで活用できますので無駄にはなりません。多分……。

①拡大縮小に対応させる
使用するプロパティPictureSizeModeプロパティ

規定値:fmPictureSizeModeClip
説明:表示しきれない部分は切り捨て。逆に余ってもほったらかし。

拡大縮小に対応する場合:FmPictureSizeModeStretch
説明:コントロールの大きさに応じて画像を伸縮させる。

使用例 ※使っている元画像は同じものですよ
137.gif


②並べて表示させる
使用するプロパティPictureTilingプロパティ

規定値:False
説明:コントロールが画像を上回るサイズでもひとつしか表示しない

並べて表示に対応する場合:True
説明:余ったところに画像を敷き詰めて、並べて表示する

使用例 ※使っている元画像は同じものです
138.gif


③画像を表示させる位置を変える
使用するプロパティPictureAlignmentプロパティ

規定値:FmPictureAlignmentCenter
説明:画像を中央に配置する

中央以外にする場合:上記の規定値以外に設定する
説明:左上、左下、右上、右下、に設定することが可能

使用例 ※使っている元画像は同じ(しつこい……)
139.gif


これらのプロパティをうまく活用することで、多彩な表現を行う事が可能になります。
例えば、①のPictureSizeModeプロパティをうまく使うと、死んだ敵キャラクターをだんだん小さくしてから消す、などのエフェクトをかけることができますよね。幅や高さが変わると、自動的に画像が伸縮するので、幅や高さを徐々に小さくしていくと、あたかも画像自体が縮んでいくように見えるというわけです。

他にも、②を活用すると、小さな画像を敷き詰めて、同じパターンの並んだ背景を表示させることもできます。ホームページの背景なんかではよく使われていますよね。あとデスクトップの壁紙とかでも、同じようなことができますし。

ただ、注意しておいてほしいのは、これらには優先順位があるということです。
①の拡大縮小をオンにしている状態では、②の並べて表示はできません。自動的に拡大してしまうわけですから、それを敷き詰めて並べることはできないのですね。
要するに、これらの組み合わせを様々に変えることによって、独自の表現を模索してほしい、ということです。こうしなければいけない、という決まりがあるわけではありません。自分の思い描いた表現になるように、試行錯誤してみてください。


■格言

透過処理した画像を上手に使う
プロパティを変更して様々な効果を生み出す


透過処理した画像をどうやって用意するかが問題ですね。
関連記事






Comment

Name
E-mail
URL
Comment
Pass  *
Secret? (管理者にだけ表示)

メールフォーム

影斬に物申すという方はこちら

名前 :
メール:
件名 :
本文 :

可能な限り要望には応えますが、必ず返信や回答ができることを、保障するものではありません。
ご了承ください。

Chapters

コンテンツ一覧


■Chapter 一覧■
    全てのChapterの一覧です。
    直接アクセスしたい方はこちらをご利用下さい。

    Chapter.1 [ 知っておくべき心得 ]
    Chapter.2 [ Excelってなんだろう ]
    Chapter.3 [ Excelの基本画面 ]
    Chapter.4 [ VBAとは? ]
    Chapter.5 [ モジュールについて ]
    Chapter.6 [ 変数 ]
    Chapter.7 [ 変数の型と宣言 ]
    Chapter.8 [ プロシージャとスコープ ]
    Chapter.9 [ ゲームつくる様々な手法 ]
    Chapter.10 [ ユーザーフォーム ]
    Chapter.11 [ プロパティウィンドウ ]
    Chapter.12 [ 乱数 ]
    Chapter.13 [ 条件分岐 ]
    Chapter.14 [ ゲーム画面のデザイン ]
    Chapter.15 [ コード記述の基本作法 ]
    Chapter.16 [ じゃんけんゲーム:1 名前をつける ]
    Chapter.17 [ じゃんけんゲーム:2 フォームの起動 ]
    Chapter.18 [ じゃんけんゲーム:3 乱数の種 ]
    Chapter.19 [ じゃんけんゲーム:4 イベント ]
    Chapter.20 [ じゃんけんゲーム:5 引数 ]
    Chapter.21 [ じゃんけんゲーム:6 役判定 ]
    Chapter.22 [ じゃんけんゲーム:7 予測と制限 ]
    Chapter.23 [ Withステートメント ]
    Chapter.24 [ 画像を表示させる ]
    Chapter.25 [ 画像表示の発展形 ]
    Chapter.26 [ 繰り返し処理 For文 ]
    Chapter.27 [ 繰り返し処理 Do~Loop文 ]
    Chapter.28 [ Exitステートメント ]
    Chapter.29 [ フォーム上の位置情報 ]
    Chapter.30 [ API基礎知識 ]
    Chapter.31 [ API補足知識 ]
    Chapter.32 [ メインループを考える ]
    Chapter.33 [ 同期処理の概念 ]
    Chapter.34 [ 移動処理その1:画面設定と考え方 ]
    Chapter.35 [ 移動処理その2:DoEvents ]
    Chapter.36 [ 移動処理その3:キー入力判定API ]
    Chapter.37 [ 条件分岐のさらなる探求 Select Case ]
    Chapter.38 [ アニメーション ]
    Chapter.39 [ 配列変数 ]
    Chapter.40 [ ゲームの初期化 ]
    Chapter.41 [ シューティングゲーム1:ゲーム設計 ]
    Chapter.42 [ シューティングゲーム2:メインプロセス ]
    Chapter.43 [ シューティングゲーム3:構造体 ]
    Chapter.44 [ シューティングゲーム4:定数 ]
    Chapter.45 [ シューティングゲーム5:プレイヤーキャラクター ]
    Chapter.46 [ シューティングゲーム6:ショットを撃つ① ]
    Chapter.47 [ シューティングゲーム7:ショットを撃つ② ]
    Chapter.48 [ シューティングゲーム8:Mod演算子の活用 ]
    Chapter.49 [ シューティングゲーム9:敵キャラクター登場 ]
    Chapter.50 [ シューティングゲーム10:衝突判定 ]
    Chapter.51 [ シューティングゲーム11:衝突の実体 ]
    Chapter.52 [ シューティングゲーム12:敵の攻撃 ]
    Chapter.53 [ シューティングゲーム13:爆発エフェクト ]
    Chapter.54 [ シューティングゲーム14:残機数表示① ]
    Chapter.55 [ シューティングゲーム15:残機数表示② ]
    Chapter.56 [ シューティングゲーム16:スコアの表示 ]
    Chapter.57 [ シューティングゲーム17:タイトル画面 ]
    Chapter.58 [ シューティングゲーム18:ボスキャラクター ]
    Chapter.59 [ シューティングゲーム19:最後の仕上げへ ]
    Chapter.60 [ シューティングゲーム20:いよいよ完成STG ]
    Chapter.61 [ カードゲームで使えるめくり効果 ]
    Chapter.62 [ ラジアンと角度 ]
    Chapter.63 [ ラジアンの活用:円運動 ]
    Chapter.64 [ ラジアンの活用:任意の角度へ移動する ]
    Chapter.65 [ APIによるサウンド再生:基礎 ]
    Chapter.66 [ APIによるサウンド再生:MIDIと多重再生 ]
    Chapter.67 [ APIによるサウンド再生:MCIコマンドとループ再生 ]
    Chapter.68 [ Function プロシージャ ]
    Chapter.69 [ 値渡しと参照渡し ]
    Chapter.70 [ デバッグ1:イミディエイトウィンドウ ]
    Chapter.71 [ デバッグ2:ローカルウィンドウ ]
    Chapter.72 [ デバッグ3:コード実行の中断 ]
    Chapter.73 [ オブジェクトってなんだ ]
    Chapter.74 [ プロパティ・メソッド・イベント ]
    Chapter.75 [ オブジェクト変数 ]
    Chapter.76 [ オブジェクトとコレクション ]
    Chapter.77 [ 特殊な繰り返し:For Each ]
    Chapter.78 [ エラー処理 ]
    Chapter.79 [ On Error と GoTo文 ]
    Chapter.80 [ Resumeステートメント ]
    Chapter.81 [ バイトとビット ]
    Chapter.82 [ ウィンドウメッセージとイベント ]
    Chapter.83 [ 文字列の基礎 ]
    Chapter.84 [ 文字列操作① ]
    Chapter.85 [ 文字列操作② ]
    Chapter.86 [ タイピングゲーム1:仕様を決める ]
    Chapter.87 [ タイピングゲーム2:キー入力検知 ]
    Chapter.88 [ タイピングゲーム3:文字列照合 ]
    Chapter.89 [ タイピングゲーム4:判定関数 ]
    Chapter.90 [ タイピングゲーム5:ゲーム画面設計 ]
    Chapter.91 [ タイピングゲーム6:問題文のソート ]
    Chapter.92 [ タイピングゲーム7:動的配列 ]
    Chapter.93 [ タイピングゲーム8:キーダウンイベント ]
    Chapter.94 [ タイピングゲーム9:正打数の表示 ]
    Chapter.95 [ タイピングゲーム10:タイムの表示 ]
    Chapter.96 [ クリックゲーム1:イベントの種類 ]
    Chapter.97 [ クリックゲーム2:画面設計 ]
    Chapter.98 [ クリックゲーム3:クリック座標検知 ]
    Chapter.99 [ クリックゲーム4:キャラクター準備 ]
    Chapter.100 [ クリックゲーム5:キャラクターの配置 ]
    Chapter.101 [ クリックゲーム6:キャラクター移動とNot演算子 ]
    Chapter.102 [ クリックゲーム7:クリックのヒット判定 ]
    Chapter.103 [ クリックゲーム8:ヒットマークエフェクト ]
    Chapter.104 [ クリックゲーム9:サウンド処理の実装 ]
    Chapter.105 [ クリックゲーム10:マウスカーソルの変更 ]
    Chapter.106 [ ブロック崩しゲーム1:仕様と概要を決める ]
    Chapter.107 [ ブロック崩しゲーム2:基本概念の確認 ]
    Chapter.108 [ ブロック崩しゲーム3:ベクトルとは ]
    Chapter.109 [ ブロック崩しゲーム4:変数や定数の宣言 ]
    Chapter.110 [ ブロック崩しゲーム5:初期化処理の実装 ]
    Chapter.111 [ ブロック崩しゲーム6:ブロックの配置 ]
    Chapter.112 [ ブロック崩しゲーム7:根幹処理とバーの処理 ]
    Chapter.113 [ ブロック崩しゲーム8:線分と線分の交差を判定 ]
    Chapter.114 [ ブロック崩しゲーム9:線分同士の交点 ]
    Chapter.115 [ ブロック崩しゲーム10:ボールの処理 ]
    Chapter.116 [ ブロック崩しゲーム11:最終調整して完成へ ]
    Chapter.117 [ テキストファイル操作基礎 ]
    Chapter.118 [ テキストファイル操作:読み込み編 ]
    Chapter.119 [ テキストファイル操作:CSV読み込み編 ]
    Chapter.120 [ テキストファイル操作:様々な読込編 ]
    Chapter.121 [ テキストファイル操作:バイナリ編 ]
    Chapter.122 [ テキストファイル操作:暗号化編 ]
    Chapter.123 [ テキストファイル操作:復号化編 ]
    Chapter.124 [ クラスモジュールとは ]
    Chapter.125 [ クラスモジュール:メソッド編 ]
    Chapter.126 [ クラスモジュール:プロパティ編 ]
    Chapter.127 [ クラスモジュール:イベント拡張編 ]
    Chapter.128 [ クラスモジュール:イベント自作編 ]
    Chapter.129 [ APIによる描画処理1:ハンドル ]
    Chapter.130 [ APIによる描画処理2:デバイスコンテキスト ]
    Chapter.131 [ APIによる描画処理3:ペン オブジェクト ]
    Chapter.132 [ APIによる描画処理4:ブラシ オブジェクト ]
    Chapter.133 [ APIによる描画処理5:図形描画準備編 ]
    Chapter.134 [ APIによる描画処理6:図形描画実践編 ]
    Chapter.135 [ APIによる描画処理7:画像描画の仕組み編 ]
    Chapter.136 [ APIによる描画処理8:ビットブロック転送編 ]
    Chapter.137 [ APIによる描画処理9:ラスタオペレーション ]
    Chapter.138 [ APIによる描画処理10:マスク描画 概念編 ]
    Chapter.139 [ APIによる描画処理11:マスク描画 実践編 ]


    コードやVBAに関する質問などはサポート掲示板(別館)までお気軽にどうぞ。




fc2 seotool Excel VBA ゲーム プログラミング 講座

Counter

twitter


Shadow BBS - 影掲示板

VBA 関連書籍



上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。