このトピックでは、 xamMultiColumnComboEditor コントロールの概要を説明します。以下の例では、エディターを使って構成、作業する方法を理解し、アプリケーションのユーザー エクスペリエンスを高める方法を確認します。
以下の表には、このトピックの必須条件が示されています。
以下の表は、xamMultiColumnComboEditor の主な機能を示しています。
xamMultiColumnComboEditor コントロールをデータと共に投入するには、所定のデータ ソースに対してその ItemsSource プロパティを設定する必要があります。オブジェクトの任意の IEnumerable コレクションを使用できます。
注: コントロールは項目への直接の追加をサポートしないため、コントロールを IEnumerable にバインドする必要があります。
xamMultiColumnComboEditor コントロールは、コントロールの ItemsSource プロパティに設定された IEnumerable に含まれるデータ オブジェクトのすべてのパブリック プロパティの列を自動的に生成することができます。コントロールの AutoGenerateColumns プロパティ (デフォルトは True) は、この動作を制御します。または、AutoGenerateColumns を False に設定して、列を作成しコントロールの Columns コレクションに直接追加することによって、表示する列を手動で指定することもできます。
XAML の場合:
<ig:XamMultiColumnComboEditor
x:Name="xamMultiColumnComboEditor"
DisplayMemberPath="Company"
AutoGenerateColumns="False">
<ig:XamMultiColumnComboEditor.Columns>
<ig:ImageComboColumn
Key="ImagePath" MaximumWidth="60" ImageWidth="50"/>
<ig:TextComboColumn Key="ContactName"/>
<ig:TextComboColumn Key="Company"/>
</ig:XamMultiColumnComboEditor.Columns>
</ig:XamMultiColumnComboEditor>
サポートされている列のタイプ:
CheckboxComboColumn - CheckBox コントロールを使ってブール値を表示するために使用されます
DateComboColumn - 日付を表示するために使用されます
TextComboColumn - 文字列の情報を表示するために使用されます
ImageComboColumn - 画像を表示するために使用されますキーをその画像に対する Uri を含むプロパティにバインド、またはプロパティを BitmapImage タイプにバインドすることによって、画像をロードすることができます。
xamMultiColumnComboEditor コントロールでは、非常に柔軟にドロップダウンをプログラムで制御することができます。
ユーザーが入力を開始すると、ドロップダウン全体を表示するために、ドロップダウンは常にコントロールが自動的に選択した方向に開きます。
コントロールの Footer プロパティを使用して、ドロップダウンの Footer 領域に現れる任意のコンテンツを指定することができます。FooterTemplate プロパティを使用して Footer コンテンツのレイアウトを制御することもできます。
複数の項目をユーザーがより簡単に選択できるようにするために、CheckBoxVisibility プロパティを Visible に設定することによって、各行にチェックボックスを表示することができます。AllowMultipleSelection プロパティを True に設定すると、ユーザーは CTRL キーを押す必要なく、(行をクリックする、またはチェックボックスにマークを付けることで) 一回の操作で複数の項目を選択することができます。
SelectedItemsResetButtonVisibility プロパティを Visible に設定すると、コントロールの編集領域にボタンが表示され、ユーザーはこれをクリックして現在の選択をクリアすることができます。
xamMultiColumnComboEditor コントロールは FilterMode プロパティを公開し、これによってユーザーがコントロールのテキスト領域に入力する際のドロップダウン リストのフィルター方法を制御することができます。FilterMode 列挙体には 2 つの値が含まれています。
FilterOnPrimaryColumnOnly - プライマリ列* が、コントロールの TextBox に入力されたテキストから始まる項目のみを含めることによって、ドロップダウン リストの項目をフィルターします
FilterOnAllColumns - 任意の テキスト列のコントロールの TextBox に入力されたテキストを含む項目のみを含めることによって、ドロップダウン リストの項目をフィルターします
* 「プライマリ列」は、コントロールの DisplayMemberPath プロパティを通して指定された列として定義されます。
注: FilterMode プロパティが FilterOnPrimaryColumnOnly に設定されている場合、コントロールはユーザーが入力したテキストの自動完了を自動的に実行します。
xamMultiColumnComboBox control コントロールでは、カスタム フィルタリングも利用できます。カスタム フィルタリングを使用するには、ItemsFilter クラスのインスタンスにルールを定義し、それをコントロールの CustomItemsFilter プロパティに設定する必要があります。
以下の例は、項目フィルターの設定方法を示しています。
Visual Basic の場合:
Dim filter As New ItemsFilter()
filter.ObjectTypedInfo =
New CachedTypedInfo() With { _
.CachedType = GetType(Person)
}
filter.Conditions.LogicalOperator = LogicalOperator.[Or]
filter.Conditions.Add(New ComparisonCondition() With { _
.[Operator] = ComparisonOperator.EndsWith, _
.FilterValue = "" _
})
XamMultiColumnComboEditor.CustomItemsFilter = filter
C# の場合:
ItemsFilter filter = new ItemsFilter();
filter.ObjectTypedInfo = new CachedTypedInfo()
{
CachedType = typeof(Person)
};
filter.Conditions.LogicalOperator = LogicalOperator.Or;
filter.Conditions.Add(new ComparisonCondition()
{
Operator = ComparisonOperator.EndsWith,
FilterValue = ""
});
xamMultiColumnComboEditor.CustomItemsFilter = filter;
CustomValueEnteredAction プロパティを構成することによって、ユーザーがコントロールのテキスト ボックスに入力する際のコントロールの動作を制御することができます。以下は、 CustomValueEnteredActions enumeration に含まれる 3 つの値です。
Ignore - ユーザーが無効なデータを入力するのを防ぎます - キーストロークはComboBox のフィルターとして見なされるため、新しい値を入力することができません
Allow - 項目の入力は許可しますが、項目は選択されず、基本の ItemsSource は触れられない状態のままになります
Add - 入力されたデータを基本の ItemsSource に追加し、新しい追加は選択に対して有効なデータとなります
AllowMultipleSelection プロパティを設定することによって、コントロールの選択モードを構成できます。True に設定すると、ユーザーは複数の項目を選択することができ、これらはデフォルトでコンマ区切りの文字列として表示されます。区切り文字を変更したい場合は、 MultiSelectValueDelimiterプロパティを希望の文字に設定します。そのため、ユーザーが複数の項目を選択すると、コントロールは選択された各項目のプライマリ列 (DisplayMemberPath) の値を表示します。選択された項目は、MultiSelectValueDelimiter 文字と共に選択文字列に加わります。
以下のスクリーンショットは、複数の項目が選択された xamMultiColumnComboEditor を示しています。MultiSelectValueDelimiter はセミコロンに設定されています。
AllowMultipleSelection を True に設定すると、CTRL キーを押しながら項目をクリックすることによって、ユーザーは新しい項目を選択に追加することができます。ポインティング デバイスのみを使った複数項目の選択を許可する場合は、CheckBoxVisibility プロパティを Visible に設定します。チェックボックスによって、ユーザーはキーボードを使用せずに複数の RowSelectionCheckbox 項目にチェックを付けることができます。
以下は、その他の役立つトピックです。