注意: Jalverトレーニングキットに含まれるHTMLファイル、画像データ、練習用Jalverデータは相互に相対指定で関連付けされていますので、Jalver.jar や画像データ等を移動させずに、解凍した時の状態でそのまま使用してください。

移動させる場合は、解凍した内容の位置関係を変えずに、フォルダごと移動させてください。

Lesson用データ以外のデータを作成したり、読み込んだりする場合は、Jalver.jar / Jalvam.jar を好きな場所にコピーして使用して問題ありません。できれば、Jalver.jar と Jalvam.jar は一緒のフォルダに置けば便利です。


Lesson 08


目標
複数のファイルを一つのデータにまとめる
目次作成画面とデータ作成画面
目次の作成

細かく作ったデータを一つのデータにまとめる練習をします。
サンプルとして、 Lesson08-0.jvam ,  Lesson08-1.jvam ,  Lesson08-2.jvam ,  の3つのデータがあります。
それぞれのデータは、前進移動して3枚の画像を表示するというものです。
これを一つにまとめて Lesson08.jvam というファイルに保存します。

3つのファイルには、それぞれ、「Lesson08-0」「Lesson08-1」「Lesson08-2」というタイトルを持つ主画像があります。
この3つのタイトルを目次に登録して、目次選択を行って表示する方法を練習します。

複数ファイルの結合
 Lesson08-0.jvam を読み込む。
 最初に1つのデータを読み込みます。

 Jalver を起動する。
新しいデータを作成するので、前回のデータ作成確認画面で、「いいえ」を選択する。
メニューバーのファイル(F)-「新規に開く(O)」を選択し、ファイル選択画面で Lesson08 フォルダに入っている Lesson08-0.jvam を選択する。
ステージ画面で、「Lesson08-0 主画像01」という画像が表示されたのを確認してください。
登録されているタイトルを確認する
編集(E)-主画像(L)-タイトル選択(T) を押してタイトル一覧を見てください。
現在は「Lesson08-0」というタイトルがひとつだけ存在してるのが確認できたら、取消しボタンを押して元の画面に戻ってください。
このデータに他のデータを追加します。

 追加のデータLesson08-1.jvam)を読み込む
メニューバーのファイル(F)-「追加で開く(R)」を選択し、ファイル選択画面で Lesson08 フォルダに入っている Lesson08-1.jvam を選択する。


 タイトルを確認する
編集(E)-主画像(L)-タイトル選択(T) を押してタイトル一覧を見てください。
「Lesson08-1」というタイトルが追加されている事を確認して、タイトル一覧画面で「Lesson08-1」を選択して了解ボタンを押してください。
ステージ画面中央に「Lesson08-1 主画像11」と表示されていたら、Lesson08-1 のデータが追加された事を意味します。


 追加のデータ(Lesson08-2.jvam)を読み込む
メニューバーのファイル(F)-「追加で開く(R)」を選択し、ファイル選択画面で Lesson08 フォルダに入っている Lesson08-2.jvam を選択する。


 タイトルを確認する
編集(E)-主画像(L)-タイトル選択(T) を押してタイトル一覧を見てください。
「Lesson08-2」というタイトルが追加されている事を確認して、タイトル一覧画面で「Lesson08-2」を選択して了解ボタンを押してください。
ステージ画面中央に「Lesson08-2 主画像21」と表示されていたら、Lesson08-2 のデータが追加された事を意味します。

今回は一枚づつ追加しましたが、追加のデータを読み込む時のファイル選択画面は、複数のファイルを選択する事ができます。
複数のファイルを同時に選択する時は、Ctrlキーを押しながら必要とするファイルをクリックしてください。

追加できるデータには制限があって、以下のような場合には追加できません。
スクリーンサイズが異なる場合
画像フォルダが事なる場合
現在編集中(既に読み込まれているデータ)と同じタイトルが含まれている場合
現在編集中(既に読み込まれているデータ)と同じ主画像ファイルが含まれている場合
データが追加が拒否された場合には、制限を満たすようにしてからもう一度追加作業を行ってください。



 目次作成画面を表示する
データ作成画面で「Lesson08-2」と表示されている状態で、編集(E)-目次(M) を選択してください。
目次作成画面が表示されます。
左側に目次のステージ画面と右側に目次のデータ画面が表示されますが、目次表示の設定が「なし」になっているので何も表示されません。

 データ作成画面を表示する
目次作成画面が表示されている状態になると、編集(E)の一番下のメニューは「データ作成(D)」になります。
目次作成画面から元のデータ作成画面に戻りたい時に選択します。
「Lesson08-2」という目次画面へ移動する前の画面の戻ります。

もう一つの方法として、編集(E)-主画像(L)-タイトル選択(T)を選択し、タイトル一覧で編集したいタイトルを選択する方法があります。
「Lesson08-0 主画像01」表示されたデータ作成画面が表示されます。
データ作成画面と目次作成画面の切り替えは、編集(E)-目次(M)「データ作成(D)」編集(E)-主画像(L)-タイトル選択(T) で行います。

目次を作成する
データ作成画面が表示されている状態で、編集(E)-目次(M) を選択して、目次作成画面を表示します。
これから目次を作成して、3つのタイトルのデータを目次に登録します。
目次を作成すると、Jalvam で見たときに最初には目次が表示されて、目次上の登録位置をクリックすると主画像が表示されます。

目次作成
 目次表示設定
目次データ画面の「目次表示:あり なし」のラジオボタンで「あり」に設定します。

 目次ファイルの選択
目次ファイル選択ボタンを押して、ファイル選択画面を表示させます。
Lesson08 フォルダの中の「map08.jpg」を選択してください。
目次ステージ画面に「Lesson08 目次」と書かれた画像が表示され、目次データ画面の目次ファイル選択ボタンの左側に map08.jpg と表示されるのを確認してください。

 目次画像位置の設定
目次の画像表示位置は目次ステージ画面と目次データ画面の両方で設定できます。
目次ステージ画面の目次画像(「Lesson08 目次」)の茶色枠の四隅にカーソルを合わせて、形状が4方向カーソルに変わったらドラックします。
目次画像のドラッグに合わせて、目次データ画面の目次位置(pX , pY )の値が変化する事を確認してください。
目次データ画面の目次位置(pX, pY)に直接数値を入力すると、目次ステージ画面の目次画像の位置が変化する事も確認してください。
ここでは、pX = 100, pY = 150 ぐらいに設定します。

タイトルの目次登録
目次データ画面のタイトル一覧から目次に登録するタイトルを選らびます。
タイトルの設定されていない主画像は目次に登録できません。

Lesson08-0 の目次登録
 目次タイトル選択
タイトル一覧で Lesson08-0 を選択します。
 目次設定
一覧の左の「目次設定 あり なし」のラジオボタンがあります。
タイトルの中で目次登録の必要なものと不要なものをこのラジオボタンで選択します。
「あり」に設定します。
目次設定「なし」の場合には、目次は設定できません。

 目次設定位置
ステージ画面に黄色のスポット(目次スポットと呼ぶ)が表示されますので、目次スポットの四角部分にカーソルを合わせ、形状が四方向カーソルに変わったらドラッグします。
「Lesson08-0」の左側の赤い丸の部分に「+」印を合わせてください。

これでタイトル「Lesson08-0」の登録は完了です。

Lesson08-1 の目次登録
 目次タイトル選択
タイトル一覧で Lesson08-1 を選択します。
目次ステージ画面に設定済の(Lesson08-0)目次スポットが、黄色から茶色に変わったのを確認してください。
現在選択中のタイトルに対する目次スポットは黄色で、選択されていないタイトルの目次スポットは茶色になります。

 目次設定
以前と同様に一覧左のラジオボタンを「あり」に設定します。
ステージ画面で「Lesson08-1」用の目次スポットが黄色で表示されます。

 目次設定位置
黄色の目次スポットをドラッグして、「+」印部分を「Lesson08-1」の左側にある赤い丸に合わせます。
これでタイトル「Lesson08-1」の登録は完了です。

Lesson08-2 の目次登録
 目次タイトル選択
タイトル一覧で Lesson08-2 を選択します。

 目次設定
以前と同様に一覧左のラジオボタンを「あり」に設定します。
ステージ画面で「Lesson08-2」用の目次スポットが黄色で表示されます。

 目次設定位置
黄色の目次スポットをドラッグして、「+」印部分を「Lesson08-2」の左側にある赤い丸に合わせます。
これでタイトル「Lesson08-2」の登録は完了です。

これで三つのタイトルの目次登録が完了しました。
目次データ画面のタイトル一覧で任意のタイトルを選択して、その選択に対応したステージ画面での目次スポットが黄色で表示される事を確認してください。
また、目次ステージ画面で任意の目次スポットの四角部分を押して選択(黄色に変わる)すると、対応するタイトルが一覧の中で選択されている事を確認してください。

データの保存
メニューバーのファイル(F)を開いて、名前を付けて保存(A)を選択します。
ファイル保存画面が表示されたら、Lesson08 のフォルダを選択して、ファイル名を Lesson08.jvam (大文字・小文字を間違えない事)として保存ボタンを押します。
必ず Lesson08 フォルダの中に Lesson08.jvam と正確に入力して保存してください。


データ閲覧用のHTMLファイル作成
Lesson01と同じ要領で閲覧用HTMLファイルを作成します。
Jalverのデータを閲覧するので、データを修正等した場合には必ず一度「(新規・上書き)保存」する必要があります。

メニューバーのツール(T)-閲覧HTML作成(V) を選択します。
各項目に記入されている事を確認して「了解」ボタンを押すだけでいい事にしましょう。
設定項目の内容については Lesson01 を参照してください。
「了解」ボタンを押すと、Lesson08フォルダの中に viewJalver.html というHTMLファイルが作成されます。

Jalver の終了
メニューバーのファイル(F)を開いて、終了(X)を選択します。
確認画面で「はい」を押して終了です。


作成したデータを閲覧する
エクスプロ−ラやマイコンピュータを使用して、Lesson08フォルダを開いて、中にある viewJalver.html (通常はダブルクリック)させてください。
このような画面が見れれば合格です。