すべてのプロダクト
Search
ドキュメントセンター

DataV:Koi Lottery ティッカーボード

最終更新日:Jul 16, 2024

このトピックでは、Koi Flipウィジェットのチャートスタイルと各設定項目の意味について説明します。

チャートスタイル

鯉フリップは、勝者の勝利をシミュレートするために使用されるフリップコンポーネントです。 image

設定

image

  • 検索設定: [設定] パネルの右上隅にある [検索設定] をクリックします。 [検索設定] パネルで、検索する設定項目の名前を入力して、設定項目をすばやく見つけます。 あいまい一致はサポートされていません。 詳細については、「アセット設定の検索」をご参照ください。

  • Size: ピクセルの幅と高さを含むウィジェットのサイズを示します。 アイコンをクリックする锁定长宽比按键と、ウィジェットの縦横比をロックし、ウィジェットの幅と高さを同じ比率で変更できます。 このアイコンをもう一度クリックすると、必要に応じて幅と高さを調整できます。

  • 位置: ウィジェットの位置。ピクセルXYの座標で示されます。 X座標は、ウィジェットの左上隅とキャンバスの左枠の間のピクセル距離を示します。 Y座標は、ウィジェットの左上隅とキャンバスの上枠の間のピクセル距離を示します。

  • 回転角度: ウィジェットの中心点を回転点として使用する回転の角度。 単位は度 (°) です。 次のいずれかの方法を使用して、ウィジェットの回転角度を制御できます。

    • 回転角度スピンボックスに角度を直接入力するか、プラス記号 ([+]) またはマイナス記号 ([-]) をクリックして、回転角度スピンボックスの値を増減します。

    • アイコンの圆圈旋转控制图标黒い点をドラッグして、ウィジェットの回転角度を制御します。

    • アイコンをクリックし左右翻转图标て、ウィジェットスタイルを反転します。

    • アイコンをクリックし上下翻转图标て、ウィジェットスタイルを反転します。

  • Opacity: 有効な値: 0〜1。 このパラメーターが0に設定されている場合、ウィジェットは非表示になります。 このパラメーターが1に設定されている場合、ウィジェットは完全に表示されます。 デフォルト値: 1

  • プレフィックス: 鯉カードのプレフィックス。

    パラメーター

    説明

    ティッカーリストのプレフィックスの幅。 単位: ピクセル

    間隔

    フリップリストのプレフィックスと左右のコンテンツの間の距離。 単位: ピクセル

    コンテンツタイプ

    プレフィックスのコンテンツタイプ。 [テキスト] または [画像] を選択できます。

    テキストコンテンツ

    プレフィックスリテラル型の特定のコンテンツをカスタマイズします。 この値は、[コンテンツタイプ][テキスト] に設定した場合にのみ使用できます。

    テキスト設定

    フォントスタイル、テキストの太さ、フォントサイズ、色など、プレフィックステキストのフォント設定をカスタマイズします。 この値は、[コンテンツタイプ][テキスト] に設定した場合にのみ使用できます。

    テキストの水平方向と垂直方向の変位値、テキストの影の値、影の色など、テキストの影のスタイルを設定します。 この値は、[コンテンツタイプ][テキスト] に設定した場合にのみ使用できます。

    画像

    カスタムイメージタイプのイメージコンテンツ。 リモートサーバーで画像を使用する場合は、右上隅に画像のURLを入力します。 画像ボックスで [プレビュー] をクリックして、画像形式をプレビューします。 画像ボックスの下にある破線のボックスの [変更] をクリックします。 イメージデザインアセットを変更する方法の詳細については、「インターフェイスの使用」をご参照ください。 このプロパティは、[コンテンツタイプ] プロパティを [イメージ] に設定した場合にのみ使用できます。

    サイズ

    画像の幅と高さの値をpx単位で設定します。

    フィレ

    画像のフィレットサイズ。 単位: ピクセル。 値が0の場合、角の丸みはなく、画像は正方形です。 設定値が大きいほど、角を丸めた画像のラジアン値が大きくなる。

  • Flower Name: Koi Brand Flipウィジェットの花の名前。

    パラメーター

    説明

    フリップリスト内の花の名前の全体の幅。 単位: ピクセル

    間隔

    タグリストの名前と左右のコンテンツの間の距離。 単位: ピクセル

    賞前のコピーライティング

    賞が授与される前のフロップリストの花名のコピー内容。

    テキスト設定

    フォントスタイル、テキストの太さ、フォントサイズ、色など、花名テキストのフォント設定をカスタマイズします。

    花名テキストのシャドウスタイルを設定します。これには、テキストの水平方向と垂直方向の変位値、テキストシャドウの値、シャドウの色が含まれます。

  • 労働数: Koiフリップコンポーネントの労働数。

    パラメーター

    説明

    ビット数

    作業番号の桁数の値。

    スクロール番号を許可

    スクロールを許可する数値を設定し、各数値をコンマで区切ります。 番号シリーズを追加または削除するには、右側の加号图标または垃圾桶图标アイコンをクリックします。 横排列图标または竖排列图标アイコンをクリックして、複数の数値シリーズの配置スタイルを設定します。 アイコンをクリックし复制图标て、選択した数値シリーズ構成をコピーし、同じ構成の数値シリーズを追加します。

    繰り返し間隔

    ジョブ番号の最小時間間隔と最大時間間隔の値をms単位で設定します。

    テキスト設定

    フォントスタイル、テキストの太さ、フォントサイズ、色など、カスタムジョブ番号のフォント設定。

  • 接尾辞: 鯉フリップウィジェットのコンテンツのスタイル。

    パラメーター

    説明

    フリップリストのサフィックスの幅。 単位: ピクセル

    間隔

    フリップリストのサフィックスと左右のコンテンツの間の距離。 単位: ピクセル

    コンテンツタイプ

    サフィックスのコンテンツタイプ。 [テキスト] または [画像] を選択できます。

    テキストコンテンツ

    サフィックスリテラル型の特定のコンテンツをカスタマイズします。 この機能は、コンテンツタイプテキストを選択した場合にのみ使用できます。

    テキスト設定

    フォントスタイル、テキストの太さ、フォントサイズ、テキストの色など、サフィックステキストのフォント設定をカスタマイズします。 この値は、[コンテンツタイプ][テキスト] に設定した場合にのみ使用できます。

    テキストの水平方向と垂直方向の変位値、テキストの影の値、影の色など、テキストの影のスタイルを設定します。 この値は、[コンテンツタイプ][テキスト] に設定した場合にのみ使用できます。

    画像

    カスタムイメージタイプのイメージコンテンツ。 リモートサーバーで画像を使用する場合は、入力ボックスに画像のURLを入力します。 画像ボックスで [プレビュー] をクリックして、大きな画像スタイルをプレビューします。 画像ボックスの下にある破線のボックスの [変更] をクリックします。 イメージデザインアセットを変更する方法の詳細については、「インターフェイスの使用」をご参照ください。 この値は、[コンテンツタイプ][画像] に設定した場合にのみ使用できます。

    サイズ

    画像の幅と高さの値をpx単位で設定します。

    フィレ

    画像のフィレットサイズ。 単位: ピクセル。 値が0の場合、角の丸みはなく、画像は正方形です。 設定値が大きいほど、角を丸めた画像のラジアン値が大きくなる。

[データ] タブ

image

設定フィールドの説明

説明

name

人の名前。

id

人のID値。

[インタラクション] タブ

このウィジェットはインタラクションイベントをサポートしていません。

Blueprint Editorでのインタラクションの設定

  1. キャンバスエディターで、レイヤーパネルでウィジェットを右クリックし、[ブループリントエディターに追加] を選択します。

  2. 左上隅の蓝图图标アイコンをクリックします。

  3. ブループリントエディタで、追加されたノードペインでKoi Flipコンポーネントをクリックします。 次の図は、キャンバス上のパラメーターを示しています。 image

    • イベント

      イベント

      説明

      インターフェイス記述要求が完了したとき

      イベントは、データインターフェイス要求が応答され、フィルターによって処理された後、処理されたJSONデータでトリガーされます。 特定のデータ例の詳細については、キャンバスエディターの右側の構成パネルにある [データ] タブの [データ応答結果] セクションをご参照ください。

      インターフェイス記述リクエストが失敗した場合

      データインターフェイス要求が失敗したときに返され (ネットワークの問題やインターフェイスのエラーなど) 、フィルターによって処理されるイベント。 イベントは、処理されたJSONデータもスローします。 特定のデータ例の詳細については、キャンバスエディターの右側の構成パネルにある [データ] タブの [データ応答結果] セクションをご参照ください。

    • Action

      Action

      説明

      リクエストAPIの説明

      このアクションは、サーバーデータを再度要求するために実行されます。 アップストリームデータ処理ノードまたはレイヤノードによって送信されたデータは、パラメータとして使用される。 たとえば、APIデータソースをhttps:// api.testに設定し、リクエストインターフェイスからアクションを記述するデータが { id: '1'} の場合、最終的なリクエストインターフェイスはhttps:// api.test?id=1になります。

      インポートインターフェイスの説明

      ウィジェットのデータがその描画フォーマットに従って処理された後、ウィジェットは再描画のためにインポートされる。 サーバーデータを再度リクエストする必要はありません。 特定のデータ例の詳細については、キャンバスエディターの右側の構成パネルにある [データ] タブの [データ応答結果] セクションをご参照ください。

      キャンセル

      少し止めろ アクションの入力データはオブジェクトタイプです。 参照データの例を次に示します。

      return{ "index": 1 // 最上位の桁から始まるインデックス番号。 0は開始番号です。

      公開リスト

      リストを公開します。 パラメータは必要ありません。

      タンブリングを開始

      タンブリングを開始すると、パラメータは必要ありません。

      ステータスのクリア

      すべての状態をクリアし、パラメータは必要ありません。

      コンポーネント設定の更新

      ウィジェットのスタイル設定は動的に更新されます。 この操作を実行する前に、キャンバスエディターでウィジェットをクリックし、右側のパネルの [設定] タブをクリックし、設定をコピーして...ウィジェット設定を取得します。 その後、Blueprint Editorでデータ処理ノードのスタイルフィールドを変更します。

      表示

      ウィジェットを表示します。 参照データの例を次に示します。

      return {
        "animationType": "",
        "animationDuration": 1000,
        "animationEasing": "linear"
      };

      非表示

      次の例は、ウィジェットを非表示にする方法を示しています。

      return {
        "animationType": "",
        "animationDuration": 1000,
        "animationEasing": "linear"
      };

      暗黙の状態への切り替え

      ウィジェットを表示するか非表示にするかを指定します。 参照データの例を次に示します。

      return {
        "animationIn": {
          "animationType": "",
          "animationDuration": 1000,
          "animationEasing": "linear"
        },
        "animationOut": {
          "animationType": "",
          "animationDuration": 1000,
          "animationEasing": "linear"
        }
      };

      中国モバイル

      ウィジェットを指定した場所に移動します。 参照データの例を次に示します。

      return {
        // The positioning type. to indicates absolute positioning, whereas by indicates relative positioning. The default value is to. 
        "positionType": "to",
        // The location, which is indicated by the x and y coordinates. 
        "attr": {
          "x": 0,
          "y": 0
        },
        // The animation type. 
        "animation": {
          "enable": false,
          // The duration in which animation is displayed. 
          "animationDuration": 1000,
          // The animation curve, which can be set to linear|easeInOutQuad|easeInOutExpo. 
          "animationEasing": "linear"
        }
      };