トップページへ戻る


フォント属性の変更による文字修飾
 
「んきゃーんきゃーきゃーきゃーきゃー!」

「さっきまでとは偉い違いだ……」

「すきゃんてぃ、ちょーいーこと考えたんだもんねー!」

「何だ?」

「んとねー! 名前を入力してもらったやつを確認すんときわ、文字の色が黄色だったらわかりやすいなーとか思うんだなーこれが」

「お、なるほどねぇ。それはいい意見だ」

「んでもって、それからそれから、名前の字がおーきかったらもーっとわかりやすいかなーとか思うんだなーこれが」

「うんうん、それもいい意見だ」

「どーやれば文字の大きさや色が変わんのかなー?」

「よし。それじゃ今回は、文字の修飾について練習してみよう」

「やったー!」

「まず、練習として別の短いスクリプトを書いてごらん。画像のトランジションや変数、選択肢なんかは入っていなくていいから」

「書くわよー!」

*test
[ct]\
 しょーいわ、ボスザルちゃんです。
 このボスザルちゃんは、喜国雅彦という漫画家か書いたぼのぼののパロディの漫画ざるざるに出てくる意地悪なサルです。
 このざるざるの主人公は、ぼのぼのがラッコなのに対してサルです。
 他に、原作と同じしまりすちゃんがいるけど、アライグマくんの代わりにはボスザルちゃんというのがいます。
 しょーいわ、このボスザルちゃんそっくりです。
 たとえば、こんなかんぢ。
 ざるざるとしまりすちゃんとボスザルちゃんが麻雀をやっていて、誰かが上がるごとに、しまりすちゃんが、上がった役に対して「ちゅるりちゃん」とか「がぼらげんげんちゃん」とか、かわいらしい名前をつけます。
ボスザルちゃん「なんだそのちゅるりちゃんてのは」
しまりすちゃん「んと、しまりすちゃんがかんがえたあたらしいあそびなの」
ボスザルちゃん「マージャンの役に名前をつけるのがか?」
しまりすちゃん「そお」
ざるざる   「ろん。タンヤオイーペーコー」
しまりすちゃん「がぼらげんげんちゃん!」
ボスザルちゃん「なーーーーーにががぼらげんげんちゃんだーーーーー!」
(ボスザルちゃん、しまりすちゃんを空へ向かって蹴っ飛ばす)
 だからしょーいわ、ボスザルちゃんそっくりです。
 おしまい。
[s]\

「何だよこれわ!\(><)/」

「書けっていったから書いたんだもん! なんかもんくあんのー!?」

「ま、いいや……。それじゃ、まず文字の色を変える練習をしよう?」

「そーすんだもん」

「名前の色を変えるには、[font] タグを使う」

「ほんと?」

「おい……それ、ギャグのつもりか……?」

「いーから早くせつめーしなさいよねもー!」

「フォントの色を変えるには、[font color=0x変えたい色] のように書く」

「よくわかんない」

「色は16進数で表す。たとえば、赤は FF0000、青は 0000FF、黄色は FFFF00、みたいに」

「どーしたらそんな数字がわかんのよもー!」

「htmlで指定するのと同じ要領だから、手持ちのhtmlエディタを使ってカラーパレットから選び、16進数表記を確認すればいい」

「んーと、それじゃー、ピンク色は……#ff0080 だって」

「#の変わりに半角の0xを先頭に置いて、タグを書いてごらん」

[font color=0xff0080]……こーかなー?」

「そう。それから、元の規定色に戻すのは、0xと16進数の変わりに default と書く」

[font color=default]……こーかなー?」

「それでOKだ。それじゃ、色を変えたい部分にタグを埋め込んでごらん。単語の末尾で色を元に戻すのを忘れないように」

「よーし!」

*test
[ct]\
 しょーいわ、[font color=0xff0080]ボスザルちゃん[font color=default]です。
 この[font color=0xff0080]ボスザルちゃん[font color=default]は、喜国雅彦という漫画家か書いたぼのぼののパロディの漫画ざるざるに出てくる意地悪なサルです。
 このざるざるの主人公は、ぼのぼのがラッコなのに対してサルです。
 他に、原作と同じしまりすちゃんがいるけど、アライグマくんの代わりには[font color=0xff0080]ボスザルちゃん[font color=default]というのがいます。
 しょーいわ、この[font color=0xff0080]ボスザルちゃん[font color=default]そっくりです。
(以下略)

「ボスザルちゃんの名前のところをピンク色にしたもんねー」

「実行してみなさい」

「いけー!」

「ま、文字の色を変える方法はこんな感じだ」

「んぢゃー、次は、文字の大きさを変える方法だもん」

「大きさを変える場合も、色と同じように [font] タグを使う。属性 size にピクセル数を指定すれば大きさが変えられる」

「どーやんの?」

「たとえば、[font size=32] みたいな感じだ。この size 属性は、さっきの color 属性と同じ [font] タグの属性だから、併用して書くことができる」

「んぢゃー、ボスザルちゃんの文字をおーきくしちゃうもんねー」

「大きくしたら、後でサイズをデフォルトに戻すのを忘れるなよ」

「わかってんもん」

*test
[ct]\
 しょーいわ、[font color=0xff0080 size=48]ボスザルちゃん[font color=default size=default]です。
 この[font color=0xff0080 size=48]ボスザルちゃん[font color=default size=default]は、喜国雅彦という漫画家か書いたぼのぼののパロディの漫画ざるざるに出てくる意地悪なサルです。
 このざるざるの主人公は、ぼのぼのがラッコなのに対してサルです。
 他に、原作と同じしまりすちゃんがいるけど、アライグマくんの代わりには[font color=0xff0080 size=48]ボスザルちゃん[font color=default size=default]というのがいます。
 しょーいわ、この[font color=0xff0080 size=48]ボスザルちゃん[font color=default size=default]そっくりです。
(以下略)
[s]\

「実行ー!」

「ひでーサンプルだこと……」

「んー、何か変だなー」

「何が変だ?」

「最初は、普通の大きさで文字が出てきて、大きな文字が出ようとした時だけ、行が、びよーん、って下に下がるみたい」

「うん。それはKAGの仕様なんだ。行の先頭にある文字のサイズに依存して行間が決定されるから、途中で文字サイズを大きくした場合は行幅が拡張され、文字が再配置されることになっている」

「んでも、ちょっとかっこ悪いなー」

「そういう時は、最初から行間を設定してやればいい」

「どーやって?」

「センタリングの所で勉強した [style] タグを使うんだ。あの時は、align という属性を使っただけだけど、ここでは linesize という属性を使って、大きな文字が含まれている行の行幅を予約する」

「書き方は?」

[style linesize=行の幅(つまり高さ)]、戻す時は [style linesize=default] だ」

「それぢゃー、今は [style linesize=48] でいーのかなー?」

「そう」

「どの行を広くするかはー?」

「実行画面を見て確かめるしかない」

「んー」

*test
[ct]\
 [style linesize=48]しょーいわ、[font color=0xff0080 size=48]ボスザルちゃん[font color=default size=default]です。
 この[font color=0xff0080 size=48]ボスザルちゃん[font color=default size=default]は、喜国雅彦[style linesize=default]という漫画家か書いたぼのぼののパロディの漫画ざるざるに出てくる意地悪なサルです。
 このざるざるの主人公は、ぼのぼのがラッコなのに対してサルです。
 他に、原作と同じしまりすちゃんがいるけど、ア[style linesize=48]ライグマくんの代わりには[font color=0xff0080 size=48]ボスザルちゃん[font color=default size=default]というのがいます。
 しょーいわ、この[font color=0xff0080 size=48]ボスザルちゃん[font color=default size=default]そっくりです。
(以下略)
[s]\

「それじゃ、練習はこの辺にして、ゲームのスクリプトを直してみよう」

「簡単だもんねー!」

*opening
[ct]\
[layopt layer=message0 page=back visible=false]\
[image storage="ほてる.jpg" layer=base page=back]\
[trans time=2000 rule="trans1" vague=100]\
[wt]\
[ct]\
[backlay]\
[layopt layer=message0 page=back visible=true]\
[trans time=2000 rule="trans1" vague=100]\
[wt]\
謹啓[l]

チャーチホテル ChristmasEve へお越しいただきまして、真にありがとうございます。[l]


それでは、まずはお客様とお連れ様のサーネーム(姓)およびファーストネーム(名)を、こちらの宿泊カードにご記入ください。[l]
*inputname
;----------------------------------------------------
;▼男性の苗字を入力
[input name=f.sname1 prompt="あなた(男性)の姓をご記帳下さい" title="名前の入力"]\
;----------------------------------------------------
;入力文字列が長い場合
[if exp="f.sname1.length>4"]\
[ct]\
苗字は3文字までにして下さい。[p]
[jump target=*return_name]\
[endif]\
;----------------------------------------------------
;入力文字列がカラの場合
[if exp="f.sname1==''"]\
[ct]\
苗字を入力してください。[p]
[jump target=*return_name]\
[endif]\
;----------------------------------------------------
;▼男性の名前を入力
[input name=f.name1 prompt="あなた(男性)の名をご記帳下さい" title="名前の入力"]\
;----------------------------------------------------
;入力文字列が長い場合
[if exp="f.name1.length>4"]\
[ct]\
名前は3文字までにして下さい。[p]
[jump target=*return_name]\
[endif]\
;----------------------------------------------------
;入力文字列がカラの場合
[if exp="f.name1==''"]\
[ct]\
名前を入力してください。[p]
[jump target=*return_name]\
[endif]\
;----------------------------------------------------
;▼女性の苗字を入力
[input name=f.sname2 prompt="お連れ様(女性)の姓をご記帳下さい" title="名前の入力"]\
;----------------------------------------------------
;入力文字列が長い場合
[if exp="f.sname2.length>4"]\
[ct]\
苗字は3文字までにして下さい。[p]
[jump target=*return_name]\
[endif]\
;----------------------------------------------------
;入力文字列がカラの場合
[if exp="f.sname2==''"]\
[ct]\
苗字を入力してください。[p]
[jump target=*return_name]\
[endif]\
;----------------------------------------------------
;▼女性の名前を入力
[input name=f.name2 prompt="お連れ様(女性)の名をご記帳下さい" title="名前の入力"]\
;----------------------------------------------------
;入力文字列が長い場合
[if exp="f.name2.length>4"]\
[ct]\
名前は3文字までにして下さい。[p]
[jump target=*return_name]\
[endif]\
;----------------------------------------------------
;入力文字列がカラの場合
[if exp="f.name2==''"]\
[ct]\
名前を入力してください。[p]
[jump target=*return_name]\
[endif]\
;----------------------------------------------------
;▼車の名前を入力
[input name=f.carname prompt="キーをお預かりしますが、お車の型は?" title="名前の入力"]\
;----------------------------------------------------
;入力文字列が長い場合
[if exp="f.carname1.length>7"]\
[ct]\
車の名前は6文字までにして下さい。[p]
[jump target=*return_name]\
[endif]\
;----------------------------------------------------
;入力文字列がカラの場合
[if exp="f.carname==''"]\
[ct]\
車の名前を入力してください。[p]
[jump target=*return_name]\
[endif]\
;----------------------------------------------------
お客様のお名前は[font color=0xffff00][emb exp=f.sname1][emb exp=f.name1][font color=default]様、
お連れ様のお名前は[font color=0xffff00][emb exp=f.sname2][emb exp=f.name2][font color=default]様、
お車は[font color=0xffff00][emb exp=f.carname][font color=default]でよろしいですか?
[delay speed=nowait]\
[locate y=360]\
[link target=*scene01]A.よろしい[endlink]
[link target=*return_name]B.よろしくない[endlink]\
[delay speed=user]\
[s]\
;--------------------------------------------
*return_name
[ct]\
[jump target=*inputname]\
[s]\

「実行ー!」

「ほらーほらー黄色くなったぢゃんよもー!」

「うん。こっちの方が遥かに見やすいな。上出来だ」

「おーきくしよーと思ったけど、やめたもん」

「そうだな。色が変わっていれば充分に目に留まるから、サイズの変更は不要だろう」

「あー、きょーわくたびれたもん」

「それじゃ、今日はここまでにしよう」

練習日記 4日目 まとめへ


トップページへ戻る