FC2ブログ

【第3回】マジカルハロウィンのデスクトップマスコットを作ってみよう!

どうも、カズズ軍曹です。

今回は第3回ということで、静止画像をデスクトップマスコットのように表示していきたいと思います。

今回の目標

静止画を表示する。
ウィンドウをデスクトップマスコット風に表示する。

下準備

さて、早速作っていこうと思うのですが、その前に一つやるべきことがあります。
現在、ソースコードのファイル名がtest.cppになっています。
大体のプロジェクトは、複数のソースファイルを使って作られることが多いため、testという名前では後々分かりづらくなると思います。
なので、main.cppという名前に変更しましょう

プロジェクトを開いて下さい。

desktop20200531-1.png

右側にソリューションエクスプローラーというボックスがあると思います。
ここにはプロジェクトに含まれるファイルの一覧が確認できます。

test.cppの名前を変更しましょう。右クリックで選択し、「名前の変更」を選択します。
desktop20200531-2.png

ソースファイルが複数ある場合、お互いを参照しあって動いていますので、こういう風な名前の変更は参照が崩れる場合がありよろしくないのですが、今回はまだ単独で動いていますのでこの方法で大丈夫です。
フォルダを見てみても名前が変わっていることが分かると思います。

desktop20200531-3.png

静止画像を表示させてみる

それでは、画像を表示させてみましょう。
マジハロのキャラクタの画像を使っていきたいところなのですが、まずは他の画像で上手く表示されるか試してみましょう。
私は今回、「いらすとや」の棒人間が立っているイラストを使わせていただきました。
みなさんも好きな画像を使って下さい。

画像を用意したら、プロジェクトフォルダ内のimageフォルダの中に画像を配置しましょう。
その時、画像の名前を「test.png」に変更しておいてください。拡張子がjpgでも出来なくはないですが、透過できるため、png形式が良いと思います。

desktop20200531-4.png

画像を用意できましたら、ソースコードの方を変更して画像を表示させてみましょう。

main.cppの中身を以下のように書き換えて下さい。

#include "DxLib.h"

int WINAPI WinMain(HINSTANCE,HINSTANCE,LPSTR,int){
  ChangeWindowMode(TRUE),DxLib_Init();

int test_g = LoadGraph("image/test.png"); //test.pngを読み込み
DrawGraph(0, 0, test_g, TRUE); //test.pngを描画する
      WaitKey();      // キー入力待ち
        DxLib_End();    // DXライブラリ終了処理
        return 0;
}

(見にくくてすみません、、、SyntaxHighlighterまた導入しておきます)

前回の6行目を削除して、このコードの6行目と7行目を追加する感じですね。
6行目では、test.pngをtest_gという名前で読み込んでいるというイメージです。
7行目でそれを描画しています。
文字列から想像が付くと思います。

それでは、F5キーを押して実行してみましょう。

desktop20200531-5.png

自分で用意した画像が表示されたと思います。
もし表示されなかった場合、ファイルパスが間違えてる可能性や保存先が間違えている可能性があるので確認してみてください。

画像が表示されたのは良いのですが、タイトルバーや黒背景など、デスクトップマスコットに要らない要素が沢山表示されています。
次項ではよりデスクトップマスコットに近づけていこうと思います。

タイトルバー、背景を非表示にする

まずは、タイトルバーを非表示にしていこうと思います。
4行目、5行目を以下のように変更してください。

4 SetWindowStyleMode(2); //ウィンドウスタイルを2に設定
5 ChangeWindowMode(TRUE),DxLib_Init();

SetWindowStyleMode(2) という文字列が追加されています。
これは、ウィンドウのスタイルを設定する関数です。
値に対応した設定は既に決められており、2を入れることで「タイトルバー無し、縁の太さは細い」が設定されます。

起動してみましょう。タイトルバーが消えたことが分かると思います。

desktop20200531-6.png

次に黒背景を消していきます。
黒背景を消すのもDXライブラリで用意されているのですが、画像処理の知識等が少し必要になってきます。私もあまり知識はなく、このシリーズでのプログラムの解説もできるだけ控えようと思っているので、以下のコードをコピーして使ってください。

こちらを参考にさせていただきました。
https://dxlib.xsrv.jp/cgi/patiobbs/patio.cgi?mode=view&no=3158

#include "DxLib.h"

int WINAPI WinMain(HINSTANCE,HINSTANCE,LPSTR,int){
//ウィンドウスタイルを(タイトル無し、縁細)に設定
SetWindowStyleMode(2);

//透過ウィンドウの使用設定
SetUseBackBufferTransColorFlag(TRUE);
//ウィンドウモードに変更
ChangeWindowMode(TRUE); 

//DXライブラリ初期化
DxLib_Init(); 

int screen;
int test_g;
int SoftImage;

//描画対象スクリーンを作成
screen = MakeScreen(640, 480, TRUE);
//デスクトップ画面を取り込むソフトウェア画像を作成
SoftImage = MakeARGB8ColorSoftImage(640, 480); 

//画像を読み込む際にアルファ値をRGB値に乗算するように設定する
SetUsePremulAlphaConvertLoad(TRUE);

//描画対象をアルファチャンネル画面に設定
SetDrawScreen(screen);

//test.pngを読み込む
test_g = LoadGraph("image/test.png");
//メインループ
while (ProcessMessage() == 0 && ClearDrawScreen() == 0) {

//ブレンドモードを乗算済みアルファに設定
SetDrawBlendMode(DX_BLENDMODE_PMA_ALPHA, 255);

//画面に表示する処理 ここから
DrawGraph(0, 0, test_g, TRUE); //test_gを表示

//ここまで

//描画先の画像をソフトイメージに取得する
GetDrawScreenSoftImage(0, 0, 640, 480, SoftImage);

//取り込んだソフトイメージを使用して透過ウインドウの状態を更新する
UpdateLayerdWindowForPremultipliedAlphaSoftImage(SoftImage);
}
    WaitKey();      // キー入力待ち
    DxLib_End();    // DXライブラリ終了処理
    return 0;
}


これで実行してみましょう!

desktop20200531-7.png

見事黒背景も消え、画像のみが表示されるようになりました!
まだ前画面固定など課題はありますが、かなりデスクトップマスコットに近くになりましたね!
今回のコードの改変で、キー入力でプログラムが終了しないように設定しましたので、終了する時はタスクバーからプログラムを終了させてください。

次回は色々な画像を表示させたり、マジハロキャラに置き換えたりしたいと思います。
それでは、また。

---シリーズ一覧---
第1回
第2回
第3回(今回)
第4回
関連記事

コメントの投稿

管理者にだけ表示を許可する

プロフィール

カズズぐんそー

Author:カズズぐんそー
岡山県在住の情報工学系の大学生です。
情報処理安全確保支援士試験合格。
麻雀とゲーム制作、低貸スロが趣味の自由人です。

最新記事
最新コメント
月別アーカイブ
カテゴリ
アクセスカウンター
オンラインカウンター
スポンサーリンク
検索フォーム
RSSリンクの表示
リンク
ブロとも申請フォーム

この人とブロともになる

QRコード
QR
メールフォーム

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