ホームへ戻る

 2.1章 画像を表示する(改)

 2章からはDXライブラリの基本的な関数を一つずつ紹介していきます。

2章は簡単な関数のみ紹介しているので、肩の力を抜いてご覧下さい。

画像の表示の仕方は1章で既にお伝えしましたが、DXライブラリの最も基本的な関数の紹介となればやはりこの関数なので、

改めて2章でもう一度紹介します。

本章では、2つの画像を重ねて描画してみます。描画するのはサンプルフォルダに入っている以下の2つの画像です。

   
 画像/キャラクタ00.png 画像/キャラクタ01.png 

サンプルプログラムをご覧ください。画像/キャラクタ01.pngを描画してから、画像/キャラクタ00.pngを描画しています。


#include "DxLib.h"

int WINAPI WinMain(HINSTANCE,HINSTANCE,LPSTR,int){
        ChangeWindowMode(TRUE), DxLib_Init(), SetDrawScreen( DX_SCREEN_BACK ); //ウィンドウモード変更と初期化と裏画面設定

        int x = 0;
        int Handle00, Handle01;     // 画像格納用ハンドル
        Handle00 = LoadGraph( "画像/キャラクタ00.png" ); // 画像のロード
        Handle01 = LoadGraph( "画像/キャラクタ01.png" ); // 画像のロード

                // while(裏画面を表画面に反映, メッセージ処理, 画面クリア)
        while( ScreenFlip()==0 && ProcessMessage()==0 && ClearDrawScreen()==0 ){

                DrawGraph( x/2, 0, Handle01, TRUE ); //画像の描画
                DrawGraph( x,   0, Handle00, TRUE ); //画像の描画
                x++; // xを1増やす

        }
        
        DxLib_End(); // DXライブラリ終了処理
        return 0;
} 

実行結果


プログラムは上から下に実行されますから、画像/キャラクタ01.pngを描画してから、画像/キャラクタ00.pngを描画します。

当然上書きするわけですから、後から描いたものの方が上になります。

従って画像/キャラクタ01.pngを描画することで、画像/キャラクタ00.pngが隠れてしまうわけです。では描画の順番を逆にするとどうなるでしょうか。

#include "DxLib.h"

int WINAPI WinMain(HINSTANCE,HINSTANCE,LPSTR,int){
        ChangeWindowMode(TRUE), DxLib_Init(), SetDrawScreen( DX_SCREEN_BACK ); //ウィンドウモード変更と初期化と裏画面設定

        int x = 0;
        int Handle00, Handle01;     // 画像格納用ハンドル
        Handle00 = LoadGraph( "画像/キャラクタ00.png" ); // 画像のロード
        Handle01 = LoadGraph( "画像/キャラクタ01.png" ); // 画像のロード

                // while(裏画面を表画面に反映, メッセージ処理, 画面クリア)
        while( ScreenFlip()==0 && ProcessMessage()==0 && ClearDrawScreen()==0 ){

                DrawGraph( x/2, 0, Handle00, TRUE ); //画像の描画
                DrawGraph( x,   0, Handle01, TRUE ); //画像の描画
                x++; // xを1増やす

        }
        
        DxLib_End(); // DXライブラリ終了処理
        return 0;
}  

実行結果




今度は画像/キャラクタ01.pngを上から上書きしたにも関わらず、キャラクタの部分だけ上書きされています。

これは画像そのものに「透過」が設定されているからです。

pngという画像形式を使うとピクセルごとに「透過度」と設定することができ、画像/キャラクタ01.pngは、キャラクタの周りを予め全透過してあるのです。

「そんな画像どうやって用意するの?」と思った方は「補足資料2章. 透過処理をした画像を用意する」をお読みください。

DrawGraph関数 の最後の引数は

DrawGraph( x/2, 0, Handle00, TRUE );

この透過を行うか行わないかの指示です。TRUEを渡すと透過を行い、FALSEを渡すと透過を行いません。

使い分けるのが面倒な時は、全て「TRUE」にして構いません。

→分からないことがあれば掲示板で質問して下さい


- Remical Soft -