HMIデザイナー

イントロダクション

画像解析アルゴリズムはどんなマシンビジョンアプリケーションでも中心的な部分ですが、通常、ヒューマンマシンインターフェース（HMI、エンドユーザーのグラフィカル環境）も非常に重要です。Aurora Vision Studioは、完全なソフトウェア環境として、統合されたグラフィカルデザイナーを備えており、エンドユーザーのグラフィカルインターフェースを迅速かつ簡単に作成できます。

非常にシンプルなHMIの例: デザイン時（左）と実行時（右）

ユーザーインターフェースの構成要素はコントロールと呼ばれます。これらは、ボタン、チェックボックス、画像のプレビュー、数値インジケータなどのグラフィカルコンポーネントです。ユーザーは、HMIコントロールウィンドウからコントロールを選択し、それらをHMIキャンバスに配置して、HMIのレイアウトを自由に設計できます。プロパティウィンドウを使用して色、フォントの種類、表示されるテキストなどをカスタマイズします。 コントロールの一部であるコンテナには、階層的に他のコントロールを含めることができるものがあります。たとえば、TabControlには複数のタブがあり、各タブには異なるセットの他のコントロールを含めることができます。これにより、高度なインターフェースを構築することができます。

HMIコントロールは、標準のデータフローの方法でフィルターと接続されます。コントロールとフィルターを接続するための3つの方法があります：

  • フィルターの出力からコントロールの入力への接続 - たとえば、画像やテキストの結果を表示するためです。
  • コントロールの出力からフィルターの入力への接続、データソースとして - たとえば、トラックバーやチェックボックスでプログラム内のさまざまなパラメータを設定するためです。
  • コントロールの出力からフィルターの入力への接続、イベントとして - たとえば、ボタンがクリックされたことを通知するためです。

HMIコントロールには、2つの異なるコントロール間で直接接続できるいくつかのプロパティもあります。詳細については、Label.AutoValueSourceおよびEnableManagerコントロールを参照してください。

機能の概要

Aurora Vision StudioのHMIデザイナーは、カスタムのユーザーインターフェースを非常に簡単に作成できるように設計されています。 これらのインターフェースは物理的な制御パネル（フロントパネルとも呼ばれる）に似ており、 これによりエンドユーザーは実行プロセスを制御し、検査パラメータを設定し、視覚化結果を観察できます。 HMIをパスワードで保護したり、その状態をファイルに保存したり、マルチスクリーンインターフェースを作成したり、 エンドユーザーがオブジェクトモデルや測定プリミティブを作成することを許可するためのより高度な機能もあります。

ただし、他の選択肢が適してくる複雑さのレベルがあります。これらは以下の通りです：

  • C#プログラミング言語でカスタムHMIコントロールを作成する - 特に動的または高度に対話的なGUI要素、例えばグラフなど。
  • .NET Macrofilter Interfacesを使用して、その後C#プログラミング言語で完全なHMIを作成する。
  • C++ Code Generatorを使用して、その後C++プログラミング言語で完全なHMIを作成する。

注意：HMIサポート付きのAurora Vision Executorは、Microsoft Windowsオペレーティングシステムでのみ利用可能です。 Linuxの場合、C++コードを生成し、Qtライブラリを使用してユーザーインターフェースを作成することをお勧めします。

プロジェクトにHMIを追加する

HMI Designerを開くには、メインメニューでView » HMI Designerコマンドを選択するか、 ツールバーのHMIボタンをクリックします：

これにより、"HMI - Design"という特別なビュー（ドッキング可能）および新しいウィンドウ「HMI Controls」が追加されます。 プロパティウィンドウには、選択したコントロール（ここではメインのHMIキャンバス）のパラメータが表示されます。

HMI Designerの要素:（1）HMI Controls カタログ、（2）HMI Editor、（3）コントロールのプロパティ + コンテキストに応じたヘルプ。

HMIキャンバスはHMIデザインビューの初期要素です。これは作成したアプリケーションのウィンドウ全体を表します。 最初は空ですが、HMIの構築プロセス全体でコントロールが配置されます。

HMIの削除

いつでも作成したHMIが不要になったと判断した場合は、メインメニューで利用可能な Edit » Remove HMIコマンドを使用して削除できます。

基本的なワークフロー

HMIデザインプロセスは、以下の三つのステップを繰り返すことで構成されています：

  1. HMI ControlsからHMI Editorにコントロールをドラッグ＆ドロップします。位置とサイズを設定します。
  2. 選択したコントロールのプロパティを設定します。
  3. プログラムエディタで、コントロールの入力または出力と適切なフィルターポートの間に接続をドラッグ＆ドロップします。

HMIデザインの三つのステップ。

HMIデザインの各段階について以下で説明します：

  1. コントロールは、フィルタがプログラムエディタパネルにドラッグされるのと同じように、HMI Canvasにドラッグできます。ウィジェットを互いに対して整列させるには、Snaplinesが使用できます。レイアウトはコンテナの助けを借りて整理できます。

    Snaplinesは、コントロールのレイアウトの設定を補助します。

    また、AnchorおよびDockプロパティを使用して、コントロールの寸法をアプリケーションウィンドウのサイズに合わせることもできます：

    • AnchorをRightまたはBottomに設定すると、コントロールは親ウィンドウの右または下の端からの固定された距離を保ちます。
    • AnchorをStretchに設定すると、コントロールは親ウィンドウとともにリサイズされ、両端からの固定された距離が保たれます。
    • Dockプロパティは、コントロールを親ウィンドウの端または空いているスペース全体にバインドし、このプロパティが設定された複数のコントロールが自動的に利用可能なウィンドウスペースを共有するようにします。 この場合、コントロールをキャンバスに配置する順序が重要であることに注意してください。
  2. コントロールのプロパティには、位置、サイズ、色、フォント、ボーダー、および背景などのグラフィカルな機能が含まれます。コントロールの動作に影響を与えるプロパティもあり、有効または無効にする、初期の内容（テキスト）、可視性、自動サイズ調整などです。最後に、特定のコントロールには通常、値およびその他の構成プロパティ（最小および最大値、ステップ、デフォルトなど）があります。

    注意：各プロパティの簡単な説明に迅速にアクセスするには、コンテキストヘルプが表示されていることを確認してください：

  3. HMIコントロールの接続は、フィルタの入力および出力を接続するのと非常に似ています。まず、接続したいコントロールを選択する必要があります。コントロールの入力および出力のラベルが隣に表示されます。次に、コントロールの出力を適切なフィルタの入力にドラッグ＆ドロップするか、フィルタの出力をコントロールの互換性のある入力にドラッグ＆ドロップします。

    フィルタとコントロールを接続する。

    Aurora Vision Studioは、互換性のないポート間の接続を許可しないことで、このプロセスをサポートします。接続が確立されると、入力または出力ラベルには少しのプラグアイコンが含まれ、接続されたフィルタにはその入力または出力の隣に「HMI」と表示されます。

    フィルタとコントロール間の接続が確立されました。

    注意：HMIエディタがアンドックされている場合は、接続を作成する前にProgram Editorと重なっていないことを確認してください。

    フィルタとHMIコントロールの接続を解除する必要がある場合は、入力または出力のラベルを右クリックします。コンテキストメニューには接続を解除するオプションが含まれます。

    Program Editorでフィルタとコントロールの接続を解除する。

    HMIデザイナーでフィルタとコントロールの接続を解除する。

プログラムとのHMIインタラクション

重要：プログラムの実行中にHMIコントロールは、次に示すように厳密に定義された瞬間でデータをフィルタと交換します。

  • HMIコントロールからフィルタへのデータ送信は、HMIコントロールと接続があるマクロフィルタの各イテレーションの開始時に行われます。
  • 逆方向、つまりフィルタからHMIへのデータ送信は、各イテレーションの終了時に行われます。

これにはいくつかの重要な含意があります。

  • HMIコントロールの出力をマクロフィルタ内の複数のフィルタに接続でき、それらは同じイテレーションで正確に同じ値を受信することが保証されます。
  • コントロールに値を送信し、次のフィルタがそれを読み取ろうとしたときにその値がすぐに利用可能であることを期待してはいけません。それは次のイテレーションでのみ利用可能です。次のイテレーション内の次のフィルタはまだ古い値を読み取ります。
  • タスクが別のタスクにネストされている場合、データの転送の順序が驚くべきものになる可能性があります。たとえば、外部タスクの結果が内部タスクが終了するまで表示されないことがあります。

    タスクが別のタスクにネストされている場合のサンプル通信構造。Task 2は通常、Task 1がHMIにデータを送信するまで非常に長い間ループして動作します。

お勧め事項

フィルタとコントロール間の通信を効率的に処理するために、以下のルールをお勧めします：

  • HMI通信のネストされたループ（タスク）は避けてください。代わりに:
    1. アプリケーションごとに1つの有限状態機械を作成してください。例えば、ユーザーがボタンをクリックするのを待つためのネストされたループの代わりに、「Waiting」という名前のアプリケーション状態を作成し、ボタンクリックイベントで別の状態に遷移します。
    2. または、HMI通信のない「マスター」タスクを作成し、その下にHMI通信を持つ2つ以上のネストされたタスクを作成し、アプリケーションの異なるフェーズを表します。たとえば、マスターは「Main」マクロフィルタであり、2つのサブタスク「WaitForStart」と「RunInspection」があります。
  • 1つのプログラムイテレーションが長時間かかり、通信を非常に特定の瞬間に実行する必要がある場合、HMIへのデータの送受信のために専用のネストされたマクロフィルタを使用します。このネストされたマクロフィルタは通信の瞬間を強制します。マクロフィルタの入力ブロックからHMIコントロールへの直接の接続が不可能な場合は、CopyObjectフィルタを使用します。以下も参照してください。 下記の異なる場所からHMIへ値を送信する。
  • HMIコントロール間の複雑な依存関係を避けてください（つまり、ユーザーが別のコントロールで設定した値を使用して1つのコントロールのプロパティを設定する）。そうすると、プログラムまたはユーザーが設定した値をフィルタまたはレジスタを介して値を送信する必要があります。このルールの例外は、Labelコントロールの「Auto Value」機能で、LabelのコンテンツをTrackBarやKnobなどのコントロールで設定された値とリンクできるようにします。
  • プログラム構造を単純で明確に保ちます。ほとんどのアプリケーションには、次の3つの部分から構成される単一のループがあるべきです：（1）画像取得、（2）画像処理、（3）HMI用のデータの準備。 HMIとのすべての接続は、以下の画像で示されているように、メインループのトップレベルで作成されることをお勧めします：

    HMI接続を備えたプログラムの典型的な単純な構造。

HMIへのNIL値の送信

フィルタからHMIコントロールへの条件付き値の送信も可能です。 Nil値が送信されると、コントロールのプロパティは変更されません。これは、プログラムとユーザーが同じプロパティを変更する場合に有用です（例：トラックバーの位置）。 このような場合、プログラムからコントロールに送信されるデータは条件付きであるべきです。 これにより、ユーザーによって設定された値が上書きされないようになります。

複数の場所からHMIへの値の送信

HMIコントロールの各入力は、プログラム内でデータの1つのソースしか持つことができません。ただし、そのコントロールに対して異なる場所から値を送信する必要があることがあります。 例えば、VideoBoxディスプレイはGigEVision_GrabImageの出力と接続できますが、エラーが発生した場合には空の画像をそのコントロールに送信したいかもしれません。 これは、マクロフィルタを作成し、1つまたは複数の入力を持ち、同じ数のCopyObjectフィルタでHMIと接続することで実現できます（マクロフィルタの入力からHMIへの直接の接続は許可されていません）。そのマクロフィルタは、プログラム内のさまざまな場所から何度も使用でき、効果的に複数の場所からHMIへの明示的な通信が可能になります。

プログラム内の複数の場所からHMIに明示的に通信するためのサンプルマクロフィルタ。

HMIに表示するデータの準備

標準のデータプレビューウィンドウ（開発環境）とHMI（ランタイム環境）で検査結果を視覚化する方法には重要な違いがあります。データプレビューウィンドウでは、複数のデータ項目をドラッグ＆ドロップするだけで、色や線の太さなどのプロパティが自動で選択されます。これはアプリケーション開発プロセスでデータを素早く分析するのに非常に適しています。 しかし、HMI（ランタイム環境）では、各単一要素の視覚化スタイルに完全な制御を持ちたいです。したがって、画像などのHMIコントロール（例：VideoBox）にデータを送信する前に、適切なフィルタを使用して視覚化を準備する必要があります。以下はその例です：

  • Image Drawing – 図形プリミティブ、テキストラベルなどでオーバーレイされた画像を準備するためのもの。
  • CropImage、ResizeImage、MirrorImage など – 表示前に画像を任意の方法で変換するためのもの。

    注意: ZoomingVideoBoxコントロールには、表示される画像をパンおよびズームするための組み込みサポートがありますので、追加のフィルタは不要です。

  • FormatRealToString、FormatIntegerToString、FormatPoint2DToString など – 数値値を指定した小数桁数や小数点の区切り文字などのプロパティで文字列にフォーマットするためのもの。
  • ConcatenateStrings、StringToUpperCase、Substring など – 特定の方法でテキスト値を表示するためのもの。

Example 1:

ボタンの検査アプリケーションでは、ボタンを検出し、各ボタンが存在するかどうかを確認します。 検査結果を示すために、各ボタンの上に緑または赤の円を表示したいとします。

解決策は、DrawShapeRegions_MultiColor フィルタを使用し、その inColorIds 入力を CheckPresence_Intensity フィルタの outIsPresent 出力に接続することです。

単一の画像に複数のオーバーレイが必要な場合、複数のImage Drawing フィルタを順次接続します。

注意: 多くの描画フィルタが順次接続されている場合、Aurora Vision Studio は各フィルタのために画像のコピーを保持するため、パフォーマンスに影響する可能性があります。 推奨される回避策は、描画ルーチンを非常に単純なユーザーフィルタでカプセル化することです。なぜなら、C++ レベル（AVL Lite ライブラリを使用）で画像の新しいコピーを作成せずに描画できるからです。 Aurora Vision Studio の "User Filter Drawing Results" の例を参照してください。それを "Release" 構成でビルドし、適切なプラットフォーム（Win32 / x64）向けにビルドしてください。

Example 2a:

ScanMultipleStripes フィルタには、outStripes.Width および outStripes.Magnitude という名前の出力があり、これらは RealArray 型です。 これらの数値を DetailedListView コントロールで HMI に表示したい場合、DetailedListView コントロールには StringArray 型の複数の入力があります。

各 Real 数値を FormatRealToString フィルタを使用して String に変換することが解決策です。以下の画像では、異なるパラメータが使用されているフォーマットフィルタで表示される数値の 2 列が示されています。

Example 2b:

同様の数値の配列を Label コントロールに表示する場合、Label コントロールには単一の String 入力（配列ではない）がありますので、さらなる前処理が必要です。 FormatRealToString フィルタでは、inSuffix 入力に改行文字を追加し、 ConcatenateStrings_OfArray を使用して すべての個々の文字列を1つに結合する必要があります。

関連項目