要素のグループ化 - テキストの表示 - RealPlayer SMIL コンテンツクリエーション

2 テキストの表示

4.4 要素のグループ化

3 章では、要素をグループ化するタグについて簡単に説明しましたが、ここでは、

さらに詳細にグループ化を説明します。

4.4.1シーケンスグループの例

シーケンスグループは<seq>…</seq>タグで囲まれ、このタグ内の要素を上から順番に再生します。以下の例は 3 つのビデオクリップを順番に再生します。

group_sequece.smil の再生例

group_seqence.smil

<head>

<root-layout width="320" height="240" backgroundColor="black"/>

<region id="video_region" left="40" top="30" width="240"

height="180" fit="fill"/>

</layout>

</head>

<body>

<seq>

</seq>

………..

30

</body>

</smil>

この例では、各 video1.rm、video2.rm、video3.rm のサイズがそれぞれ異なるので、<region…/>タグの fit=”fill”で領域のサイズに適合するようにしています。

4.4.2パラレルグループの例

パラレルグループは、<par>…</par>タグで囲まれ、このタグで囲まれた要素を同時に再生します。パラレルグループの例は、前節で説明していますので、ここでは、グループのグループ化を説明します。以下の例は、シーケンスグループの 3 番目の要素がパラレルグループになっています。このようにグループは入れ子にすることができます。

group_sequence_para.smil の再生例

group_sequence_para.smil

<head>

<root-layout width="320" height="240" backgroundColor="black"/>

<region id="video_region" left="40" top="30" width="240"

height="180" fit="fill" z-index="1"/>

<region id="logo_region" right="5%" bottom="5%" width="58"

height="49" z-index="2"/>

</layout>

</head>

<body>

<seq>

<par>

<img src="../clips/logo.gif" dur="10s" region="logo_region"

fill="freeze"/>

</par>

</seq>

</body>

</smil>

………..

31

追加情報：シーケンスグループでのバッファリング例えば、以下のように単純に

<seq>

</seq>

としてシーケンスグループを作成した場合、SMIL1.0 では video1.rm の再生が終了してから、video2.rm を再生開始の間にバッファリングが起こります。これを避けるためには、以下のようにシーケンスグループ自体をパラレルグループに入れます。

<!--SMIL1.0 でのバッファリングを避ける記述-- >

<par>

<seq>

</seq>

</par>

しかし、SMIL2.0 では、このようにグループを入れ子にしなくても、バッファリングは起こりません。

………..

32

4.4.3エクスクルーシブグループ

エクスクルーシブグループは<excl>…<excl>タグで囲まれ、このタグで囲まれた要素は、1 度に 1 つの要素しか再生しません。シーケンスグループも 1 度に 1 つの要素しか再生しませんが、シーケンスグループの場合は、要素は予め決められた順番（<seq>…</seq>タグの間の最初の要素から最後の要素）で再生されます。これに対して、エクスクルーシブグループでは、再生の順番は決まっていないので、例えばユーザーがマウスでボタン画像をクリックした時に、選択したビデオが再生されるようなプレゼンテーションが作成できます。

以下の例では、プレゼンテーションを再生したばかりの状態ではビデオは表示されません。ユーザーがボタン 1、ボタン 2、ボタン 3 のどれかをクリックすると、ビデオが再生されます（group_excl.smil）。

再生したばかりの状態

group_excl.smil

<head>

<root-layout width="384" height="240" backgroundColor="black"/>

<region id="video_region" width="240" height="180" top="30"

ボタン 1 を押した場合

ボタン2を押した場合

ボタン3を押した場合

………..

33

left="40" fit="fill"/>

<region id="button_region1" height="64" width="64" top="8"

left="300"/>

<region id="button_region2" height="64" width="64" top="88"

left="300"/>

<region id="button_region3" height="64" width="64" top="168"

left="300"/>

</layout>

</head>

<body>

<par>

<img src="../clips/number1.png" id="button1"

region="button_region1" dur="10s" fill="hold"/>

<img src="../clips/number2.png" id="button2"

region="button_region2" dur="10s" fill="hold"/>

<img src="../clips/number3.png" id="button3"

region="button_region3" dur="10s" fill="hold"/>

<video src="../clips/video1.rm" begin="button1.activateEvent"

region="video_region" fill="remove"/>

<video src="../clips/video2.rm" begin="button2.activateEvent"

region="video_region" fill="remove"/>

<video src="../clips/video3.rm" begin="button3.activateEvent"

region="video_region" fill="remove"/>

</excl>

</par>

</body>

</smil>

この例では、レイアウトパートで、1 つのビデオ表示領域（video_region）と、3 つのボタン画像領域（button_region1、button_region2、button_region3）を作成しています。ボディパートでは、2 つのボタン画像と 1 つのエクスクルーシブグループを

<par>…</par>タグで囲み同時再生します。ボタン画像は、パラレルグループが終了するまで、表示を続けるように fill=”hold”属性を使用しています。さらに各ボタン画像にはユニークな id をつけています（button1、button2、button3）。

エクスクルーシブグループは、dur=”indefinite”によって、再生時間は無限、すなわち、常にアクティブな状態にしておきます。エクスクルーシブ内の各ビデオクリップの開始時間は begin=”ボタン ID.activateEvent”を指定することで、ボタン画像がクリックされた時に、再生を開始します。また、再生が終了したら、 fill=”remove”でビデオクリップは非表示になります。ビデオの開始時間をマウスクリックでインタラクティブに設定する方法は、次の第 5 章で説明します。

………..

34

5 イベント

この章では、イベントについて説明します。イベントが発生することによって、要素を開始または停止することができます。したがって、イベントはイベントを起こす要素とイベントを受け取る要素の 2 つの要素から構成されます。

ドキュメント内 RealPlayer SMIL コンテンツクリエーション (ページ 31-36)