GUI Designerスライドバーコントロールマニュアル

1.スライドの紹介

スライドバーは、温度、音量、明るさなどの調整機能に適用でき、ボタンコントロールよりも迅速かつ直感的に使用できます。

2.スライダーの追加方法

図2.1に示すように、図2.1に示すように、よく使用されるコントロールモジュールまたはツールボックスのスライドバーアイコンをクリックしてプロジェクトを開きます。

図はこちら2.1Slide Barの追加

3.画像を置き換える方法

スライドバーを選択し、右側のプロパティウィンドウをクリックして画像を修正できます。“追加”ボタンをクリックしてスライダー表示を追加アンダーレイはスライドバーが引っ張られていないときに表示される画像、ステートチャートはスライドバーが引かれた後に表示される画像、スライダーは図3.1に示すようにスライドバーが引かれた位置を示します。

図はこちら3.1画像の置き換え

シミュレーションでは、図3.2に示すように、スライドバーが操作されていないときにアンダーレイとスライダが表示されます。

図はこちら3.2スライドバー操作なし

図3.3に示すようにスライドバーを引っ張ります。

図はこちら3.3スライドバーを引っ張る

4.その他の設定方法

右側のプロパティウィンドウでスライドのオフセット座標、最大値、方向、トリガーモードを図4.1に示すように設定できます。

図はこちら4.1その他の設定

4.1スライダオフセット座標を設定する方法

スライダの開始/終了オフセット座標の下の入力ボックスをクリックすると、キーボードまたは“+ ”“- ”ボタンでスライダの開始/終了オフセット座標を設定できます。スライダのオフセット座標を設定することで、スライダが引くことができる範囲を設定できます。デフォルトは0です。つまり、スライダの開始/終了座標は制限されず、スライダの範囲内で自由に引っ張ることができます。

スライダの開始オフセット座標はスライダの引っ張りの開始座標であり、スライダの引っ張りの終了オフセット座標はスライダの引っ張りの終了座標であり、スライダの左端は開始座標0であり、右端は終了座標305である。スライドバーの終了横座標は、スライドバーの幅に関係しています) 。

スライダ開始オフセット座標は45であり、スライダ開始位置はスライダ45の位置であり、スライダ終了座標は100であり、スライダ終了位置はスライダ100の位置である（これ以上引くことはできない）。図4.2に示します。

図はこちら4.2スライダオフセット座標

4.2最大値/最小値の設定方法

最大/最小値の下にある入力ボックスをクリックすると、キーボードまたは“+ ”、“- ”ボタンからスライドバーの最大/最小値を設定できます。最大値はデフォルトで100、最小値はデフォルトで0です。

最大値/最小値を設定すると、スライドバーが表すデータの最大値と最小値が設定されます。

最小値を16、最大値を35に設定すると、図4.3に示すように、スライドバーの開始値は16、スライドバーの終了値は35になります。

図はこちら4.3最大値を設定/小さな値。

4.3スライドバーの方向を設定する方法

方向の下のボタンをクリックしてドロップダウンボックスをポップアップします。横方向と縦方向があり、横方向を選択すると引く方向が横方向になり、縦方向を選択すると引く方向が縦方向になります。図4.4に示すように。

図はこちら4.4スライドバーの方向の設定

4.4トリガーモードの設定方法

トリガモードのボタンをクリックしてドロップダウンボックスをポップアップし、連続トリガモードとリリース時トリガモードがあり、連続トリガモードを選択するとスライドバーを引っ張る時に常に髪をタッチし、リリース時トリガモードはスライドバーを引っ張った後にリリースした瞬間にトリガを行い、図4.5に示すように。

図はこちら4.5トリガー·モードの設定

5.アプリケーション事例

5.1イベント一覧

次の表で説明するイベントのリスト。

5.2スライドバーでカスタムプロトコルディレクティブを送信する方法

1イベントの追加方法

図5.1に示すように、スライドバーをオンにし、右側のプロパティウィンドウでイベントをクリックしてイベントを追加します。

図はこちら5.1イベントの追加

2処理方法の設定方法

カスタムプロトコルは、modbusプロトコルなど、ユーザーがプロジェクト内で使用できる他のプロトコルです。

処理方法右下をクリック図5.2に示すように、処理方法ウィンドウをポップアップし、コマンド送信→ [カスタムプロトコル]シリアルコマンド送信→設定コマンドを選択する。

図はこちら5.2【カスタムプロトコル】シリアルポートコマンドを送信

注：図5.3に示すように、シリアルポートコマンドの入力ボックスをクリックすると、カスタムコマンド機能説明ウィンドウがポップアップします。

図はこちら5.3“ディレクティブ関数の説明”ウィンドウのカスタマイズ

3スライドバーが送信する標準プロトコル命令の表示方法

カスタムプロトコルコマンドが“AB CD $BYTE #3005 $CRC16MODBUS 1，3 $DELAY 1000”で送信された場合、シミュレーション実行ボタンをクリックします。

図5.4に示すように、シミュレーションインターフェイスでスライドバーをスライドさせ、送信されたコマンドを確認します。

図はこちら5.4[カスタムプロトコル]コマンドの送信

5.3スライドバーで輝度を制御する方法

スライドバーを引いて輝度表示を調整します。具体的な操作設定は以下のとおりです。

1テキストコントロールとスライダーを追加する方法

明るさの特定の値を表示する新しいテキストコントロールを作成し、図5.5に示すように、一般的なスライダーのスライダーとテキストコントロールアイコンをクリックして追加します。

図はこちら5.5コントロールの追加

2テキストコントロール変数バインディングの設定方法

右側のプロパティウィンドウで変数バインディング→追加→バインドされたコントロールプロパティは、図5.6に示すように、“テキスト1”→データソースバインディング“システム構成--Brightness”→変換モード“一方向”→変換メソッド“デフォルト”をクリックします。

図はこちら5.6テキストコントロールの変数バインドの設定

注：図5.7に示すように、データソースにバインドされた変数“システム構成-Brightness”。

図はこちら5.7Brightness変数の種類

3スライドバー変数バインディングの設定方法

スライドバーを選択し、右側のプロパティウィンドウで変数バインディングをクリックします→追加をクリックします→バインドされたコントロールプロパティ“現在値”→データソースバインディング“システム構成--Brightness”→変換モード“双方向”→変換メソッド“デフォルト”を図5.8に示すように動作します。

図はこちら5.8スライドバー変数バインディングの設定

4·シミュレーション操作

スライドバーを引くと、図5.9に示すように画面の明るさを調整できます。

図はこちら5.9シミュレーションの実行

5.4スライドバーでアニメーションの再生速度を制御する方法

スライドによりGIFアニメーションの再生速度を制御します。

1アニメーションコントロールとスライダーを追加する方法

ツールボックスの標準コントロールをクリックし、アニメーションアイコンとスライドバーアイコンをクリックして対応するコントロールを追加します（図5.10）。

図はこちら5.10コントロールの追加

2アニメーションコントロールの画像を置き換える方法

アニメーションコントロールを選択右側のプロパティウィンドウで画像をクリックして画像を選択します。アニメーション画像図5.1 1に示すようにGIF形式の画像を選択します。

図はこちら5.11アニメーションコントロールイメージの置き換え

3スライドバー変数バインディングの設定方法

スライドバーを選択し、右側のプロパティウィンドウで変数バインディングをクリック→追加をクリック→バインドされたコントロールプロパティ“Current Value”→データソースバインディング“Var0” →変換モード“双方向”→変換メソッド“Default”を図5.12に示すように動作します。

図はこちら5.12スライドバー変数のバインディング

注：Var0変数は

4アニメーション変数バインディングの設定方法

アニメーションコントロールを選択し、右側のプロパティウィンドウで変数バインディングをクリック→追加をクリック→バインドされたコントロールプロパティは“再生速度”→データソースバインディング“Var0”→変換モード“一方向”→変換メソッド“デフォルト”です。

図はこちら5.13アニメーションコントロール変数のバインドを設定するには

5·シミュレーション·デモンストレーション

シミュレーション実行ボタンをクリックし、シミュレーション実行ウィンドウをポップアップし、スライドバーを引くことでアニメーションの再生速度を制御でき、高速または低速再生ができます。

図はこちら5.14シミュレーションの実行