====== 細かいところを追加していく パート１ ======
===== タイトル画面 =====
タイトル真っ暗なんだよねぇ。。。\\
みんなphotshopとか使えるし、デザインの授業を受けているので、タイトル画面のロゴくらい作れるよね？\\
作ってはっつけてみよう。\\
僕は、デザインとかできないのでPowerPointのワードアートと図形を使って画像を作りました。\\
ロゴっぽいもの作って、グループ化して右クリック⇒図として保存で、画像化できるよ（授業で教えたよね？）\\
図形の塗りつぶしを、塗りつぶしなしにしておいてpngで保存すれば透明部分が勝手にできるので便利\\
<figure creating_logo>
{{game-engineer:classes:2023:something-else:summertime-special-cource:スクリーンショット_2023-08-17_120130.png?300|ロゴ作成中}}
<caption>ロゴの作成</caption>
</figure>

出来たら、貼り付けていこう。\\
まず、Mainでアセット化、ついでにゲームスタートをクリックからスペースキープッシュに変えよう。\\
スタートメッセージ用のフォントもアセットで準備\\

<code cpp Main.cpp>
    FontAsset::Register(U"STARTFONT", 30, Typeface::Bold);
    TextureAsset::Register(U"TITLELOGO", U"images/costcomanlogo.png");
</code>

TileUpdateで、スペースが押されたらスタートに変更、TitleDrawでロゴを描く！\\

<code cpp gameSequence.cpp>
void UpdateTitle(GAME_STATE& _state)
{
	if (スペースキー押されたら)
	{
		_state = GAME_STATE::PLAY;
	}
}

void DrawTitle()
{
	Scene::SetBackground(Palette::White);
        //Scene::Center()はPoint型返すから、位置調整したいときはPoint{}でどのくらいずらすか決めて、足し算してやるといいよ（便利）
	TextureAsset(U"TITLELOGO").resized(700).drawAt(Scene::Center() + Point{0, -80});
	FontAsset(U"STARTFONT")(U"Push SpaceKey to Start Cleaning up")
		.drawAt(Scene::Center() + Point{0, 50},Palette::Midnightblue);
	FontAsset(U"font")(U"TITLE_SCENE").drawAt(Scene::Center()+Point{0,250}, Palette::Black);
}
</code>

=== タイトル作成例 ===
<figure sample_of_title>
{{game-engineer:classes:2023:something-else:summertime-special-cource:スクリーンショット_2023-08-17_130254.png?300|タイトル画面の例}}
<caption>タイトル画面作成例</caption>
</figure>

===== ＊と＋ =====

さてここまで来て問題（質問）です。\\
コンソール版で'+'と'*'は何を表したでしょうか？\\
正解は（越後製菓）。。。\\

<code cpp>
enum OBJNAME {
	FLOOR, WALL, LUGG, GOAL, HUMAN, HUMAN_ON_GOAL, LUGG_ON_GOAL
};
const string OBJS[] = { " ", "#", "$", ".", "@", "+", "*" };
</code>
これを見るとわかるけど、HUMAN_ON_GOAL, LUGG_ON_GOALだね。\\
２キャラが重なっている場面を表している文字である。\\
Siv3D版では、これを記号じゃなくTextureの配列にしているので、何番のテクスチャが何か見ると([5]と[6]みればいいね）\\
<code cpp gameSequence.cpp>
	Texture ObjImg[7]{
		TextureAsset(U"FLOOR"),
		TextureAsset(U"WALL"),
		TextureAsset(U"LUGG"),
		TextureAsset(U"GOAL"),
		TextureAsset(U"PLAYER"),
		TextureAsset(U"PLAYER"),
		TextureAsset(U"LUGG"),
	};
</code>
PLAYERとLUGG、多分一番上にいそうなキャラを描画しているのが、現状である。\\
しかしながら、初めからプレイヤーとゴールが重なってスタートしている状態や、初めから荷物がゴールに重なっていて、そこから移動しなければならない場合も、ステージによっては存在する。\\
そういう時には、キャラが重なっていないかどうか判別する機能が欲しくなるよね。そこでこんな機能を追加しよう！\\
__<color #00a2e8>Shiftキーを押すと、HUMAN_ON_GOAL, LUGG_ON_GOALの時は、ゴールが透けて見える。</color>__

<figure transparent_add>
{{game-engineer:classes:2023:something-else:summertime-special-cource:スクリーンショット_2023-08-17_131809.png?300}}
{{game-engineer:classes:2023:something-else:summertime-special-cource:20230817-131812-709.png?300}}
<caption>画像の透過（見づらいときはクリックしてガン見）</caption>
</figure>

=== 半透明描画の追加 ===
半透明はSiv3D様にとっては簡単で、\\
以下のように描画処理を書くと、実現できる\\
画像を２枚重ねて、上の画像を半透明（透明度０．５）で描画するには\\
<code cpp>
    Texure ue;   //上に乗ってる半透明にする画像
    Texure sita; //下にある画像
           
    sita.draw(座標);                 
    ue.draw(座標, ColorF{ 1.0, 0.5 }); //1.0は色なので変えないで。0.4は不透明度 1.0が不透明 0に近づくと透明になっていく
</code>

これを使って、HUMAN_ON_GOAL, LUGG_ON_GOALのオブジェクトを発見した時だけ透明度を0.5にして描画すればよい\\

=== 描画ソースコードの更新 ===
<codeblock update_draw_method>
<caption>描画処理の更新</caption>
<code>
	Texture ObjImg[7]{
		TextureAsset(U"FLOOR"),
		TextureAsset(U"WALL"),
		TextureAsset(U"LUGG"),
		TextureAsset(U"GOAL"),
		TextureAsset(U"PLAYER"),
		TextureAsset(U"PLAYER"),
		TextureAsset(U"LUGG"),
	};

	for (int j = 0; j < _map.stage_height; j++) {
		for (int i = 0; i < _map.stage_width; i++) {
			OBJNAME objNum = GetObjectNum({ i,j }, _map);
			if (objNum != 7)
			{
				ObjImg[FLOOR].draw(i * CHR_SIZE, j * CHR_SIZE);
				ObjImg[GetObjectNum({ i,j }, _map)].draw(i * CHR_SIZE, j * CHR_SIZE);
			}
		}
	}
</code>
</codeblock>

現在は、描画部分でその位置のオブジェクトを取得して、オブジェクト番号に応じた画像を、スクリーンの対応位置に描画する。という処理になっているはず\\
オブジェクト番号7番の時は、ステージ外なので無視する。(もっといい書き方あるよね笑）\\
これを、オブジェクト番号が5,6の時に半透明で描画する処理を書いていく\\
正直すっきり書く方法があまり思いつかなかったので、わかりやすくこう書いていく\\
<codeblock update_draw_method>
<caption>描画処理の更新</caption>
<code>
	Texture ObjImg[7]{
		TextureAsset(U"FLOOR"),
		TextureAsset(U"WALL"),
		TextureAsset(U"LUGG"),
		TextureAsset(U"GOAL"),
		TextureAsset(U"PLAYER"),
		TextureAsset(U"PLAYER"),
		TextureAsset(U"LUGG"),
	};

	for (int j = 0; j < _map.stage_height; j++) {
	    for (int i = 0; i < _map.stage_width; i++) {
	        OBJNAME objNum = GetObjectNum({ i,j }, _map);

		switch (オブジェクト番号でスイッチ)
		{
		case FLOOR:
			床だけ書いてブレイク;
			break;
		case WALL:
		case LUGG:
		case GOAL:
		case HUMAN:
			壁、荷物、ゴール、プレイヤーの時は、床を描いてから、オブジェクトを重ねて書く（地面にオブジェクト置くイメージ）
			んで、ブレイク
			break;
		case HUMAN_ON_GOAL:
		case LUGG_ON_GOAL:
　　　　　　　　　　　　 問題はこの２つ、床描いて、ゴール描いて、プレイヤーまたは荷物を半透明で書く）
			break;
		default:
　　　　　　　　 　　　 7番とか来たときはdefaultでbreakしてやる（何も書かない）
			break;
		}
            }
        }
</code>
</codeblock>
こんな感じに書いてやればいいと思う。

=== 修正後の実行例 ===
<figure update_transparent>
{{game-engineer:classes:2023:something-else:summertime-special-cource:siv3d_app_debug_build_d3d11_142_fps_f_800x600_v_800x600_s_800x600_2023-08-17_13-47-44.mp4?300}}
<caption>半透明処理の追加</caption>
</figure>

あとは、シフトキーを押しているかどうか判別して（フラグとか作るといいね）シフトキーが押されているフラグがたっているときだけ半透明にするといいと思う\\
もっとスマートな書き方もあるけど、とりあえずこれでいいことにする\\

<code cpp gameSequence.cpp>
		case LUGG_ON_GOAL:
                        if(シフトキーフラグがtrue）
　　　　　　　　　　　　 　　床描いて、ゴール描いて、プレイヤーまたは荷物を半透明で書く）
　　　　　　　　　　　　else
                            通常通り、床描いて、プレイヤーまたは荷物を描く
			break;
		default:
　　　　　　　　 　　　 7番とか来たときはdefaultでbreakしてやる（何も書かない）
			break;
</code>

シフトキーフラグを付けたバージョン\\
<figure update_transparent>
{{game-engineer:classes:2023:something-else:summertime-special-cource:siv3d_app_debug_build_d3d11_145_fps_f_800x600_v_800x600_s_800x600_2023-08-17_14-10-32.mp4?300}}
<caption>半透明処理の追加(shiftキーで透過)</caption>
</figure>

;#;
[[game-engineer:classes:2023:something-else:summertime-special-cource:costcoman-siv3d-6|その６　細かいところを追加していくパート２　へ]]
;#;