文字表示 （２ページ目）
文字を表示することに対しての記事です。
長文については折り畳みを使用しています。
スクリプトサンプルをみる または 詳細をみる。 をクリック！
文字表示 ２項目
長いと表示に問題があるようです。
＞＞1ページ目に戻る
- 文字表示、メッセージレイヤーを非表示する。
- キャラクターの名前の色をキャラ別に入れ替える。
- メッセージを増やしそれぞれのメッセージを操る。メッセージを増やす
- 入力された特定の文字列で文字の色を変える。
- 改ページをクリックすると音の再生を中断
- 字の間を調整
- 文字をマウススクロールでもおくる
- 指定したメッセージレイヤーのメッセージだけ消す
- 自動改ページをする
- デフォルトの文字設定をする。埋め込みフォントを利用する。
- フォント属性設定 webフォントを使う＜＜ここ
つぎからは 文字表示(3ページ目) にお願いします。
＞＞文字表示1ページ目に戻る
＜＜メニューに戻る。
文字（メッセージ）表示を非表示にする。
スクリプトサンプルをみる
;一旦メッセージウィンドウを非表示にする
@layopt layer=message0 page=fore visible=false
@layopt layer=message0 page=back visible=false
Ver3.30
@layopt layer=message0 visible=false
@layopt layer=message1 visible=false
キャラクターの名前の色をキャラ別に入れ替える
最新版ではキャラクターを定義時([chara_new])に変更することができるようになります。
スクリプトサンプルをみる 旧ティラノ
[chara_new name="haruko" storage="haruko.png" jname="<span+style="color:rgb(255,0,0);">ハルコ</span>"]
;color:rgb(255,0,0) で色の変化
;↓HTML CSS カラーコード 10進数を参照し設定してください。 ↓
毎回記述していないとダメなようです。
マクロを利用する（未確認）
[macro name="yuko_normal"]
[chara_new name="yuko" storage="normal.png" jname="<span+style="color:rgb(255,0,0);">ゆうこ</span>"]
[chara_show name="yuko"]
[endmacro]
マクロを利用する2
[macro name=yk]
[font color=red]
#ゆうこ
[resetfont]
[endmacro]
jnameのspanに対してフォントスタイルを指定する
$(".jname").html("<span style='color:blue'>スネ夫</span>");
他
メッセージを増やしそれぞれのメッセージを操る。
スクリプトサンプルをみる
;この画面サイズはwindows版のデフォルトサイズです
}
;@layopt layer=message0 visible=true
;メッセージ０の表示を消してる場合↑表示してください。
[current layer="message0" ]
[position height=160 top=300]
message0レイヤに表示されています[l]
[position layer=message1 height=160 top=0]
@layopt layer=message1 visible=true
[current layer="message1" ]
message1レイヤに表示されています[l]
[cm]
;【cm】タグでメッセージの中身を同時に消します
[current layer="message0" ]
このようにふたつメッセージが
[current layer="message1" ]
でましたね！[l]
[cm]
;【cm】タグでメッセージの中身を同時に消します
[current layer="message0" ]
これでは見づらいのでこうして[l]
[position layer=message1 height=60 width=70 top=0 left=550]
[current layer="message1" ]
4/1
[current layer="message0" ]
[p]こうしてみました。[p]
【current layer="message0" 】と【ｐ】利用すると、
このメッセージだけ変更できましたね。[p]
ひとまず、文字で4/1と表示してるだけですが、この場合は変数を表示すべきですね。[l][r]
変数を設定します。
[eval exp="f.mon=5"]
[eval exp="f.day=2"]
[current layer="message1" ]
[p]
[emb exp="f.mon"]
/
[emb exp="f.day"]
[current layer="message0" ]
わかりやすいように変数を変えました[p]
あとはメッセージボックスの用意して[p]
[position layer="message0" frame="frame.png" width=700 height=240 top=265 left=0 margint="25" marginl="15" marginr="10" marginb="0"]
[current layer="message0" ]
メッセージボックスを置きました。[p]
アドベンチャーゲームっぽいですね。[p]
余裕があれば日付表示の部分も何か可愛い板画像でも用意するべきでしょう。[p]
■ メッセージレイヤー
メッセージを表示するレイヤです。デフォルトで２個配置されています。
テキストを出力するメッセージレイヤは、[current layer="message0"] [current layer="message1"]のように指定することで切り替える事ができます。 （レイヤ数２というのはデフォルト値です。Config.tjsを修正することで自由に増減することができます）
増やす場合は【layopt】のタグリファレンスもご覧ください。http://tyrano.jp/home/tag#layopt
@layopt layer=message0 visible=trueメッセージ0を表示する 表示されない場合チェック！
messageレイヤの数はデフォルト2個ですが、configのnumMessageLayersを増やせば何個でも追加できます。
あとは【current】でレイヤを切り替えれば、複数人の会話シーンも応用がきく
◎メッセージにフレーム画像をつける文字表示(1ページ目)
[position layer="message0" frame="frame.png" width=700 height=240 top=265 left=0 margint="25" marginl="15" marginr="10" marginb="0"]
message1にフレーム画像を指定するときは、layer="message1"を指定
[position layer="message1" frame="frame1.png" width=700 height=240 top=565 left=0 margint="25" marginl="15" marginr="10" marginb="0" opcity=100]
一緒にopcity=100を書けば透明度の指定もそれぞれ可能
他属性指定はタグリファレンスを見ましょう→ http://tyrano.jp/home/tag#position
長い指定なのでマクロを併用し、いろいろなメッセージを用意しておきましょう。
入力された特定の文字列で文字の色を変える。文字列が等しいか判定
スクリプトサンプルをみる
mpはローカル変数サブルーチンとマクロについて
公式サイトサブルーチンとマクロ http://tyrano.jp/adv/next/macro 一番下記に有り。
;マクロに対して渡された名前によって色を変更ptextとmp判定のマクロ
;名前表示用のマクロ
[macro name="whosay"]
;入力された名前によって色を変更
[iscript]
if(mp.name=="ミク"){
mp.color = "skyblue";}else if(mp.name=="レン"){
mp.color = "yellow";}else{
mp.color = "black";}
$(".chara_name_area").remove();
[endscript]
[ptext name="chara_name_area" layer=message0 text=&mp.name x=40 y=300 color=%color size=26]
[endmacro]
;ここまでマクロ
[whosay name=ミク]
nameにミクと入れると名前の色が変わる
nameにレンと入れると名前の色が変わる
http://tyrano.jp/demo/play/miku 引用元をご覧ください。
最新版ではキャラごとに名前の色をつけれるようになります。
改ページをクリックすると音の再生を中断
58 : 2015/01/15 (Thu) 15:10:14
スクリプトサンプルをみる
クリック待ちと効果音停止を合わせたマクロを作る
[macro name="z"]
[p]
[stopse]
[endmacro]
こうすると、改ページ時に[z]タグをつかうことで
クリック後は必ず音が停止。
詳しくは、音楽をみてください。
字の間を調整
詳細をみる
268： 2015/06/30 (Tue) 23:23:29
data/system/Config.tjsを開いて以下の項目を調整して下さい
行間
defaultLineSpacing
字間
defaultPitch
スクリプトで調整する
http://tyrano.bbs.fc2.com/reply/6151309/365/
;テスト用変数
[eval exp="sf.lineSpacing='2'"]
;1の場合、行間のdefaultLineSpacingを6にする
[if exp="sf.lineSpacing=='1'"]
[iscript]
tyrano.plugin.kag.config.defaultLineSpacing = '6';
[endscript]
;2の場合、行間のdefaultLineSpacingを9にする
[elsif exp="sf.lineSpacing=='2']
[iscript]
tyrano.plugin.kag.config.defaultLineSpacing = '9';
[endscript]
[endif]
文字をマウススクロールでも送る
詳細をみる
305 2015/07/28 (Tue) 12:19:55
マウスクリックするためには、独自にスクロールイベントを取得する必要があります。
例えば、タイトル画面など必ず通る所で下記のスクリプトをお試しください。
スクリプトサンプルをみる
[iscript]
var mousewheelevent = 'onwheel' in document ? 'wheel' : 'onmousewheel' in document ? 'mousewheel' : 'DOMMouseScroll';
$(document).on(mousewheelevent,function(e){
e.preventDefault();
var delta = e.originalEvent.deltaY ? -(e.originalEvent.deltaY) : e.originalEvent.wheelDelta ? e.originalEvent.wheelDelta : -(e.originalEvent.detail);
if (delta < 0){
$(".layer_event_click").trigger("click");
} else {
TG.menu.displayLog();
}
});
[endscript]
上にホイールするとログが見えるなんて素晴らしいですね！
その他
javascript キーイベント http://hakuhin.jp/js/key_board.html
指定したメッセージレイヤーのメッセージだけ消す
詳細をみる
現在使用メッセージレイヤーの場合[er]や[p]を使用する。
指定する場合は
[current layer="message0"]
[p]
を使用してください。途中変更も
[current layer="message１"]
[p]
注意[cm]を使うとすべてのメッセージレイヤーのメッセージが消えます。
自動改ページをする
詳細をみる
デフォルトの文字スタイルを設定する 最新版
WEBフォント
詳細をみる
新しいファイル分割がされても基本的なことは変更はない。補助的に古い項目も確認。
※好みのフォントに該当の拡張子( ttf svg eot woff)が無い場合、フォント拡張子変換サイトを利用して下さい。http://www.fontconverter.org/
コンシューマ 有料フォント例:http://www.lets-member.jp/about/fontuseexample/game/
デフォルトにWEBフォントを指定する
WEBフォント詳細をみる
tyranoファイルをみつけてください
fontファイルをみつけてください
font.cssの:url("../data/others/～以降をダウンロードしたフォントファイル名に変更してください
例 url("../data/others/ font_1_ant-kaku.ttf") format("truetype"),
/*ウェブフォントを使用する場合はここに定義を追加して下さい*/
@font-face{
font-family:mfrules";
src:url("../data/others/Mf_Break_The_Rules.eot?") format("eot"),
url("../data/others/Mf_Break_The_Rules.woff") format("woff"),
url("../data/others/font_1_ant-kaku.ttf") format("truetype"),
url("../data/others/Mf_Break_The_Rules.svg#MfBreakTheRules") format("svg");
font-weight:normal;font-style:normal;
}
src:url("../data/others/ Mf_Break_The_Rules.eot?") format("eot")
Mf_Break_The_Rules.eot の部分はウェブフォントのファイル名です。
ダウンロードしたファイルがeotの拡張子ならここを変更し、
同様にwoffの拡張子なら
url("../data/others/Mf_Break_The_Rules.woff") format("woff"),の
Mf_Break_The_Rules.woffをダウンロードしたウェブフォントのファイル名にします。後は同じようにother/以降から ") 前までをダウンロードしたファイル名に変更して下さい。
※ダウンロードしたウェブフォントはothersファイルに入れてください。フォルダの場所は下記を参照
※ダウンロードしたウェブフォントに欲しい拡張子が無ければウェブフォント変換サイトを検索してみてください。
ダウンロードしたウェブフォントはothersファイルに入れる。
dataに有り
Mutukiという名前のttfファイルなので変更確認
スクリプトでfirst.ksなどに以下を記入mfrulesは上写真の赤線の部分に相当する。
[deffont size=20 face=mfrules bold=true][resetfont]をセットで利用する。
→結果
変更された※V420です…
変更された※V420です…使用フォント むつき https://mandel59.github.io/mutsuki/
開発中の為、一部の文字が変換されません。 うつくし明朝の方がいいでしょう
※フリーフォントによっては、対応していない漢字が含まれていることも。検索確認して下さい。
| 基本的なこと やり方 |
| dataファイル→othersファイルにダウンロードしたウェブフォントを入れておく。ウェブフォント名.truetype ウェブフォント名.eot など。 |
| font.cssのother/以降をダウンロードしたフォントファイル名に変更 |
| [deffont size=20 face=mfrules bold=true][resetfont]をセットで利用する。 |
※[resetfont]で始めの状態に戻るわけではない。[deffont]の場合はそれでフォントがセットされる。[deffont]&[resetfont]二個セットで使えばいいのですよ。
deffontは[cm]されても変わらない
使用フォント ほのかアンティーク角http://font.gloomy.jp/
余談 WEBフォントをつくる。
指定したテキストのみ変更する。
詳細をみる
[ptext layer=3 text="～" size=30 x=1 y=1 name="text1"]
｢name｣のパラメータに好きな名前をつけます。
次にtyrano/plugins/kag内の｢tyrano.css｣を開き、
｢.text1{}｣と記述してください。ドットの後にくるのが、｢name｣で決めた名前です。
または、[ptext face=〜]で指定して下さい。
フォント属性設定 webフォントを使う（主にV340）
旧バージョン
旧バージョン
http://tyrano.bbs.fc2.com/reply/6151309/288/ msp明朝体config.tjs
http://tyrano.bbs.fc2.com/reply/8375254/475/ 2015/12/07 (Mon) 21:34:47
まず、dataフォルダに others フォルダをつくります。
右クリック→新規フォルダ作成で作成して下さい。
作成したothers フォルダの中に使用したいフォントを配置して下さい。
そして、tyrano.css フォルダを開いて一番末尾に
@font-face
{
font-family:webfont_1;
src:url("../data/others/mplus-2p-regular.ttf") format("truetype");
}
を自分で記述します。
ttf ファイル名の所は使用するフォント名に変更します。
あとはティラノスクリプトから
[font size=20 bold=true face=webfont_1]を入力
デフォルトの文字スタイルを設定する V330
もし、わからなかったら下の項目もみてください。
詳細をみる
【deffont】
[deffont size=5 color=snow face=webfont]
| size × 文字サイズを指定します |
| color × 文字色を文字色を 0xRRGGBB 形式で指定します。（吉里吉里対応） HTML5に限るならその他指定でも大丈夫ですbold |
| face × フォントの種類を指定。非KAG互換でウェブフォントも利用可能。プロジェクトフォルダのthersフォルダに配置してください。そして、tyrano.cssの@font-faceを指定することで利用できます。 |
フォントはフリーのフォントにしてください。
埋め込むフォントを data\others フォルダにコピーします。
次に tyrano\tyrano.css の中に下記があるので変更します。
すみません。v330以前のバージョンはコピーして末尾に追加です。
@font-face
{
font-family:webfont;
src:url("../data/others/mplus-2p-regular.ttf") format("truetype");
}
※ファイル名の部分（ mplus-2p-regular.ttf ）は使用するフォントに合わせて適切に変更してください。
スクリプト内で deffont タグと resetfont タグを使用しフォントを変更します。
スクリプトは以下のように記述します。
[deffont size=20 face=webfont bold=true]
[resetfont]
または
[deffont size=20 face=webfont bold=false]
[resetfont]
http://matome.naver.jp/odai/2139532113669205301 商用可能フリーフォントまとめネバー
フォント属性設定 webフォントを使う（主にV330）
詳細をみる
v340にて確認。[font size=20 bold=true face=mfrules]へ。
シナリオ内でCSSを間違ったところをいじってなければ face=webfont（mfrules）
で通ります。【注釈Aへ】
[font size=20 bold=true face=webfont]V330までこれ。
バージョンごとにfontfamly名前をみないといけない。
[deffont]と違って[cm]をするとリセットされるようです。
ただしシナリオにタグを書いてるだけでは×。
つぎを実行してください。
【１】規約違反しないウェブフォントを検索してダウンロードします。
http://matome.naver.jp/odai/2139532113669205301 商用可能フリーフォントまとめネバー
【２】ダウンロードしたファイルにいろいろ入っていると思います。
その中から
TrueTypeフォントをみつけます。
拡張子 .ttf のファイルです。
"もしあれば、ですが、、.eotのファイルもみつけてください。"※（本当はあるのが望ましい）
【３】ファイルの設置をします。
それらをdataファイルの・・・
other というファイルの中にいれてください。
ひとまずおつかれさまです。ファイルの設置か完了です。
つぎはCSSファイルの設定です！
【４】CSSファイルの設定の為にtyranoファイルとtyrano.cssファイルを探します。
最初のファイルから tyrano のファイルがあります。その中にCSSファイルがあります。
【５】tyrano.CSSファイルを編集します。
赤字で波線になっている部分をダウンロードしたウェブフォントファイル名にしてください。
【例】font_1.ttf
.eotファイルがあれば下の赤波線も変更してください。
こちらは、インターネットエクスプローラ「IE」での表示です。
※字間は、ゲーム上で大切です。
なければ『ttfファイルをeotに変換』で検索するか、もともと両ファイル形式があるものをダウンロードしてください。
[font size=20 bold=true face=webfont]
全ての設定は終了です。
ウエブフォントの種類によってはかなり字間があくので、
（特にアドベンチャーゲームメッセージ形式において）できれば真っ先に設定しておきたいです・・・。
この記事についての引用元
ティラノスクリプトは© Copyright ShikemokuMK All Rights Reserved.のものです。
- 最終更新:2016-11-16 11:35:43
