このサイトで JavaScript が必要です。

バージョン

Is this content useful?

Thank you for your feedback!

Thank you for your feedback! You have rated this topic in the last 30 days.

XamDataGrid でコントロールコンフィギュレーターを使用する

このトピックでは、XamDataGrid コントロールを構成するためのコントロールコンフィギュレーターの使用方法について説明します。コントロールコンフィギュレーターの全般的な概要および更新方法についての情報は、コントロールコンフィギュレーターを使用した作業の開始をご覧ください。

概要

このトピックは、以下のセクションで構成されます。

概要
ビデオ
更新
XamDataGrid の概要
XamDataGrid のレイアウトモード
コントロールコンフィギュレーター UI
コントロールコンフィギュレーターリボン
コントロールコンフィギュレーターの制限

概要

XamDataGrid コントロールコンフィギュレーターは、Infragistics WPF XamDataGrid コントロールを構成し、リアルタイムのプレビューが可能なビジュアルツールです。

DataSource プロパティにデータバインディングを設定後、リアルタイムでサンプルデータが作成されます。このサンプルデータは、プロジェクトタイプに基づいてコンフィギュレーターレイアウトサーフェイスに XamDataGrid を描画します。

XamDataGrid コントロールコンフィギュレーターの主な使用事例として新しい XamDataGrid をすばやく構成したり、新しく作成した XamDataGrid の再構成したりといったシナリオがあります。Visual Studio XAML エディターで手動的に編集された XamDataGrid の構成はサポートされません。説明については、コントロールコンフィギュレーターの制限セクションを参照してください。

$images\WPF_ConfiguringDataGrid_1.png$

要件

WPF XamDataGrid コントロールコンフィギュレーターを使用するには、以下の製品の最新バージョンをインストールする必要があります。

Infragistics Ultimate 2017 Vol 2 以後 (サービスリリースを含む)
Ultimate UI for WPF 2017 Vol 2 以後 (サービスリリースを含む)

非推奨になった XamDataGrid のフィールド XAML

以下のコードは XamDataGrid のフィールドを定義する非推奨になった XAML 構文を示します。この構文は WPF XamDataGrid コントロールコンフィギュレーターでサポートされません。

XAML の場合:

<ig:Field Name="SubTotal">
    <ig:Field.Settings>
        <ig:FieldSettings EditorType="{x:Type igEdit:XamCurrencyEditor}">
            <ig:FieldSettings.EditorStyle>
                <Style TargetType="{x:Type igEdit:XamCurrencyEditor}">
                    <Setter Property="ValueType" Value="{x:Type system:Decimal}"/>
                    <Setter Property="NullText" Value="No Salary"/>
                    <Setter Property="Mask" Value="{}{currency:7.2}"/>
                </Style>
            </ig:FieldSettings.EditorStyle>
        </ig:FieldSettings>
    </ig:Field.Settings>
</ig:Field>

現在の XamDataGrid のフィールド XAML

XAML の以下の一行を上記の XAML と置き換えます。この短い構文は 14.2 バージョンより利用可能です。WPF XamDataGrid コントロールコンフィギュレーターでは、XAML の Field 宣言にこの構文が使用できます。

XAML の場合:

<ig:CurrencyField Name="SubTotal" Mask="{}{currency:7.2}" NullText="No Salary"/>

Note	注: Field コントロールはコントロールコンフィギュレーターでサポートされますが、ネストされたスタイルはサポートされません。説明については、以下のコントロールコンフィギュレーターの制限セクションを参照してください。

このトピックの画像で使用されるデータモデル

このトピックで使用されるサンプルプロジェクトを Infragistics GitHub リポジトリからダウンロードできます。

以下のコードスニペットは OrderDetails コレクションプロパティを持つ Order クラスを示します。OrderDetails コレクションプロパティを使用すると、ネストされるフィールドレイアウトを作成できます。以上の画像には、ネストされる OrderDetails レイアウトを持つ Order レイアウトを示します。機能レイアウトは OrderDetails の子レイアウトです。

C# の場合:

public class Order
{
    public String AccountingCode { get; set; }
    public IList<OrderDetail> OrderDetails { get; set; }

    public Order()
    {
        this.OrderDetails = new List<OrderDetail>();
    }
}

ビデオ

XamDataGrid コンフィギュレーターを使用する手順については、ビデオを参照してください。

更新

コントロールコンフィギュレーターは Microsoft Visual Studio Marketplace で更新されます。公開したときに更新を取得するには、自動更新を有効にしてください。

自動更新の有効化を確認

XamDataGrid の概要

WPF XamDataGrid にリッチオブジェクトモデル、機能セット、および機能性があります。XamDataGrid オブジェクトモデルの理解が XamDataGrid および XamDataGrid コントロールコンフィギュレーターを使用する際の前提条件です。

$images\WPF_ConfiguringDataGrid_2.png$

XamDataGrid オブジェクトモデルは、下位レベルのオブジェクトプロパティ値を解決するためにオブジェクト継承を使用します。上記のダイアグラムのオレンジまたは緑のオブジェクトは、上位レベルのオブジェクトから継承するオブジェクトです。未設定または未変更の下位レベルの値は、上位レベルのオブジェクトから値を継承します。プロパティの多くは null 値のデフォルト値があります。ランタイムでプロパティ解決ロジックはプロパティ値を null 以外の値に解決します。

XamDataGrid オブジェクトモデルを使用すると、上位レベルに設定を指定し、必要に応じてより下位レベルのプロパティを変更します。

例:

XamDataGrid FieldLayoutSettings (上レベル) で RecordSelectorNumberType プロパティを設定し、FieldLayout でその FieldLayout の RecordSelectorNumberType を使用して別の値を設定できます。

XamDataGrid、FieldLayout、または Field オブジェクトで設定可能な FieldSettings も同じです。

Note	注: コントロールコンフィギュレーターで下位レベルオブジェクトで値を設定し、その後上位レベルオブジェクトで同じ値を設定すると、下位レベルのオブジェクトの値を設定するため、上位レベルオブジェクトの値が解決されなく、下位レベルオブジェクトで使用されません。

XamDataGrid のレイアウトモード

XamDataGrid は、レコードでセルの簡易配置および複合配置をサポートします。配置を手動的 (明示的) に指定または自動的に生成できます。自動配置機能を有効にするには、FieldLayoutSettings の AutoArrangeCells プロパティを LeftToRight または TopToBottom に設定します。このプロパティを Never に設定すると、自動配置機能を無効にします。

詳細については、「レコード内でセルを整理」トピックを参照してください。

コントロールコンフィギュレーターで自動配置を有効または無効にするには、FieldLayout を選択して、リボンの [自動配置] の切り替えボタンをクリックします。自動配置はデフォルトで有効です。

$images\WPF_ConfiguringDataGrid_3.png$

自動配置が無効の場合にセルを行および列に配置するには、特定のフィールドを選択し、プロパティグリッドでレイアウトカテゴリにスクロールして値を設定します。

$images\WPF_ConfiguringDataGrid_4.png$

フィールドのレイアウト値を設定すると XamDataGrid の UI が更新されます。

以下の画像は Row、Column、RowSpan、および ColumnSpan プロパティを設定したレイアウトを示します。

$images\WPF_ConfiguringDataGrid_5.png$

Note	注: 自動配置が有効な場合は値に影響しないため、プロパティグリッドのレイアウトカテゴリが非表示になります。

コントロールコンフィギュレーター UI

$images\WPF_ConfiguringDataGrid_6.png$

以下のリストはコントロールコンフィギュレーター UI の領域を説明します。

コンテキストリボンタブ (1) – コンテキストリボンタブは、コントロールコンフィギュレーターの左列の最下位レベルで選択したオブジェクトに基づいて表示されます。上記の画像で、Customer.FirstName フィールドが選択済みで、[フィールド] のコンテキストタブがアクティブです。[フィールド] のフィールド設定コンテキストタブにアクセスするには、それをクリックします。
XamDataGrid オブジェクト (2) – XamDataGrid オブジェクトの階層ツリービューを表示します。オブジェクトを選択すると、表示されるリボンタブが変更されて、プロパティグリッド (6) にオブジェクトのプロパティを表示します。最上位レイアウトの子オブジェクトはここで削除できます。たとえば、Features レイアウトを削除するには、右側の [-] ボタンをクリックします。
フィールド (3) – このパネルは [現在] のフィールド (3A) および [利用可能] なフィールド (3B) に分割されます。XamDataGrid オブジェクト (2) でフィールドレイアウトを選択すると、[フィールド] セクションが生成されます。
- [現在] セクション (3A) は選択済みのフィールドレイアウトの UI に追加した FieldItems の階層ツリービューを表示します。FieldItem のコレクションは Fields および FieldGroups を含みます。FieldItems を削除するには、[-] アイコンをクリックします。FieldItems を順序変更するには、[現在] フィールドセクション (3A) でドラッグします。オブジェクトを選択すると、表示されるリボンタブが変更され、プロパティグリッド (6) でオブジェクトのプロパティを表示します。
- [利用可能] セクション (3B) は UI に追加していないフィールドを示します。[+] アイコンをクリックすると、フィールドは選択した FieldLayout および UI に追加されます。
フィールドまたはフィールドグループ (4) - 選択すると表示されるリボンタブが変更され、プロパティグリッド (6) でオブジェクトのプロパティを表示します。[-] アイコンでこの FieldItem を削除します。また、すべてのフィールドの左にフィールドタイプアイコンが表示されます。
- ネストされるモデルオブジェクト構文 (Customer.FirstName) は、FieldLayout オブジェクトで選択された Field がクラスプロパティの場合に使用されます。この例では、Order クラスに Customer クラスプロパティがあります。
- ネストされるプロパティを持つフィールドは以下のような別のバインド構文を使用します。BindingType が UseNameBinding の代わりに UseAlternateBinding に設定されます。AlternateBinding プロパティは Customer.FirstName に設定されます。
  $images\WPF_ConfiguringDataGrid_7.png$
- 非バインドフィールドの BindingType は Unbound です。
- 以下の FieldGroup は 3 つの子 Field を含みます。FieldGroup は子 FieldGroup を含むこともできます。FieldGroup のすべての子 FieldItem が削除または移動された場合、FieldGroup を削除できます。
  $images\WPF_ConfiguringDataGrid_8.png$
ヘルプ – 各リボンタブにリボンまたはプロパティグリッドでの項目についてのヘルプトピックへのリンクを含みます。
- また、XamDataGrid オブジェクト (2) の項目の上にホバーすると、ヘルプアイコンが表示されます。クリックすると、ブラウザーでそのオブジェクトのヘルプトピックが表示されます。
  $images\WPF_ConfiguringDataGrid_26.png$
プロパティグリッド (6) – 最下位レベルで選択済みのオブジェクトのプロパティを表示します。この例では、Customer.FirstName の Field オブジェクトが最下位レベルの選択済みオブジェクトです。
- オブジェクトを選択すると、選択済みのオブジェクトに基づいてプロパティグリッドのタイトルが変更されます。
- プロパティはカテゴリにグループ化されます。
フィールドエディターに固有のプロパティカテゴリ (7) – FieldItem を選択すると、最初のプロパティグリッドカテゴリ (7) は Field エディターにないプロパティを示します。Field および Template エディターに固有のプロパティがないため、フィールドカテゴリが最初に表示されます。
フィールドカテゴリ (8) – Field カテゴリおよびそれ以下のカテゴリはすべてのフィールドエディターに共有されます。

フィールドセクションボタンおよびエキスパンダー機能

$images\WPF_ConfiguringDataGrid_9.png$

[最大化] ボタン (1) をクリックすると、FieldItem を操作するためのフィールドの現在のセクション (2) が左列全体に表示されます。標準の状態に戻るには、[最大化] ボタンが配置されていた場所にある [復元] ボタンをクリックします。
[すべて削除] ボタンをクリックすると、選択した FieldLayout および UI からすべての FieldItem を削除します。
[追加オプション] エクスパンダーコントロールをクリックすると、3 つのボタンを表示します。
- [非バインドの追加] - クリックすると、現在のセクションに非バインドフィールドを追加します。
- [フィールドグループの追加] - クリックすると、現在のセクションに FieldGroup を追加します。
- [すべて追加] - クリックすると、現在のセクションにすべての利用可能なフィールドを追加します。

追加されたフィールドの表示場所

フィールドがセクション (3B) のボタンを使用して追加される場合、フィールドは以下の条件に基づいてセクション 3A に追加されます:

FieldLayout が選択済みのオブジェクトの場合 (フィールドは選択されません)、フィールドは 3A でリストの終了に追加されます。
FieldGroup が選択済みのオブジェクトの場合、フィールドはその FieldGroup の子の終了に追加されます。
FieldItem が選択済みのオブジェクトで、FieldGroup にある場合、フィールドは選択済みの FieldItem の後に追加されます。
FieldItem が選択済みのオブジェクトで、FieldGroup にない場合、フィールドは選択済みの FieldItem の後に追加されます。

この機能を使用すると、新しく追加されたフィールドを移動する必要はありません。

項目の移動

FieldItems を現在のセクション (3A) でドラッグすると、FieldItem の移動先を示すドラッグガイドが表示されます。FieldItem を FieldGroup に追加するには、FieldItem を FieldGroup 上にドロップするか、FieldGroup にドロップします。

Note	注: 自動配置フィールドレイアウトを使用しない場合、FieldItem をドラッグした後、プロパティグリッドを使用してその FieldItem の Row、Column、RowSpan、および ColumnSpan プロパティを設定する必要があります。

コントロールコンフィギュレーターリボン

XamDataGrid コントロールコンフィギュレーターは、馴染みのあるリボンインターフェイスでよく使用されるアクションやオプションを表示します。リボンタブは XamDataGrid オブジェクトペインおよび Fields ペインで選択済みのオブジェクトに基づいて決定されます。選択したオブジェクトに基づいて、異なるリボンタブが表示されます。

XamDataGrid のオブジェクトペインから XamDataGrid または FieldLayouts オブジェクトを選択すると、フィールドレイアウト設定、フィールド設定、およびビュー設定タブが表示されます。このリボンタブは XamDataGrid レベルで有効/無効にできる、頻繁に使用される機能を表示します。

$images\WPF_ConfiguringDataGrid_10.png$

XamDataGrid のオブジェクトペインに追加したフィールドレイアウトを選択すると、フィールドレイアウト、フィールドレイアウト設定、およびフィールド設定タブが表示されます。このリボンタブは選択したフィールドレイアウトレベルで有効/無効にできる、頻繁に使用される機能を表示します。このレベルの設定は XamDataGrid または FieldLayouts オブジェクトレベルの設定をオーバーライドします。

$images\WPF_ConfiguringDataGrid_11.png$

フィールドペインでフィールドレイアウトに追加したフィールドを選択すると、フィールドおよびフィールド設定タブが表示されます。このリボンタブは選択したフィールドレベルで有効/無効にできる頻繁に使用される機能を表示します。このレベルの設定は親のフィールドレイアウトオブジェクトレベルの設定をオーバーライドします。

$images\WPF_ConfiguringDataGrid_12.png$

データグリッドタブは常に表示されます。データグリッドタブをクリックすると、XamDataGrid オブジェクトまたはフィールドペインで選択済みのオブジェクトに関係なく XamDataGrid オブジェクトペインの XamDataGrid レベルに移動されます。

リボンツール

リボンタブには、構成中の XamDataGrid コントロールの機能を有効/無効にする多数のツールが含まれます。このツールを使用して XamDataGrid コントロールの機能のプロパティを設定できます。

データグリッドタブおよびフィールドレイアウト、フィールドなどの主な機能タブにあるリボンツールは、XamDataGrid でプロパティを設定する機能を提供します。このプロパティは FieldLayoutSettings または FieldSettings などの API メンバーにあります。たとえば、データグリッドの主なタブのフィルタリンググループは FieldLayoutSettings および FieldSettings でのプロパティを設定します。リボンツールのツールチップは、設定するプロパティの名前および XamDataGrid API の場所についての情報を提供します。

$images\WPF_ConfiguringDataGrid_13.png$

ボタン

ボタンはリボンタブの一番簡易なツールです。ボタンツールをクリックしてアクションを実行します。このアクションについての説明がツールチップに表示されます。

$images\WPF_ConfiguringDataGrid_14.png$

null 許容型のチェックボックス

多くの XamDataGrid API オブジェクトのプロパティが null 許容型のブール値です。このプロパティはリボンタブに 3 ステートチェックボックスによって表されます。以下は各ステートのビジュアル表現です。

Null	True	False
$images\WPF_ConfiguringDataGrid_15.png$	$images\WPF_ConfiguringDataGrid_16.png$	$images\WPF_ConfiguringDataGrid_17.png$

単一選択

単一選択ツールは複数のオプションを含むメニューをドロップダウンします。利用可能なオプションから選択すると選択が設定されてツールが閉じられます。

$images\WPF_ConfiguringDataGrid_18.png$

複数選択

複数選択ツールは単一選択ツールと同様に複数のオプションを表示しますが、複数選択ツールは開いたままで複数の値を選択できます。コントロールコンフィギュレーターでメニュー以外をクリックすると、複数選択メニューが閉じられます。「All」または「None」オプションがある場合、そのオプションを選択すると以前に選択したオプションは解除されてメニューツールが閉じられます。

$images\WPF_ConfiguringDataGrid_19.png$

高度オプション

リボンタブグループから特定のグループに関連する詳細機能を提供するダイアログを起動できます。リボンタブグループはよく使用される機能の一部のみを公開しますが、リボンタブグループに適切でない高度な構成機能がある場合に便利です。

このダイアログ起動機能はリボンタブグループの右下角で小さいアイコンによって表されます。

$images\WPF_ConfiguringDataGrid_20.png$

フィルタリング

フィルタリングリボンタブグループは一般的なフィルタリング機能を提供しますが、フィルタリンググループのダイアログを起動すると高度なフィルタリングオプションを設定できます。

$images\WPF_ConfiguringDataGrid_21.png$

ダイアログを起動すると、機能セット (1)、フィルターリソース (2)、FieldLayoutSettings で利用可能なフィルタリングオプション (3)、および FieldSetting で利用可能なフィルタリングオプション (4) が表示されます。

$images\WPF_ConfiguringDataGrid_22.png$

機能セット (1) にある値を変更すると、変更を保存するために [機能の適用] ボタンをクリックする必要があります。FieldLayoutSettings (3) または FieldSettings (4) の変更は直ちに保存されます。ウィンドウの X ボタンまたは [閉じる] ボタンをクリックすると、設定はキャンセルされません。

パフォーマンス

パフォーマンスタブグループは単一のスクロールモード設定を含みます。パフォーマンスグループのダイアログランチャーをクリックすると高度なパフォーマンスダイアログを起動できます。

$images\WPF_ConfiguringDataGrid_23.png$

ダイアログを起動すると、機能セット (1)、パフォーマンスリソース (2)、プロパティおよび抑制されるイベントのタブ (3)、XamDataGrid でのパフォーマンスオプション (4)、FieldLayoutSettings でのパフォーマンスオプション (5)、および FieldSettings でのパフォーマンスオプション (6) が表示されます。

$images\WPF_ConfiguringDataGrid_24.png$

抑制されるイベント

処理されないルーティングイベントを抑制することによってパフォーマンスが向上します。これは、要素階層のルーティングイベントで発生するオーバヘッドによるパフォーマンスの低下を改善します。イベントを選択して発生されるのを抑制します。

$images\WPF_ConfiguringDataGrid_25.png$

機能セット (1) にある値を変更すると、変更を保存するために [機能の適用] ボタンをクリックする必要があります。パフォーマンスダイアログ (3、4、5、6) での変更は直ちに保存されます。ウィンドウの X ボタンまたは [閉じる] ボタンをクリックすると、設定はキャンセルされません。

コントロールコンフィギュレーターの制限

XamDataGrid コントロールコンフィギュレーターは新しい XamDataGrid または手動的に編集されていない XAML を使用する XamDataGrid の編集エクスペリエンスを向上します。

コントロールコンフィギュレーターでの XamDataGrid はライブ実行している XamDataGrid です。コントロールコンフィギュレーターがユーザーコードを実行できない、あるいは XAML でユーザー型またはスタイルを解析できません。

デフォルトデザインタイムの作業では XamDataGrid の構成に時間がかかります。

上記の説明にあるように以下の親フィールドオブジェクトのプロパティは XamDataGrid コントロールコンフィギュレーターでサポートされません。ユーザー XAML で設定されるプロパティは保存時に失われます。

型	プロパティ名
ComboBoxField	ComboBoxStyle, DropDownButtonStyle, PostDropDownAreaTemplate, PreDropDownAreaTemplate
DateTimeField	DropDownButtonStyle
Field	CalculationSettings, CellBindings, CellValuePresenterStyle, DataType, EditAsType, EditorStyle, EditorType, FormatProvider, IsSelected, ValueConstraint, ValueToTextConverter
FieldGroup	LabelPresenterStyle, ToolTip
FieldLayout	CalculationReferenceId, CrossFieldRecordFilters, RecordFilters, SummaryDefinitions, ToolTip
FieldLayoutSettings	DataRecordCellAreaStyle, DataRecordPresenterStyle, DataRecordPresenterStyleSelector, DefaultColumnDefinition, DefaultRowDefinition, FieldGroupLabelPresenterStyle, HeaderLabelAreaStyle, HeaderPrefixAreaStyle, HeaderPresenterStyle, MaxFieldsToAutoGenerate, RecordListControlStyle, RecordSelectorNumberStyle, RecordSelectorNumberStyleSelector, RecordSelectorStyle, SpecialRecordOrder
FieldSettings	CellPresenterStyle, CellValuePresenterStyle, CellValuePresenterStyleSelector, EditAsType, EditorStyle, EditorStyleSelector, EditorType, ExpandableFieldRecordPresenterStyle, ExpandableFieldRecordPresenterStyleSelector, ExpandedCellStyle, ExpandedCellStyleSelector, FilterCellEditorStyle, FilterCellValuePresenterStyle, FilterComparer, FilterEvaluator, GroupByComparer, GroupByEvaluator, GroupByRecordPresenterStyle, GroupByRecordPresenterStyleSelector, LabelPresenterStyle, LabelPresenterStyleSelector, SortComparer
ViewSettings	FocusVisualStyle, ToolTip

WPF | ヘルプ トピック

XamDataGrid でコントロール コンフィギュレーターを使用する

概要

概要

要件

非推奨になった XamDataGrid のフィールド XAML

現在の XamDataGrid のフィールド XAML

このトピックの画像で使用されるデータ モデル

ビデオ

更新

XamDataGrid の概要

XamDataGrid のレイアウト モード

コントロール コンフィギュレーター UI

フィールド セクション ボタンおよびエキスパンダー機能