トラジェクトリリストボックスの例 (Trajectory list box example)

この例は、Trajectory List Box 3D ノードを使用して、インタラクティブなスクロール可能なアイテムのリストを作成する方法を示しています。この例では、アニメーションを使用した選択効果を持つシンプルな写真ギャラリーを実装しています。

Trajectory List Box 3D ノード、その Circle Trajectory、Trajectory List Box 3D に表示されるコンテンツ、および中央の写真を強調するアニメーションは、Kanzi Studio で作成されます。ハイライトアニメーションが開始される時点は、トラジェクトリリストボックスコンポーネントが生成するユーザー入力イベントから得られるスクロール速度とフォーカスされたアイテムデータに基づいて定義されます。

例の Trajectory List Box 3D ノードは、次の機能を使用しています。

  • Looping。Trajectory List Box 3D ノード内のアイテムを、定義されたトラジェクトリの開始点と終了点にクランプするか、Looping プロパティを使用して開始位置と終了位置の間を遷移させることができます。この例のように。

  • Trajectory。Trajectory List Box 3D にトラジェクトリを使用するには、Library > Trajectories で作成する必要があります。Kanzi Studio で円形および直線のトラジェクトリを作成できます。スプライントラジェクトリを使用するには、サードパーティツールでスプラインを作成し、インポートして、スプラインを Spline Trajectory として追加します。サークルトラジェクトリ (circle trajectories) を使用する場合、ラインのトラジェクトリを使用する、および スプライントラジェクトリ (spline trajectories) の使用 を参照してください。Item Area Begin、Item Area End、Cursor Offset、および Override Distance などのトラジェクトリプロパティを追加および設定することで、トラジェクトリをカスタマイズできます。

  • 選択とターゲットの動作。選択とターゲットのイベントは別々に処理されます。ターゲットが変更されたメッセージは、ユーザーがポインタを離した瞬間に生成されます。これには、現在のトラジェクトリの動きで中央に持ってこられたアイテムに関する情報が含まれています。選択メッセージは、ユーザーがアイテムをクリックまたはタップして選択したときに生成されます。Kanzi Studio で Bring Center の選択動作を選択できます。Trajectory List Box 3D の任意のメンバー、またはトラジェクトリリストボックスコンポーネント自体のターゲットおよび選択イベントに対して、List Box: Target Changed または List Box: Item Selected トリガーの呼び出しアクションを設定することで、さらに多くのアクションを定義できます。

例の入手

例を入手するには、Kanzi Studio Quick Start ウィンドウで Projects をクリックし、Examples タブを選択します。Trajectory_list_box の例の横にある ダウンロード をクリックします。

Kanzi Studio は、この例を <KanziWorkspace>/Examples/Trajectory_list_box ディレクトリにダウンロードします。

関連項目

Trajectory List Box 3D ノードを使用する