au by KDDI EZfactory

ヘルプ | サイトマップ

EZfactoryサイト内検索

XHTML HDML マルチメディア・コンテンツ 技術情報 ダウンロード
HDML
HDMLについて

コンテンツの制作

HDMLの基本

デザインと装飾

応用機能の使用

CGIの利用


制作


概要 制作 制作例

応用機能について


ここでは、HDMLの基本的な4つのカードを利用していろいろな機能のアクティビティを紹介します。

DISPLAYカード、CHOICEカードを利用する

DISPLAY・CHOICEのカードを利用して、クイズのコンテンツを紹介します。

図:制作1

01
<HDML VERSION="3.0" MARKABLE="TRUE">
02
<DISPLAY NAME="quiz" TITLE="クイズ">
03
<ACTION TYPE="ACCEPT" TASK="GOSUB" LABEL="START" DEST="mondai.hdml#q1">
04
クイズ!<BR>
05
さあ、クイズにチャレンジしよう<BR>
06
準備はOK?
07
</DISPLAY>
08
<DISPLAY NAME="seikai">
09
<ACTION TYPE="ACCEPT" TASK="GO" CANCEL="#quiz" LABEL="次へ" DEST="mondai.hdml#$no">
10
<ACTION TYPE="SOFT1" TASK="RETURN" LABEL="終了">
11
<CENTER>ooo正解ooo<BR>
12
すばらしい!<BR>
13
次の問題にチャレンジ!
14
</DISPLAY>
15
<DISPLAY NAME="hazure">
16
<ACTION TYPE="ACCEPT" TASK="RETURN" LABEL="終了">
17
<CENTER>xxxはずれxxx<BR>
18
残念!<BR>
19
またチャレンジしてね
20
</DISPLAY>
21
<DISPLAY NAME="perfect">
22
<ACTION TYPE="ACCEPT" TASK="RETURN" LABEL="終了">
23
<CENTER>!!!おめでとう!!!<BR>
24
全問正解!<BR>
25
あなたはクイズ王
26
</DISPLAY>
27
</HDML>

このデッキは、クイズの始まりカード、正解カード、はずれカード、パーフェクトカードで構成されています。すべてDISPLAYカードで出来ています。

03
<ACTION TYPE="ACCEPT" TASK="GOSUB" LABEL="START" DEST="mondai.hdml#q1">

ここでTASK="GOSUB"とすることで、アクティビティの先頭として戻る場所になります。

09
<ACTION TYPE="ACCEPT" TASK="GO" CANCEL="#quiz" LABEL="次へ" DEST="mondai.hdml#$no">

DEST="mondai.hdml#$no"で、問題アクティビティ (mondai.hdml) から渡された変数「$no」で示すカード (q1/q2/q3) へ移行するように指定しています。

10
<ACTION TYPE="SOFT1" TASK="RETURN" LABEL="終了">

正解したのだけれど、途中でやめたい・・そんな時にこの終了キーを押されるとTASKで示したように"RETURN"としてGOSUBで呼び出されたアクティビティ<quizカード>に戻ります。

16
<ACTION TYPE="SOFT1" TASK="RETURN" LABEL="終了">
22
<ACTION TYPE="SOFT1" TASK="RETURN" LABEL="終了">

不正解だった、全問正解でこのクイズを終了したい・・そんな時にこの終了キーを押されるとTASKで示したように"RETURN"としてGOSUBで呼び出されたアクティビティ<quizカード>に戻ります。

ここでは、クイズの問題を別のアクティビティにしています。

DEST="mondai.hdml#$no"で、問題アクティビティ (mondai.hdml) から渡された変数「$no」で示すカード (q1/q2/q3) へ移行するように指定しています。

01
<HDML VERSION="3.0" MARKABLE="TRUE">
02
<CHOICE NAME="q1" KEY="no">
03
問題<BR>
04
トンボの幼虫は?
05
<CE TASK="GO" VALUE="q2" DEST="quiz.hdml#seikai">ヤゴ
06
<CE TASK="GO" VALUE="q0" DEST="quiz.hdml#hazure">ヒル
07
</CHOICE>
08
<CHOICE NAME="q2" KEY="no">
09
問題<BR>
10
アメリカの首都は?
11
<CE TASK="GO" VALUE="q0" DEST="quiz.hdml#hazure">ニューヨーク
12
<CE TASK="GO" VALUE="q3" DEST="quiz.hdml#seikai">ワシントン
13
</CHOICE>
14
<CHOICE NAME="q3" KEY="no">
15
問題<BR>
16
この漢字の読みは?<BR>
17
<CENTER>鰍
18
<CE TASK="GO" VALUE="q0" DEST="quiz.hdml#hazure">さんま
19
<CE TASK="GO" VALUE="q0" DEST="quiz.hdml#perfect">かじか
20
</CHOICE>
21
</HDML>

このデッキは、クイズの始まりカード、正解カード、はずれカード、パーフェクトカードで構成されています。すべてDISPLAYカードで出来ています。

02
<CHOICE NAME="q1" KEY="no">

q1という名前のCHOICEカードを宣言しています。CHOICEカードとは、ユーザーに選択を促すカードで、このときに選んだ項目をKEY=で示した変数に入れます。たいていは、このキーをジャンプ先として利用します。

05
<CE TASK="GO" VALUE="q2" DEST="quiz.hdml#seikai">ヤゴ
06
<CE TASK="GO" VALUE="q0" DEST="quiz.hdml#hazure">ヒル

CHOICEで選択を促す項目を記述するタグです。
CEは、選択する項目分記述します。 (この例では2択ということになります)
選んだ結果、CHOICEで宣言したKEY (no) にVALUE=の値を代入します。この例では、05が正解で、KEYとしてq2という値をquiz.hdmlのseikaiカードに渡します。Seikaiカード側では、noという変数は次の問題のカード名を示すように受取っているので、このq2と言う値が次の問題のカード名を示すことになります。06は不正解でq0という値をquiz.hdmlのhazureカードに渡します。Hazureカード側では、noという変数を特に使用しないので、ここではダミーとしてq0という値をセットしています。

07
</CHOICE>

CHOICEカードの終わりを宣言しています。ここでは、q1カードの終わりを意味します。

12
<CE TASK="GO" VALUE="q3" DEST="quiz.hdml#seikai">ワシントン

この例では、12が正解で、KEYとしてq3という値をquiz.hdmlのseikaiカードに渡しているので、このq3と言う値が次の問題のカード名を示すことになります。

19
<CE TASK="GO" VALUE="q0" DEST="quiz.hdml#perfect">かじか

19は全問正解したということでq0という値をquiz.hdmlのperfectカードに渡します。perfectカード側ではnoという変数を特に使用しないので、ここではダミーとしてq0という値をセットしています。

例では3問しかありませんが、問題を増やせばもっと充実したクイズコンテンツになるでしょう。

ENTRYカード、NODISPLAYカードを利用する

ENTRY・NODISPLAYのカードを利用して、パスワードチェックをするアクティビティを紹介します。パスワードを入力して、パスした場合のみ次のカードへ進むことができるようにします。

図:制作2

01
<HDML VERSION="3.0" MARKABLE="TRUE">
02
<ENTRY NAME="password" KEY="word" NOECHO="TRUE" TITLE="password">
03
<ACTION TYPE="ACCEPT" TASK="GOSUB" LABEL="OK" DEST="kekka.hdml#$(word)" FRIEND="TRUE">
04
パスワードを入力して下さい:
05
</ENTRY>
06
</HDML>

このデッキは、パスワード入力を促すENTRYカードのみで構成されています。

02
<ENTRY NAME="password" KEY="word" NOECHO="TRUE" TITLE="password">

passwordという名前のENTRYカードを宣言しています。ENTRYカードとは、ユーザーに入力を促すカードで、このときに入力した値をKEY=で示した変数に入れます。
ここでは、パスワードを入力するということで入力した値を表示させない (*で表示する) ために、NOECHOオプションを使用しています。

03
<ACTION TYPE="ACCEPT" TASK="GOSUB" LABEL="OK" DEST="kekka.hdml#$(word)" FRIEND="TRUE">

DEST="kekka.hdml#$(word)"で、パスワードチェックをしているアクティビティ (kekka.hdml) の$(word)の名のついたカードへ移行するように指定しています。また、パスワードチェックした結果、エラーだった場合にこのカードへ戻るためにTASKオプションを"GOSUB"にします。
そして、再度パスワードを入力する時に、前に入力した値をクリアするためにFRIENDオプションを"TRUE"にしてクリアできるようにしておきます。

05
</ENTRY>

ENTRYカードの終わりを宣言しています。ここでは、passwordカードの終わりを意味します。

ここでは、パスワードをチェックしている部分を別のアクティビティにしています。

01
<HDML VERSION="3.0" MARKABLE="TRUE">
02
<DISPLAY NAME="xxx">
03
<ACTION TYPE="ACCEPT" TASK="GO" LABEL="リトライ" DEST="#clear">パスワードが間違っています
04
</DISPLAY>
05
<NODISPLAY NAME="clear">
06
<ACTION TYPE="ACCEPT" TASK="RETURN" CLEAR="TRUE">
07
</NODISPLAY>
08
<DISPLAY NAME="aaa">
09
ログインできました
10
</DISPLAY>
11
</HDML>

このデッキは、クイズの始まりカード、正解カード、はずれカード、パーフェクトカードで構成されています。すべてDISPLAYカードで出来ています。

02
<DISPLAY NAME="xxx">

xxxという名前のDISPLAYカードを宣言しています。このカードはパスワードが間違っている時に呼ばれるカードです。パスワード入力アクティビティで入力した値がパスワードかつカード名として扱われるので、このデッキ内で定義されていない値 (パスワード) が入力されるとこのカード (先頭のカード) が呼ばれます。よって、NAMEは任意です。

03
<ACTION TYPE="ACCEPT" TASK="GO" LABEL="リトライ" DEST="#clear">

もう一度パスワードを入れなおすという意味で「リトライ」というキーを押すことによって、clearカードへ移ります。ここではTASKは"GO"にしておきます。

06
<NODISPLAY NAME="clear">

clearという名前のNODISPLAYカードを宣言しています。このカードは表示されることはありません。変数のクリアやセットを行うなど、裏で動くカードです。

07
<ACTION TYPE="ACCEPT" TASK="RETURN" CLEAR="TRUE">

変数をクリアするためにはCLEARオプションを使います。そしてこの場合は、変数をクリアした後は再度パスワードを入力するカードへ移るために、TASKオプションは"RETURN"を使います。するとNODISPLAYを読んだカード (xxx) の次にGOSUBで呼ばれたカード (password) へ表示が移ります。

08
</NODISPLAY>

NODISPLAYカードの終わりを宣言しています。ここでは、clearカードの終わりを意味します。

09
<DISPLAY NAME="aaa">

このカードは正しいパスワードを入れたときに呼ばれるカードです。つまり、正しいパスワードをカード名にすることにより、パスワードチェックがクリアできたとみなします。

ここで注意しなければいけないのは、正しいパスワードと間違ったパスワードを区別することです。
例では、正しいパスワード"aaa"を1つ用意し、それ以外を"xxx"としました。"xxx"の部分は任意の文字で結構ですが、かならず正しいパスワードのカードより先に書かなければなりません。つまり正しいパスワードのカードは2番目以降に記述してください。

phone to、mail to機能

1つのキーを押すことにより自動的に電話をかけたり、メールを書く機能です。

詳細については技術情報の「Phone to機能/mail to機能」を参照してください。

HDMLについて > Phone to機能/mail to機能

概要 制作 制作例

このページの先頭へ



KDDI: ユビキタス・ソリューション・カンパニー
au 電話・インターネット 法人サービス 会社情報
Designing The Future ここから当ウェブサイトの情報についてのメニューです。
免責事項 リンクについて 推奨環境 プライバシーポリシー Copyright © KDDI CORPORATION. All Rights Reserved.