10.2.OrangeUI控件使用说明(列表框控件ListBox)(示例2 使用列表项设计面板)

ItemDesignerPanel是设计列表项显示内容的控件,

先拖一个ListBox到窗体上,

再拖一个ItemDesignerPanel到ListBox上,

把ListBox.Properties.ItemDesignPanel属性设置为ItemDesignPanel,

表示使用ItemDesignPanel来绘制列表项的内容,

双击ListBox,在项目编辑器中添加三个列表项,

标题和图标分别为:

“Movies”,

“Music”,

“Documents”, ,

添加完之后,

ListBox会调整ItemDesignerPanel的高度为列表项的高度,

列表项的高度在属性ListBox.Properties.ItemHeight中设置,

如下图所示:

拖一个Label到ItemDesignPanel上去,

将它的Caption设置为”FolderName”,

 

HitTest设置为False,

 

这时会发现我们添加的三个列表项都显示相同的标题”FolderName”,

我们需要让每个列表项都显示自己的标题,

需要将ItemDesignerPanel的ItemCaptionBindingControl设置为这个Label,

表示将这个Label用于显示列表项的Caption,

效果如图所示:

然后再拖一个Image控件上去,

尺寸设置为40*40,

HitTest设置为False,

并让这个Image来显示列表项的图标,

需要将ItemDesignerPanel的ItemIconBindingControl设置为这个Image,

效果如图所示:

因为这个图标的尺寸是60*60,

比刚才拖上去Image控件尺寸(40*40)要大,

所以要把SelfOwnMaterial.DrawPictrueParam.IsStretch设置为True,

再把ListBox的背景色设置成白色,

步骤如下:

SelfOwnMaterial.IsTransparent设置为False,

SelfOwnMaterial.BackColor.IsFill设置为True,

SelfOwnMaterial.BackColor.FillColor设置为白色,

给每个列表项之间添加分隔线,

把SelfOwnMaterial.DrawItemDevideParam.IsFill设置为True就可以了,

再设置鼠标点击列表项的效果,

将ItemDesignerPanel.SelfOwnMaterial.IsTransparent设置为False,

展开ItemDesignerPanel.SelfOwnMaterial.BackColor.MouseDownEffect,

EffectTypes设置为drpetFillColorChange和drpetIsFillChange,

FillColor设置为LightGray,

IsFill设置为True,

表示在鼠标点击时改变列表项的背景颜色:

再设置列表项选中的效果,

将ItemDesignerPanel.SelfOwnMaterial.IsTransparent设置为False,

展开ItemDesignerPanel.SelfOwnMaterial.BackColor.PushedEffect,

EffectTypes设置为drpetFillColorChange和drpetIsFillChange,

FillColor设置为LightGray,

IsFill设置为True,

表示在鼠标选中时改变列表项的背景颜色。

 

发表评论