ドロップダウンリストセル

ReoGrid では、ドロップダウンリストセルを内蔵セル型として提供しています。内蔵セル型について詳しくは、「内蔵セル型」をご覧ください。ドロップダウンリスト以外に、ボタン、チェックボックス、ラジオボタンなどのセル型も提供しています。詳しくは、「様々な入力方法とセル型」をご覧ください。

さらに、カスタマイズしたドロップダウンリストを簡単に作成できます。詳しくは、「カスタマイズしたドロップダウンリスト」をご覧ください。

ドロップダウンリストセルを作成

ドロップダウンリストセルはセルボディ（CellBody）インターフェイスを利用して作成されたセル型で、ReoGrid に内蔵されています。セルボディを利用して様々なカスタマイズしたセル型を作成できます。

ドロップダウンリストをワークシートに追加するには、クラス DropDownListCell を利用します。インスタンスを作成する際に選択項目のリストも初期化できます。

// 現在表示中のワークシートを取得する
var sheet = reoGridControl.CurrentWorksheet;

// ドロップダウンリストセルのインスタンスを作成する
var dropdown = new DropdownListCell(
  "Apple", "Orange", "Banana", "Pear", 
  "Pumpkin", "Cherry", "Coconut"
);

// ワークシートのB2セルにドロップダウンリストを格納する
sheet["B2"] = dropdown;

結果：

196

選択項目リストを編集

ドロップダウンリストセルの Items プロパティにアクセスすると選択項目リストの編集ができます。

// 選択項目リストを追加する
dropdown.Items.AddRange("Apple", "Orange", "Banana", "Pear",
  "Pumpkin", "Cherry", "Coconut");

初期選択された項目を指定

ドロップダウンリストが格納されたセルに設定したデータがドロップダウンリストセルの初期選択された項目となります。

sheet["B2"] = "Apple";

結果：

197

選択された項目を取得

選択された項目は以下のいずれかの方法で取得できます。

  • ドロップダウンリストのイベント SelectedItemChanged を処理する
  • ワークシートのイベント CellDataChanged を処理する

ドロップダウンリストの項目が選択された場合、ドロップダウンリストのイベント SelectedItemChanged が発生します。

// イベントを処理
dropdown.SelectedItemChanged += (s, e) => { ... };

ドロップダウンリストの項目が選択された場合、選択されたデータが自動的にセルに設定されます。セルのデータが変更された場合、ワークシートのイベント CellDataChanged が発生します。

// ワークシートのイベントを処理
sheet.CellDataChanged += (s, e) => {
  // 変更元セルのアドレスを確認
  if (e.Cell.Position == new CellPosition("E5")) 
  {
    MessageBox.Show("Drop-down list item selected: " + e.Cell.Data);
  }
};

ドロップダウンリストセルのサイズを変更

以下のいずれかの方法でドロップダウンリストセルのサイズを変更できます。

  1. ヘッダーのサイズを調整し、その行または列のセルのサイズを変更する
    417
  2. 隣接した複数のセルを結合して一つの大きなセルを作成する
    418
  3. ドロップダウンリストセルを小さくしたい場合セルの Padding スタイルを設定する
    419

ヘッダーのサイズを調整する方法

// 列の幅を変更
sheet.ColumnHeaders["B"].Width = 120;
// 行の高さを変更
sheet.RowHeaders[1].Height = 40;

詳しくは、「ワークシート」をご覧ください。

セルを結合する方法

ワークシートのメソッドMergeRangeを利用すると指定された範囲のセルを結合できます。

sheet.MergeRange("B2:C2");

セルのPaddingスタイルを設定する方法

セルのインスタンスのStyleオブジェクトにPaddingスタイルプロパティを設定します。

// 例１：上下左右にすべて3ピクセル
sheet.Cells["B2"].Style.Padding = new PaddingValue(3);

// 例２：右側に 10 ピクセル
sheet.Cells["B2"].Style.Padding = new Padding(0, 0, 10, 0);

右側10ピクセルPaddingを設定した結果：

201

ドロップダウンボタンの位置とサイズを設定

ドロップダウンボタンの高さの自動調整

デフォルトでは、ドロップダウンリストがセルの高さに応じてボタンの高さを自動的に調整します。この自動調整を禁止するには、ドロップダウンリストセルの DropdownButtonAutoHeight プロパティに false を設定します。

ボタンの高さの自動調整オン：

199-2

ボタンの高さの自動調整オフ：

199

ボタンの高さの自動調整をオフにした場合、ボタンのサイズを自由に調整することができます。

ドロップダウンボタンのサイズを設定

ドロップダウンボタンのサイズを設定するには、DropDownButtonSize プロパティに Size 型の値を設定します。

dropdown.DropdownButtonAutoHeight = false;
dropdown.DropdownButtonSize = new System.Drawing.Size(40, 15);

結果：

202

ドロップダウンボタンの位置を設定

ドロップダウンボタンの表示位置は、縦方向にセルの上側、中央、下側に設定できます。位置の設定には、セルのテキスト配置と同じスタイル VAlign プロパティを設定します。

// セルインスタンスを取得
var cell = sheet.Cells["B2"];

// 文字配置を縦方向の下側に設定
cell.Style.VAlign = ReoGridVerAlign.Bottom;

結果：

422

ドロップダウンリストセルの罫線設定

ドロップダウンリスト自身は、外側の罫線を描画しません。代わりにセルの罫線を利用すれば、ドロップダウンリストに罫線を設定することができます。

// セルインスタンスを取得
var cell = sheet.Cells["B2"];

// セルの罫線を設定
cell.Border.Outside = RangeBorderStyle.GraySolid;

結果：

205

カスタマイズしたドロップダウンボタンを描画

クラスを DropDownCell または DropDownListCell から継承した場合、OnPaintDropdownButton メソッドをオーバーライドするとカスタマイズしたドロップダウンボタンを描画できます。

class MyDropdownListCell : DropdownListCell
{
  public MyDropdownListCell(params string[] items) : base(items) { }

  protected override void OnPaintDropdownButton(CellDrawingContext dc, Graphics.Rectangle buttonRect)
  {
    dc.Graphics.DrawAndFillRectangle(buttonRect, SolidColor.DeepSkyBlue, new SolidColor("#BEE7F1"));

    var centerPoint = new Graphics.Point(buttonRect.Left + buttonRect.Width / 2,
    buttonRect.Top + buttonRect.Height / 2);

    GraphicsToolkit.FillTriangle(dc.Graphics.PlatformGraphics, 9,
    centerPoint, GraphicsToolkit.TriangleDirection.Down,
    this.IsDropdown ? Pens.SkyBlue : Pens.DarkSlateBlue);
  }
}

結果：

423

カスタマイズしたドロップダウンリストを作成

内蔵したドロップダウンリストの代わりに、ドロップダウンパネルに自由に .NET の部品を設定することもできます。この機能を利用して様々なカスタマイズしたドロップダウンセルを作成できます。詳しくは、「カスタマイズしたドロップダウンリスト」をご覧ください。

166