FlexGridで改良できるグリッドビューのセル編集方式 ― WPF編

 ComponentOne Studioに収録されているグリッドコントロール「FlexGrid for WinForms」の内部エディタを改良する方法を
「FlexGridで改良できるグリッドビューのセル編集方式 ― Windows フォーム編」
で紹介しました。

同様にWPF用のグリッドコントロール「FlexGrid for WPF」でも内部エディタを改良することができます。

「FlexGrid for WPF」で役に立つのがC1FlexGridのPrepareCellForEditイベントです。このイベントは内部エディタが作成され、アクティブになる前に発生し、イベント内でエディタオブジェクトにアクセス可能なので、そのプロパティを設定することでエディタの動作をカスタマイズできます。

また、BeginningEditイベントは、編集モードに入る前に発生し、編集前にC1FlexGridの設定を変更することができます。

 

（ケース１）編集開始時に、自動的にドロップダウンを開く

コンボボックス型のセルにフォーカスが移動した場合、デフォルトでは、コンボボックスの▼をクリックしないとドロップダウンは開きません。

この動作を、フォーカスが移動してきた時点でドロップダウンが開くように変更するには、以下の手順で処理します。

 

1. セルにフォーカスが移動した時点で発生するSelectionChangedイベントでStartEditingメソッドを実行する
2. セルの編集が開始する前に発生するPrepareCellForEditイベントで、コンボボックス（C1FlexComboBox）のLoadedイベントをハンドルする
3. 内部エディタであるコンボボックスのLoadedイベントでC1FlexComboBoxのIsDroppedDownプロパティをtrueに設定する

以下の例ではインデックスが1の列に対して、上記の処理を記述しています。

[C#]

private void c1FlexGrid1_SelectionChanged(object sender, CellRangeEventArgs e)
{
　　if (e.Column == 1) {
　　　　c1FlexGrid1.StartEditing(false, c1FlexGrid1.Selection.Row, c1FlexGrid1.Selection.Column);
　　}
}
private void c1FlexGrid1_PrepareCellForEdit(object sender, CellEditEventArgs e)
{
　　if (e.Column == 1 && e.Editor != null) {
　　　　if ((e.Editor as Border).Child.GetType() == typeof(C1FlexComboBox))
　　　　{
　　　　　　C1FlexComboBox c1ComboBox = (e.Editor as Border).Child as C1FlexComboBox;
　　　　　　c1ComboBox.Loaded += c1ComboBox_Loaded;
　　　　}
　　}
}
private void c1ComboBox_Loaded(object sender, RoutedEventArgs e) {
　　((C1FlexComboBox)sender).IsDroppedDown = true;
}

[VB]

Private Sub C1FlexGrid1_SelectionChanged(sender As Object, e As CellRangeEventArgs)
　　If e.Column = 1 Then
　　　　C1FlexGrid1.StartEditing(False, C1FlexGrid1.Selection.Row, C1FlexGrid1.Selection.Column)
　　End If
End Sub
Private Sub C1FlexGrid1_PrepareCellForEdit(sender As Object, e As CellEditEventArgs)
　　If e.Column = 1 And Not IsNothing(e.Editor) Then
　　　　Dim C1ComboBox As C1FlexComboBox = CType((CType(e.Editor, Border)).Child, C1FlexComboBox)
　　　　AddHandler C1ComboBox.Loaded, AddressOf C1ComboBox_Loaded
　　End If
End Sub
Private Sub C1ComboBox_Loaded(sender As Object, e As RoutedEventArgs)
　　CType(sender, C1FlexComboBox).IsDroppedDown = True
End Sub

 

（ケース２）列によってIMEを切り替える

C1FlexGridでは、InputMethodクラスを使用してグリッド全体のIMEモードを設定することができます。
列ごとにひらがな入力や英数字入力などIMEモードを指定するには、BeginningEditイベント内で、列を指定してIMEモードの切り替えを行います。

[C#]

private void c1FlexGrid1_BeginningEdit(object sender, CellEditEventArgs e)
{
// 条件に基づいて、TextBoxの IME 変換モードを切り替えます。
switch (e.Column)
{
case 1: // 1列目はひらがな
InputMethod.Current.ImeState = InputMethodState.On;
InputMethod.Current.ImeConversionMode = ImeConversionModeValues.Native | ImeConversionModeValues.FullShape;
break;
case 2: // 2列目は全角カタカナ
InputMethod.Current.ImeState = InputMethodState.On;
InputMethod.Current.ImeConversionMode = ImeConversionModeValues.Katakana | ImeConversionModeValues.FullShape;
break;
case 3: // 3列目は半角カタカナ
InputMethod.Current.ImeState = InputMethodState.On;
InputMethod.Current.ImeConversionMode = ImeConversionModeValues.Katakana | ImeConversionModeValues.Native;
break;
        default: // 上記以外はIMEオフ
InputMethod.Current.ImeState = InputMethodState.Off;
break;
}
}

[VB]

Private Sub C1FlexGrid1_BeginningEdit(sender As Object, e As CellEditEventArgs)
　　Select Case e.Column
　　　　Case 1
　　　　　　' 1列目はひらがな
　　　　　　InputMethod.Current.ImeState = InputMethodState.[On]
　　　　　　InputMethod.Current.ImeConversionMode = ImeConversionModeValues.Native Or ImeConversionModeValues.FullShape
　　　　　　Exit Select
　　　　Case 2
　　　　　　' 2列目は全角カタカナ
　　　　　　InputMethod.Current.ImeState = InputMethodState.[On]
　　　　　　InputMethod.Current.ImeConversionMode = ImeConversionModeValues.Katakana Or ImeConversionModeValues.FullShape
　　　　　　Exit Select
　　　　Case 3
　　　　　　' 3列目は半角カタカナ
　　　　　　InputMethod.Current.ImeState = InputMethodState.[On]
　　　　　　InputMethod.Current.ImeConversionMode = ImeConversionModeValues.Katakana Or ImeConversionModeValues.Native
　　　　　　Exit Select
　　　　Case Else
　　　　　　' 上記以外はIMEオフ
　　　　　　InputMethod.Current.ImeState = InputMethodState.Off
　　　　　　Exit Select
　　End Select
End Sub

 ※このコードを用いると、編集を開始した時点でIMEモードが切り替わります。

 

（ケース３）数値型セルで、右寄せで編集する

数値型セルでは設定された値が右寄せで表示されますが、編集時にはデフォルトで左寄せになります。表示時も編集中も右寄せにするには、PrepareCellForEditイベントで内部エディタであるC1FlexComboBoxを取得し、そのTextAlignmentプロパティをTextAlignment.Rightに設定します。

[C#]

private void c1FlexGrid1_PrepareCellForEdit(object sender, CellEditEventArgs e)
{
　　if (e.Column == 1 && e.Editor != null) {
　　　　if ((e.Editor as Border).Child.GetType() == typeof(C1FlexComboBox))
　　　　{
　　　　　　C1FlexComboBox c1ComboBox = (e.Editor as Border).Child as C1FlexComboBox;
　　　　　　c1ComboBox.TextAlignment = TextAlignment.Right;
　　　　}
　　}
}

[VB]

Private Sub C1FlexGrid1_PrepareCellForEdit(sender As Object, e As CellEditEventArgs)
　　If e.Column = 1 And Not IsNothing(e.Editor) Then
　　　　Dim C1ComboBox As C1FlexComboBox = CType((CType(e.Editor, Border)).Child, C1FlexComboBox)
　　　　c1ComboBox1.TextAlignment = TextAlignment.Right
　　End If
End Sub

 

 

 ここでご紹介したケース以外にも、

• Enterキーで編集を開始する
• 矢印キーで編集を終了させない

など、数多くの実装例が製品ヘルプに記載されていますので、ご参照ください。

◇FlexGrid for WPF 製品ヘルプ

 

XAML技術（WPF、UWP、Xamarin）のイベント開催

WPF、UWP、Xamarinと、XAMLを利用する各アプリ開発技術のエキスパートをお迎えし、開発事例を中心としたセッション主体のイベントを行います。 

 

 

※この記事の投稿時点で、大変ありがたいことに既に満席（100名）となっています。申し訳ありませんが、参加ご希望の方はキャンセル待ちへのご登録をお願いいたします。