sample13_mobile-ratio.hsp

sample\sample_mobile-ratio\ sample13_mobile-ratio.hsp

#include "hsp3dish.as"

#include "ezlocal-dish-js.hsp"
ezLocalJS
;  ------------------------------------------------------------------------------
;  - スマホの解像度や表示比率に合わせてプログラミングする方法
;  ------------------------------------------------------------------------------
;  hsp3dish.ini に、
;   wx_mobile = ENV.HSP_SX
;   wy_mobile = ENV.HSP_SY
;  を追記することで画面の解像度や比率をスマホに合わせてゲームを製作することができます。
;
;  -- 縦向き型ゲームの場合 (横幅解像度固定、高さ可変)
;  ----------------------------------------------
;  スマホの解像度に合わせると例えば 980 x 1862 等の大きなサイズでゲームを
;  作っていくことになり、解像度が高すぎてしまう場合があります。
;  そういった場合は例えば、横幅解像度を640に固定して
;   wx_mobile = 640
;   wy_mobile = Math.round(ENV.HSP_SY * 640 / ENV.HSP_SX)
;  と記述することで、先程の例の比率で 640 x 1216 のサイズでゲーム画面が初期化されます。
;  
;  -- 横向き型ゲームの場合 (高さ解像度固定、横幅可変)
;  ----------------------------------------------
;  横幅固定はスマホを縦向きで使用するゲームの場合です。
;  スマホを横向きで使うために「スマホ横向き全画面FIT」を設定している場合は
;  縦方向の解像度を固定します。
;   wx_mobile = Math.round(ENV.HSP_SX * 520 / ENV.HSP_SY)
;   wy_mobile = 520
;  
;  ※ この画面初期化サイズは ginfo_sx, ginfo_sy で取得することができます。


// 実際にHTMLの中でどういった解像度で初期化されているかJavaScriptの変数内容を取得
exec {"
	HEAP32["}+varptr(ENV_HSP_WX)+{" >> 2] = ENV.HSP_WX;
	HEAP32["}+varptr(ENV_HSP_WY)+{" >> 2] = ENV.HSP_WY;
	HEAP32["}+varptr(ENV_HSP_SX)+{" >> 2] = ENV.HSP_SX;
	HEAP32["}+varptr(ENV_HSP_SY)+{" >> 2] = ENV.HSP_SY;
"}

*main
    redraw 0 : color 220,220,220 : boxf
	gosub *draw_wakusen
	color : pos 0,0
	gfilter 1  ; ← 画面の拡大縮小時の文字つぶれにある程度の効果
	mes "【スマホの表示領域ぴったりに初期化】"
	mes ""
	mes "動作解像度 : "
	mes "  ENV.HSP_WX="+ ENV_HSP_WX
	mes "  ENV.HSP_WY="+ ENV_HSP_WY
	mes ""
	mes "表示解像度 : "
	mes "  ENV.HSP_SX="+ ENV_HSP_SX
	mes "  ENV.HSP_SY="+ ENV_HSP_SY
    mes ""
	mes "ginfo値 : "
	mes "  ginfo_sx="+ ginfo_sx
	mes "  ginfo_sy="+ ginfo_sy
    mes ""
	mes "PCの場合は 480 x 600 、"
	mes "スマホなら画面いっぱいに表示される解像度になります。"
    mes ""
    mes strf("%02d:%02d:%02d",gettime(4),gettime(5),gettime(6))
	pos 0, ginfo_sy-ginfo_mesy
	mes "　↓ ここまで描画領域が広がります。"
	gfilter 0
    redraw 1
    await 16
goto *main

// サイズ感を把握するための枠線を描画
*draw_wakusen
	color 255
	line 0, 0, ENV_HSP_WX/2, 0 : line 10, 10, ENV_HSP_WX/2, 10
	line 0, 0, 0, ENV_HSP_WY/2 : line 10, 10, 10, ENV_HSP_WY/2
	line ENV_HSP_WX-1, ENV_HSP_WY-1, ENV_HSP_WX/2, ENV_HSP_WY-1 : line ENV_HSP_WX-11, ENV_HSP_WY-11, ENV_HSP_WX/2, ENV_HSP_WY-11
	line ENV_HSP_WX-1, ENV_HSP_WY-1, ENV_HSP_WX-1, ENV_HSP_WY/2 : line ENV_HSP_WX-11, ENV_HSP_WY-11, ENV_HSP_WX-11, ENV_HSP_WY/2
	return