ListViewコンポーネントの基本的な使い方の情報収集しつつ、作ったサンプルプログラムのメモ。不十分な箇所もあるかも。
目次
フォーム設計
フォームをこんな感じに配置。
![]() |
イメージリストにアイコン画像を登録します。ImageList1は32x32、ImageList2は16x16。サンプルで使用してるアイコンは下記にインストールされているもを使いました。
C:\Program Files\Common Files\Borland Shared\Images\GlyFX\Icons\BMP
![]() |
![]() |
以下、フォームのデザインデータ。
object Form2: TForm2
Left = 0
Top = 0
Caption = 'ListView'#12486#12473#12488
ClientHeight = 287
ClientWidth = 433
Color = clBtnFace
Font.Charset = DEFAULT_CHARSET
Font.Color = clWindowText
Font.Height = -11
Font.Name = 'Tahoma'
Font.Style = []
OldCreateOrder = False
PixelsPerInch = 96
TextHeight = 13
object ListView1: TListView
Left = 8
Top = 24
Width = 289
Height = 185
Columns = <
item
Caption = #21517#21069
Width = 100
end
item
Caption = #35443#32048
Width = 150
end>
DragMode = dmAutomatic
HideSelection = False
LargeImages = ImageList1
MultiSelect = True
SmallImages = ImageList2
TabOrder = 0
OnChange = ListView1Change
OnDragDrop = ListView1DragDrop
OnDragOver = ListView1DragOver
OnSelectItem = ListView1SelectItem
OnStartDrag = ListView1StartDrag
end
object RadioGroup1: TRadioGroup
Left = 312
Top = 24
Width = 106
Height = 113
Caption = 'ViewStyle'
Items.Strings = (
'vsIcon'
'vsList'
'vsReport'
'vsSmallIcon')
TabOrder = 1
OnClick = RadioGroup1Click
end
object RadioGroup2: TRadioGroup
Left = 312
Top = 143
Width = 106
Height = 66
Caption = 'CheckBoxes'
Items.Strings = (
'true'
'false')
TabOrder = 2
OnClick = RadioGroup2Click
end
object LabeledEdit1: TLabeledEdit
Left = 8
Top = 240
Width = 121
Height = 21
EditLabel.Width = 24
EditLabel.Height = 13
EditLabel.Caption = #21517#21069
TabOrder = 3
OnChange = LabeledEdit1Change
end
object LabeledEdit2: TLabeledEdit
Left = 135
Top = 240
Width = 153
Height = 21
EditLabel.Width = 24
EditLabel.Height = 13
EditLabel.Caption = #35443#32048
TabOrder = 4
OnChange = LabeledEdit1Change
end
object Button1: TButton
Left = 294
Top = 238
Width = 49
Height = 25
Caption = #36861#21152
Default = True
TabOrder = 5
OnClick = Button1Click
end
object Button2: TButton
Left = 367
Top = 238
Width = 51
Height = 25
Caption = #21066#38500
TabOrder = 6
OnClick = Button2Click
end
object ImageList1: TImageList
Height = 32
Width = 32
Left = 40
Top = 40
Bitmap = {
〜略〜
}
end
object ImageList2: TImageList
Left = 104
Top = 40
Bitmap = {
〜略〜
}
end
end
動作の仕様
- 名前と詳細の2つの情報を持ったアイテムを表示する。
- 名前と詳細を入力し追加ボタンを押すとアイテムが追加される。
- 削除ボタンを押すと選択されたアイテムが削除される。
- 表示スタイルをラジオボタンで設定する。
- チェックボックスの有無をラジオボタンで設定する。
- チェックを入れたらアイコンもチェック入りに変わる。
各動作の説明
表示スタイルの切替
//---------------------------------------------------------------------------
// ViewStyleの設定変更
void __fastcall TForm2::RadioGroup1Click(TObject *Sender)
{
switch(RadioGroup1->ItemIndex) {
case 1: // vsList
ListView1->ViewStyle = vsList;
break;
case 2: // vsReport
ListView1->ViewStyle = vsReport;
break;
case 3: // vsSmallIcon
ListView1->ViewStyle = vsSmallIcon;
break;
case 0: // vsIcon
default:
ListView1->ViewStyle = vsIcon;
RadioGroup1->ItemIndex = 0;
break;
}
}
//---------------------------------------------------------------------------
RadioGroup1のOnClickイベントに記述します。ラジオボタンの設定値によってListViewのViewStyleプロパティを設定。ラジオボタンがどれも設定されていない状態の場合は強制的にvsIconとしてます。
チェックボックスの表示
//---------------------------------------------------------------------------
// CheckBoxesの設定変更
void __fastcall TForm2::RadioGroup2Click(TObject *Sender)
{
switch(RadioGroup2->ItemIndex) {
case 0: // true
ListView1->Checkboxes = true;
break;
case 1: // false
default:
ListView1->Checkboxes = false;
RadioGroup2->ItemIndex = 1;
break;
}
}
//---------------------------------------------------------------------------
RadioGroup2のOnClickイベントに記述します。ラジオボタンの設定値によってListViewのCheckboxesプロパティを設定。どれも設定されていない場合はfalseとします。
追加ボタンのオンオフ
//---------------------------------------------------------------------------
// 追加ボタンのオンオフ
void __fastcall TForm2::LabeledEdit1Change(TObject *Sender)
{
Button1->Enabled = (LabeledEdit1->Text != "");
}
//---------------------------------------------------------------------------
LabeledEdit1およびLabeledEdit2のOnChangeイベントに記述します。名前欄に何か記述があれば追加ボタンを有効に。
アイテムの追加
//---------------------------------------------------------------------------
// 項目の追加
void __fastcall TForm2::Button1Click(TObject *Sender)
{
TListItem *item = ListView1->Items->Add();
item->Caption = LabeledEdit1->Text;
item->SubItems->Add(LabeledEdit2->Text);
item->Checked = false;
LabeledEdit1->Text = "";
LabeledEdit2->Text = "";
}
//---------------------------------------------------------------------------
Button1のOnClickイベントに記述します。新しくアイテムを追加。1つめの項目はCaptionに直接代入。2つ目以上の項目はSubItemsに追加します。
削除ボタンのオンオフ
//---------------------------------------------------------------------------
// 削除ボタンのオンオフ
void __fastcall TForm2::ListView1SelectItem(TObject *Sender, TListItem *Item,
bool Selected)
{
Button2->Enabled = (ListView1->SelCount > 0);
}
//---------------------------------------------------------------------------
ListView1のOnSelectItemイベントに記述します。アイテムが選択されていれば削除ボタンを有効に。
選択アイテムの削除
//---------------------------------------------------------------------------
// 選択アイテムの削除
void __fastcall TForm2::Button2Click(TObject *Sender)
{
TListItems *items = ListView1->Items;
for(int i=0; i<items->Count;) {
if (items->Item[i]->Selected) {
items->Delete(i);
} else {
i++;
}
}
}
//---------------------------------------------------------------------------
Button2のOnClickイベントに記述します。総当りでアイテムの選択状態をチェックして、選択されているなら削除します。
チェック状態をアイコンに反映
//---------------------------------------------------------------------------
// チェックの状態をアイコンに反映
void __fastcall TForm2::ListView1Change(TObject *Sender, TListItem *Item,
TItemChange Change)
{
Item->ImageIndex = (Item->Checked) ? 1 : 0;
}
//---------------------------------------------------------------------------
ListView1のOnChangeイベントに記述します。アイコンに変化があった場合にイベントが発生しますので、チェックの有無を見てアイコンを切り替えます。
ドラッグの開始
//---------------------------------------------------------------------------
// ドラッグ開始の処理
void __fastcall TForm2::ListView1StartDrag(TObject *Sender,
TDragObject *&DragObject)
{
ListView1->DragCursor = (ListView1->SelCount == 1) ? crDrag : crMultiDrag;
}
//---------------------------------------------------------------------------
一つ選択の場合と複数選択の場合でアイコンを切り替えてます。
ドラッグ中の処理
//---------------------------------------------------------------------------
// ドラッグ中の処理
void __fastcall TForm2::ListView1DragOver(TObject *Sender, TObject *Source,
int X, int Y, TDragState State, bool &Accept)
{
Accept = (Source == ListView1);
if (Y < 15) {
// 上へスクロール
SendMessage(ListView1->Handle, WM_VSCROLL, SB_LINEUP, 0);
} else if (ListView1->Height-Y < 15) {
// 下へスクロール
SendMessage(ListView1->Handle, WM_VSCROLL, SB_LINEDOWN, 0);
}
}
//---------------------------------------------------------------------------
ListView1のOnDragOverイベントに記述します。ListView1からのドラッグであれば許可とし、上端・下端の場合はスクロールメッセージを発行します。
ドロップ時の処理
//---------------------------------------------------------------------------
// ドロップ時の処理
void __fastcall TForm2::ListView1DragDrop(TObject *Sender, TObject *Source,
int X, int Y)
{
TListItems *items = ListView1->Items;
TListItem *toItem = ListView1->GetItemAt(X,Y);
TListItem *fromItem = NULL;
while(1) {
int i;
// 選択中のものを探す
for(i=0; i<items->Count; i++) {
if (items->Item[i]->Selected) break;
}
// 選択中のものが見つからないなら終わり
if (i == items->Count) break;
fromItem = items->Item[i];
// ドロップ先のアイテムの位置に新しくアイテムを生成
TListItem *x = items->AddItem(NULL, items->IndexOf(toItem));
// コピー元の選択状態を解除して新しいアイテムへコピー
fromItem->Selected = false;
x->Assign(fromItem);
// コピー元を削除
fromItem->Delete();
// これを選択中のアイテムが無くなるまで繰り返す
}
}
//---------------------------------------------------------------------------
ListView1のOnDragDropイベントに記述します。選択した(ドラッグ中の)アイテムをドロップ地点に挿入します。複数のアイテムを同時に移動しようとしてるのでちょっとややこしくなってます。
主なプロパティとメソッド
ListView
| プロパティ名 | 説明 |
|---|---|
| CheckBoxes | リスト項目の横にチェックボックスを表示するか |
| Colums | vsReport表示の時のヘッダーの設定 |
| GridLines | vsReport, vsList表示の時にグリッド線を表示するか |
| HideSelection | フォーカスが他へ移動したときに選択状態を隠すかどうか |
| HotTrack | マウスカーソルがアイテム上に来た時、それを表示するか |
| ItemIndex | 選択されたアイテムの番号を返す。0〜 |
| Items | TListItemsオブジェクト。アイテムの情報を保持。 |
| LargeImages | アイコン表示するときの画像データ保持 |
| MultiSelect | 複数選択を許可するか |
| SelCount | 選択されているアイテムの数 |
| Selected | 現在選択されているTListItemオブジェクト。 |
| SmallImages | スモールアイコン表示のときに使われる画像データを保持。 |
| ViewStyle | アイテムの表示方法を指定する。vsIcon, vsSmallIcon, vsList, vsReportから選択 |
| メソッド名 | 説明 |
|---|---|
| GetItemAt | 座標(X,Y)にあるアイテムのTListItemオブジェクトポインタを返す |
| GetNearestItem | 最も近いアイテムのTListItemオブジェクトポインタを返す。探索方向として、sdLeft(左), sdRight(右), sdAbove(上), sdBelow(下), sdAll(一番近い)から選択 |
| Scroll | リストビューを(DX,DY)だけスクロールさせる |
| StringWidth | 指定文字列の表示に必要な幅を返す。カラム幅の調整などに利用可 |
ListItems
| プロパティ名 | 説明 |
|---|---|
| Count | アイテム数 |
| Item[n] | n番目のアイテム(TListItemオブジェクト) |
| Owner | 親となるリストビューを指す |
| メソッド名 | 説明 |
|---|---|
| Add | 新しいアイテムを追加する |
| AddItem | 指定した位置にアイテムを追加する |
| Clear | アイテムを全て削除 |
| Delete | 指定のアイテムを削除 |
| Insert | 指定アイテムの次に新アイテムを追加する |
ListItem
| プロパティ名 | 説明 |
|---|---|
| Caption | アイテムの名前 |
| Checked | チェックされているかどうか。 |
| Cut | アイコンを淡色で表示するかどうか |
| Data | void*ポインタ。任意のデータを保持させることが可能 |
| Forcused | アイテムに入力フォーカスが指定されているかを示す。逆に設定も可能 |
| ImageIndex | イメージリストの中のどの画像を表示するか |
| Index | このアイテムが何番目の項目なのか |
| Selected | 選択されているか |
| SubItems | 詳細項目の保持。TStringオブジェクト |
| メソッド名 | 説明 |
|---|---|
| Assign | 別のアイテムからプロパティをコピーする |
| Delete | アイテムを削除する |
| MakeVisible | 指定アイテムが見える位置に来るように強制スクロールする |
サンプルソース
- 今回作成したプログラムのソース。


