GrapeCity.devlog

グレープシティ株式会社のDeveloper Tools〈開発支援ツール〉の最新情報をお届けします。製品のTIPSや発売情報、イベントのお知らせなどをいち早く発信中です。

SPREAD for Windows Forms/ASP.NET 10.0Jの新機能紹介(その3)

こんにちは!SPREADチームでWindows Formsを担当している大林です。 今日はWindows Formsに追加されたGcComboBox型セルをご紹介したいと思います。

コンボボックスに画像を表示したい、というご要望をいただくことがあります。 これまでも、マルチカラムコンボボックス型セルを工夫して、コンボボックスのリストに画像を表示することはできました。しかし、リストから選んだ画像をセルに表示することができませんでした。 GcComboBox型セルでは、可能です。

以下、GcComboBox型セルを使用した例です。リストで選択された画像がセルにも表示されていますね。

kozu_20170322_1

スプレッドシートは画面の情報量が多くなりがちですが、色やアイコンなど視覚的な要素を取り入れることで、画面がぐっと見やすくなります。条件付き書式やスパークラインなど、これまでもSPREADの視覚的な機能はお客様に好評で、ひと目で内容が把握できる画面作りへの関心の高さが伺えます。

認知度の高いアイコンであれば、セルの表示は画像だけで十分かもしれません。

kozu_20170322_2

以下、セルに画像とテキストを表示するGcComboBox型セルのサンプルコードです。

なお、以降でご紹介するコードは、ファイル冒頭に以下のImports句(C#ではusing句)を追加してご利用ください。

[code lang="vb"] ' VBの場合 Imports GrapeCity.Win.Spread.InputMan.CellType [/code]

[code lang="c-sharp"] // C#の場合 using GrapeCity.Win.Spread.InputMan.CellType; [/code]

Visual Basic

[code lang="vb"] Dim gcCombo1 As New GcComboBoxCellType() 'カラムヘッダを非表示 gcCombo1.ListHeaderPane.Visible = False 'グリッド線を非表示 gcCombo1.ListGridLines.VerticalLines = New Line() With {.Style = LineStyle.None} gcCombo1.ListGridLines.HorizontalLines = New Line() With {.Style = LineStyle.None} '選択時のスタイルを設定 gcCombo1.ListSelectedItemStyle.BackColor = Color.LightSkyBlue gcCombo1.ListSelectedItemStyle.ForeColor = Color.Black 'ドロップダウンのリサイズを無効に設定 gcCombo1.DropDown.AllowResize = False gcCombo1.DropDown.Height = 170 gcCombo1.DropDown.AutoWidth = True

'カラムを追加 gcCombo1.ListColumns.Add(New ListColumnInfo() With {.AutoWidth = False, .Width = 130})

'リストアイテムを追加 Dim item11 As New ListItemInfo() With {.AutoItemHeight = False, .Height = 40} item11.Image = Image.FromFile("c:\Images\include.png") item11.SubItems.Add("加算する") gcCombo1.Items.Add(item11)

Dim item12 As New ListItemInfo() With {.AutoItemHeight = False, .Height = 40} item12.Image = Image.FromFile("c:\Images\exclude.png") item12.SubItems.Add("除外する") gcCombo1.Items.Add(item12)

Dim item13 As New ListItemInfo() With {.AutoItemHeight = False, .Height = 40} item13.Image = Image.FromFile("c:\Images\tax.png") item13.SubItems.Add("税率") gcCombo1.Items.Add(item13)

Dim item14 As New ListItemInfo() With {.AutoItemHeight = False, .Height = 40} item14.Image = Image.FromFile("c:\Images\comment.png") item14.SubItems.Add("コメント") gcCombo1.Items.Add(item14)

'イメージの配置を設定 gcCombo1.ImageWidth = 40 gcCombo1.ImageAlign = HorizontalAlignment.Center 'リストのイメージ表示を有効に設定 gcCombo1.ShowListBoxImage = True 'セルのテキストおよびイメージ表示を有効に設定 gcCombo1.TextBoxStyle = TextBoxStyle.Both 'セルの非編集時のイメージ表示を有効に設定 gcCombo1.PaintByControl = True

'GcComboBox型セルをセルに設定 FpSpread1.Sheets(0).Cells(1, 1, 4, 1).CellType = gcCombo1 [/code]

C#

[code lang="c-sharp"] GcComboBoxCellType gcCombo1 = new GcComboBoxCellType(); //カラムヘッダを非表示 gcCombo1.ListHeaderPane.Visible = false; //グリッド線を非表示 gcCombo1.ListGridLines.VerticalLines = new Line() { Style = LineStyle.None }; gcCombo1.ListGridLines.HorizontalLines = new Line() { Style = LineStyle.None }; //選択時のスタイルを設定 gcCombo1.ListSelectedItemStyle.BackColor = Color.LightSkyBlue; gcCombo1.ListSelectedItemStyle.ForeColor = Color.Black; //ドロップダウンのリサイズを無効に設定 gcCombo1.DropDown.AllowResize = false; gcCombo1.DropDown.Height = 170; gcCombo1.DropDown.AutoWidth = true;

//カラムを追加 gcCombo1.ListColumns.Add(new ListColumnInfo() { AutoWidth = false, Width = 130 });

//リストアイテムを追加 ListItemInfo item11 = new ListItemInfo() { AutoItemHeight = false, Height = 40 }; item11.Image = Image.FromFile(@"c:\Images\include.png"); item11.SubItems.Add("加算する"); gcCombo1.Items.Add(item11);

ListItemInfo item12 = new ListItemInfo() { AutoItemHeight = false, Height = 40 }; item12.Image = Image.FromFile(@"c:\Images\exclude.png"); item12.SubItems.Add("除外する"); gcCombo1.Items.Add(item12);

ListItemInfo item13 = new ListItemInfo() { AutoItemHeight = false, Height = 40 }; item13.Image = Image.FromFile(@"c:\Images\tax.png"); item13.SubItems.Add("税率"); gcCombo1.Items.Add(item13);

ListItemInfo item14 = new ListItemInfo() { AutoItemHeight = false, Height = 40 }; item14.Image = Image.FromFile(@"c:\Images\comment.png"); item14.SubItems.Add("コメント"); gcCombo1.Items.Add(item14);

//イメージの配置を設定 gcCombo1.ImageWidth = 40; gcCombo1.ImageAlign = HorizontalAlignment.Center; //リストのイメージ表示を有効に設定 gcCombo1.ShowListBoxImage = true; //セルのテキストおよびイメージ表示を有効に設定 gcCombo1.TextBoxStyle = TextBoxStyle.Both; //セルの非編集時のイメージ表示を有効に設定 gcCombo1.PaintByControl = true;

//GcComboBox型セルをセルに設定 fpSpread1.Sheets[0].Cells[1, 1, 4, 1].CellType = gcCombo1; [/code]

セルに画像のみを表示するには、上のサンプルコードの設定を一か所変更するだけです。

Visual Basic

[code lang="vb"] '以下をコメントアウト 'gcCombo1.TextBoxStyle = TextBoxStyle.Both 'セルにイメージのみ表示 gcCombo1.TextBoxStyle = TextBoxStyle.ImageOnly [/code]

C#

[code lang="c-sharp"] //以下をコメントアウト //gcCombo1.TextBoxStyle = TextBoxStyle.Both; //セルにイメージのみ表示 gcCombo1.TextBoxStyle = TextBoxStyle.ImageOnly; [/code]

GcComboBox型セルには、動作や外観に関する多くの機能が装備されています。詳しくは製品ヘルプをご覧の上、ぜひご活用ください!

Copyright © GrapeCity, Inc. All Rights Reserved.