サイト内検索

検索

Shares

Table of Content

86HMI::ImageSlider(画像スライダ)

コントロールウィジェット

オブジェクト関数

画像スライダオブジェクト。画像スライダの動きを制御し、イベントの変更を管理し、オブジェクトを変更する値を調整するために使用できます。

ImageSlider-1

ImageSliderのプロパティ

ImageSlider-2

Identifier (Identifier (識別子)):

  • ID: オブジェクトを識別する一意の番号
  • Name: オブジェクトのユーザー定義可能な名前。86HMI APIで使用できます。

Content (Content (内容)):

  • Image: Bar Background: ImageSlider の背景
  • Image: Bar Foreground: 値を表示するためのImageSliderの前景
  • Image: Thumb: ImageSliderサムネイル画像。画像ソースの説明については、画像ファイルリソースを参照ください。
  • Value: デフォルトのImageSlider値
  • MaxValue: 最大値は正または負の値を取ることができますが、最小値より小さくすることはできません。
  • MinValue: 最小値は正または負の値を取ることができますが、最大値より大きくすることはできません。

Geometry (Geometry (形状)):

  • X: オブジェクトのX座標
  • Y: オブジェクトのY座標
  • Width: オブジェクトの幅。デフォルトでは調整できません。
  • Height: オブジェクトの高さ。デフォルトでは調整できません。

オプション:

  • Type: スライダ・タイプ、水平または垂直
  • Enable: オブジェクトのデフォルト状態を有効化または無効化を選択します。
  • Order: オブジェクトの順序。オブジェクトリストに表示されるオブジェクトの順序を上下に調整できます。

注記:
カスタマイズされた画像スライダ・スイッチを水平または垂直に表示する場合は、水平と垂直の両方の画像ファイル・ソースを作成して追加する必要があります。ユーザーが水平を使用する場合は、水平の画像ファイルを選択し、垂直を使用する場合は、垂直の画像ファイルを選択します。86HMIエディタは自動的にそれを切り替えできません。

追加情報:
画像バーの前景を水平方向に編集する場合、その左右の幅を画像編集ソフトウェアのキャンバスの左右の辺に合わせる必要があります。そうしないと、インポートして使用するときに左右の辺が空白のままになります。画像バーの背景はバー前景より少し長くてもかまいません。インポートすると自動的に一致します。垂直方向に編集する場合は、バー前景の上部と下部の境界を開始位置と終了位置として取得します。

垂直の場合、バー前景の上部と下部の境界が開始位置と終了位置として取得されます。スケールが必要な場合は、編集時にスケール・マークを追加する必要があります。

ImageSlider-3

API Functions

setImageSliderValue()

説明

ImageSliderの値を設定します。

構文

void setImageSliderValue(lv_obj_t* id, int value);
void setImageSliderValue(char* name, int value);

媒介変数

  • [in] id
    オブジェクトID
  • [in] name
    オブジェクト名
  • [in] value
    ImageSliderの値を設定します。

戻り値

なし

#include "myhmi.h"

void setup() {
  Hmi.begin();
  Hmi.setImageSliderValue(p1isl1, 100);
}

void loop() {
  // ...
}

getImageSliderValue()

説明

ImageSliderの値を取得します。

構文

int getImageSliderValue(lv_obj_t* id);
int getImageSliderValue(char* name);

媒介変数

  • [in] id
    オブジェクトID
  • [in] name
    オブジェクト名

戻り値

ImageSliderの値を返します

#include "myhmi.h"

void setup() {
  Serial.begin(115200);
  while (!Serial);
  
  Hmi.begin();
  Hmi.setImageSliderValue(p1isl1, 100);
  Serial.print("p1isl1 value: ");
  Serial.println(Hmi.getImageSliderValue(p1isl1));
}

void loop() {
  // ...
}

imageSliderDragging()

次のイベント関数は、BEGIN_HMI_EVENT_PROCとEND_HMI_EVENT_PROCの間に記述されます。 BEGIN_HMI_EVENT_PROC 入力と END_HMI_EVENT_PROC.

説明

ImageSliderがドラッグされていることを確認します。

構文

bool imageSliderDragging(lv_obj_t* id);
bool imageSliderDragging(char* name);

媒介変数

  • [in] id
    オブジェクトID
  • [in] name
    オブジェクト名

戻り値

ブール値で、ImageSliderがドラッグされていることを返します。

#include "myhmi.h"

void setup() { 
  Hmi.begin();
  // ...
}

void loop() {
  BEGIN_HMI_EVENT_PROC
  {
    if (Hmi.imageSliderDragging(p1isl1))
    {
      // do something.
    }
  }
  END_HMI_EVENT_PROC
}

imageSliderDropped()

次のイベント関数は、BEGIN_HMI_EVENT_PROCとEND_HMI_EVENT_PROCの間に記述されます。 BEGIN_HMI_EVENT_PROC 入力と END_HMI_EVENT_PROC.

説明

ImageSliderが落とされたことを確認します。

構文

bool imageSliderDropped(lv_obj_t* id);
bool imageSliderDropped(char* name);

媒介変数

  • [in] id
    オブジェクトID
  • [in] name
    オブジェクト名

戻り値

ブール値で、ImageSliderが落とされたことを返します。

#include "myhmi.h"

void setup() { 
  Hmi.begin();
  // ...
}

void loop() {
  BEGIN_HMI_EVENT_PROC
  {
    if (Hmi.imageSliderDropped(p1isl1))
    {
      // do something.
    }
  }
  END_HMI_EVENT_PROC
}

詳細は 86HMIエディタ ユーザーマニュアル には、86HMI ウィジェットとAPIのさらなる説明がございます。

上部へスクロール