バージョン

選択の構成 (xamDiagram)

トピックの概要

目的

このトピックでは、 xamDiagram™ コントロールでダイアグラムの複数の項目の選択を有効または無効にする方法、およびプログラムによって選択を実行する方法を説明します。

前提条件

このトピックをより理解するために、以下のトピックを参照することをお勧めします。

トピック 目的

このトピックでは、 xamDiagram コントロールおよびその主要機能の概念的な概要を説明します。

このトピックでは、 xamDiagram コントロールを WPF アプリケーションに追加する方法を説明します。

概要

ダイアグラム項目の選択の構成の概要

xamDiagram コントロールでは、ダイアグラム領域にあるダイアグラムの項目をプログラムによって選択できるようにする機能が提供されています。使用できる選択機能には、「Single」、「Multiple」、「None」があり、いずれもプロパティの設定で構成できます。デフォルトでは、ダイアグラムの複数の項目の選択が有効になっています。

ダイアグラム項目を選択するには、マウスの左ボタンをクリックする、またはすべての目的の項目が破線で縁取りした [選択] ツールの境界線内に収まるまで、ダイアグラム上でマウスを移動させながらマウスの左ボタンを押し続け、[選択] ツールを描画します。(詳細は、 ダイアグラムの項目のインタラクションと操作性を参照してください。)

ダイアグラム コントロールのコンテキストでダイアグラムの項目を選択することは、項目のレンダリングや構成の際に、項目や項目のグループを強調表示する (項目を破線で縁取りした四角形で囲む) 上で役立ちます。これは、オプション ペインを使用、またはコードを使用して実行できます。 xamDiagram コントロールの SelectionMode プロパティで使用する特定のタイプの選択を設定し、ダイアグラムの項目選択の動作を構成します。プロパティのデフォルト設定は、複数要素の選択です (SelectionMode = "Multiple")。

ダイアグラムの項目の選択状態は、ユーザー インタラクションによる選択機能とは別に実装されるプロパティの設定 ( DiagramItem.IsSelected) を使用してプログラムにより変更できます。

xamDiagram Configuring Selection 1.png

ダイアグラム項目の選択は、 SelectedItems コレクションを事前設定し、このコレクションを変更するたびに、 SelectionChanged イベントを発生させメンバーに対してカスタム ロジックを適用できるようにします。たとえば、プログラムによるダイアグラムの項目の追加や削除などの操作ができます。データ バインディングの場合、 SelectedDataItems コレクションは SelectedItems と同期され、選択したダイアグラム項目に対応するデータ項目を含みます。

ダイアグラム項目の選択の構成の概要表

以下の表は、ダイアグラムの項目選択の構成可能な要素を簡単に説明し、それらを構成するプロパティにマップします。

構成可能な項目 詳細 プロパティ

選択モード

複数のダイアグラム項目を同時に選択します。

選択モードの構成

概要

ダイアグラムのスペースで選択できるダイアグラム項目の数を指定するには、コントロールの選択モードを構成します。デフォルト設定では、ダイアグラムで複数のダイアグラム項目が選択できるようになっています。項目数を 1 つに制限するには、SelectionMode プロパティの値を 「Single」 に設定します。または、 「None」 に設定すると選択できなくなります。

ダイアグラムの項目選択インタラクションのリファレンス表

以下の表では、 SelectionMode プロパティの設定に対する xamDiagram コントロールのユーザー インタラクション機能を簡単に説明します。

ユーザーのアクション 方法 SelectionMode プロパティの設定値:

ダイアグラムのスペースの 1 つの項目の選択

  • マウス クリック

  • [選択] ツール

Single

複数のダイアグラム項目の選択

  • ShiftまたはCtrl を押しながら、選択範囲に含める項目をクリックします。

  • [選択] ツール

Multiple

現在の選択範囲全体のクリア

[選択] ツールで選択された領域以外のダイアグラム領域をマウスでクリックします。

  • Single

  • Multiple

特定のダイアグラム項目の複数選択 / 複数選択の解除

ShiftまたはCtrl を押しながら、選択範囲に含める項目をクリック、または選択範囲を解除する項目をクリックします。

Multiple

プロパティ設定

以下の表は、任意の構成とそれを管理するプロパティ設定のマップを示します。

目的: 使用するプロパティ: 設定値:

ダイアグラムのスペースの 1 つの項目を選択する機能の構成

Single

ダイアグラムのスペースの複数の項目を選択する機能の構成

Multiple

ダイアグラムのスペースの複数の項目の選択禁止

None

プログラムによる項目の選択 /選択解除

概要

xamDiagram コントロールでは、プログラムによる項目の選択、および選択の解除ができます。 IsSelected プロパティの値で選択状態を構成し、項目を選択または選択解除します。

プロパティ設定

以下の表は、任意の構成とそれを管理するプロパティ設定のマップを示します。

目的: 使用するプロパティ: 設定値:

ダイアグラムの項目選択機能の有効化

True

ダイアグラムの項目選択機能の無効化

False

以下のスクリーンショットは、以下の設定の結果のノードの選択状態の構成を示しています。

プロパティ

True

xamDiagram Configuring Selection 2.png

以下のコードはこの例を実装します。

XAML の場合:

<ig:XamDiagram x:Name="diagram"
               Width="300"
               Height="250"
               Background="#F9F9F9">
    <ig:DiagramNode x:Name="node0"
                    Position="5,125"
                    IsSelected=”True”/>
</ig:XamDiagram>

関連コンテンツ

トピック

このトピックの追加情報については、以下のトピックも合わせてご参照ください。

トピック 目的

このトピックでは、 xamDiagram コントロールで実行されるユーザー インタラクションのすべてのタスクの概要を説明します。

このトピックでは、 xamDiagram コントロールが提供するコマンドを使用する方法、およびコマンドに関連付けられたキーボードのショートカットを変更する方法を説明します。