トップ 差分 一覧 Farm ソース 検索 ヘルプ PDF RSS ログイン

TextForHSP07

*disclaimer
158308

[HSP]

07. マルチメディア教材の応用例:複数の画像の操作と「透明」ボタン



 07.1 複数の画像の操作


複数の画像をバッファに読み込んでおく

		buffer 番号
		picload "画像ファイル名"
		
		buffer 2
		picload "georgia.jpg"
	
		buffer 3
		picload "mississippi.jpg"


buffer を使う際は、実際に使う基本画面をscreen命令で明示的に定義する(0番が基本)


		screen 0, 横幅, 縦幅
		screen 0, 640, 640


仮想画面から基本画面への画像のコピー


1) gmode でコピーするモードと大きさを事前に指定

gmode 0, 640, 480
  • モード0で通常、モード1でメモリー間。モード0を使う。

2)  gcopy で何番の仮想画面のどの範囲をコピペするかを指定する

gcopy バッファ番号, 左上座標x, y, 横幅, 縦幅

gcopy 2, 0, 0, 125, 98

(画像の座標は、「ペイント」に画像を読み込み調べると便利)

具体的な流れ

 (サブルーチン *rose参照)

pos 200, 50					; 画像を配置する位置
	
gmode 0, 273, 262			; モード0で通常画像コピー, 画像の大きさをx, y で
gcopy 2, 0, 0;, 273, 262	; 画像の番号(buffer 2), その画像の左上の座標, (大きさを指定できる)
							; 大きさの指定を省略したらgmodeで指定した大きさとなる
wait 200
color 255,255,255 : boxf	; 写真を出した部分を白色(255,255,255)で塗りつぶす(boxf)
;gcopy 1, 200, 50;, 273, 262	; 元の背景画像(buffer 1)に戻す
							; 左上は、上のposで開始点を指定したところ, (大きさを指定できる)
							; 大きさの指定を省略したらgmodeで指定した大きさとなる		

具体例

  • PictureFeedback2.zip

 07.2 「透明」ボタン


  • テキストのある部分(単語とか)をクリックして、反応するようにするには
  • テキストを画像として読み込んでおき、
  • 該当部分の範囲を指定して、
  • そこをbuttonとして機能するようにする。

具体例

  • IHaveADreamToday2.zip

テキスト全体を画像として読み込む

  • 事前に
        buffer 1			; buffer 1に
        picload "IHaveADream.png"	; 画像を読み込む
  • あとで
        *main; テキスト全体を表示
        
        gmode 0, 640, 480		; 表示モードと大きさ指定
        pos 0,0			; 左上角から、
        gcopy 1,0,0			; バッファ1の画像を表示


該当部分の範囲を指定して、そこをbuttonとして機能するようにする。

	pos 103, 154				; ボタンの左上の座標
	objsize 97, 24
		; そこから右へいくつ、下へいくつとエリアを指定(そのエリアをボタンとして使用)
	objimage 1, 103, 154, 103, 154, 103, 154
		; その指定した範囲をオブジェクト(ボタン)とする
		; 最初の番号が buffer番号 1
		; 次の数字の組み合わせが、表示する画像の中のボタンの左上の位置 103, 154
		; その次の数字の組み合わせが、ボタンを押したときの位置(省略可)
		; 最後の数字の組み合わせが、ボタンの上にマウスが来たときの位置(省略可)
	button gosub "", *mississippi
		; ボタンとしての機能、文字は表示させないので""とだけ
		; ボタン命令で、上で設定した画像がボタンとして使われる。

サブルーチンで、文字、音声、画像を提示する

*mississippi
		mmplay 1
		pos 10, 510
	      	color 0,0,0
		mes "ミシシッピ州です。"
	
		gmode 1, 125, 98
		gcopy 3, 0, 0, 125, 98
	    		; 3番のバッファーがミシシッピーの画像
	
		wait 200
	
		pos 10, 510
		color 255,255,255 : boxf 10, 510
	
	return
  • wait 200 待った後、
  • 注の部分(縦500より下の部分)を白く塗りつぶして、注の表示を「消す」