1 つ以上のカルーセルイメージをプロジェクトに追加して、1 つ以上のイメージを順番に表示することができます。

スタイル

  • 基本属性
    • Size:幅と高さを調整して、ウィジェットのサイズを設定します。
    • Position:横座標と縦座標を調整して、ウィジェットの位置を設定します。
    • Others:ウィジェットの回転角度と不透明度を設定します。
  • グローバル設定
    • フォントファミリ: 表示されているテキストのフォント。 システムにインストールされているフォントだけが正確に表示されます。 選択したフォントがシステムにインストールされていない場合は、デフォルトのフォントが表示されます。
    • フォントサイズ: 表示されるテキストのフォントサイズを変更するには、値を入力するかスライダをドラッグします。 値の範囲は 10 から 100 です。
  • アニメーション
    • 間隔: 2 つのイメージを表示する間隔を変更するには、値を入力するか、 [+] または [-] をクリックします。 単位はミリ秒です。
    • 速度: イメージの表示速度を変更するには、値を入力するか、 [+] または [-] をクリックします。 単位はミリ秒です。
    • 特殊効果: アニメーション効果。
      • 水平にスクロール
      • 垂直にスクロール
      • フェードインとフェードアウト
      • モザイク
  • イメージ
    • デフォルトのイメージ: イメージの URL を入力するか、既存のイメージを破線のボックスにドラッグします。 削除アイコンをクリックして、イメージを削除できます。
    • 塗りつぶしの種類: 塗りつぶしの種類を設定するには、ドロップダウン矢印をクリックしてターゲットの種類を選択します。
      • 伸ばしてコンテナを塗りつぶす
      • コンテナを塗りつぶす
      • センター
  • 説明: イメージの説明を表示するには、 アイコンをクリックします。
    • 背景色
      • 塗りつぶしのスタイル: 塗りつぶしの色の種類を設定するには、ドロップダウン矢印をクリックしてターゲットの種類を選択します。
        • 塗りつぶし
        • グラデーション
      • 開始色: グラデーションカラーの開始色を変更するには、「 カラーピッカー」をご参照ください。
      • 終了色: グラデーションカラーの終了色を変更するには、「カラーピッカー」をご参照ください。
      • 角度: 必要に応じてグラデーション角度を変更できます。 設定は 塗りつぶしスタイルグラデーションに設定されている場合にのみ有効です。 塗りつぶしのスタイル塗りつぶしの場合は、グラデーションの角度は設定できません。
    • : 表示されるテキストのフォント色を設定するには、「カラーピッカー」をご参照ください。
    • フォントの太さ: 表示されるテキストのフォントの太さを変更するには、ドロップダウン矢印をクリックして目的のフォントを選択します。
    • : 説明バーの幅を変更するには、値を入力するか、 [+] または [-] をクリックします。 単位は % です。
    • 高さ: 説明バーの高さを変更するには、値を入力するか、 [+] または [-] をクリックします。 単位は % です。
    • : 説明バーと上枠の間隔を調整するには、値を入力するか、 [+] または [-] をクリックします。
    • : 説明バーと上枠の間隔を調整するには、値を入力するか、 [+] または [-] をクリックします。
    • 整列: 説明バーの説明テキストの位置を変更するには、ドロップダウン矢印をクリックして目的の位置を選択します。
      • 左揃え
      • 中央揃え
      • 右揃え
  • ページ区切り記号: ページ区切り記号を表示するには、アイコンをクリックします。
    • 非アクティブ色: 表示されていないイメージに対応するページ区切り記号の色を変更するには、「カラーピッカー」をご参照ください。
    • アクティブ色: 表示されているイメージに対応するページ区切り記号の色を変更するには、「カラーピッカー」をご参照ください。

データ

  • url: 設定ウィンドウのデフォルトイメージの URL に対応するイメージ URL。 設定ウィンドウとデータウィンドウの両方に URL を設定している場合は、url の値が有効になります。
    このイメージにはクロスドメイン設定が必要です。 HTTP を指定しない場合 (例:『//img.alicdn.com/tps/TB1PH6EPXXXXXXbaFXXXXXXXXXX-4001-2251.png』)、システムはプロジェクトのアクセス HTTP に従ってイメージに要求を送信します。
  • description: (オプション) 説明を入力します。 ペアのHTML a タグをこのフィールドの値に付け加えることができます。

インタラクション

このはウィジェットはまだイベントにバインドされていません。