ListBox通常是垂直排列显示列表项的，

当然，水平排列显示也是可以的，

接下来就给大家演示一下列表项水平排列显示的ListBox,

目标效果如下图所示:

先拖一个ListBox到窗体上，

双击ListBox，添加7个列表项,

设置列表项的Caption为“周一”至“周日”,

设置列表项的Detail为对应的日期,

把第一个列表项的Selected设置True,

表示该列表项为选中状态,

添加完是这个样子的:

因为ListBox默认是垂直排列显示列表项的，

所以要把ListBox拉高一点，才能看到其他列表项:

要让ListBoxItem水平排列显示列表项，

需要设置ListBox.Properties.ItemLayoutType为iltHorizontal，

再设置ListBox.Properties.ItemWidth为60,

设置ListBox.Properties.ItemHeight为50,

还需要排列一下Caption和Detail的绘制位置，

让Detail显示在Caption下面，并且两者都水平居中，

Caption的字体偏大，颜色为黑色，

Detail的字体偏小，颜色为灰色#FF878787，

当选中的时候Caption和Detail的字体颜色均为#FF46D2DC

在SelfOwnMaterial.DrawItemCaptionParam中设置列表顶标题的字体，

在SelfOwnMaterial.DrawItemDetailParam中设置列表项Detil的字体，

先设置Caption的显示:

再设置当列表项选中时Caption的字体颜色：

再接下来设置Detail的显示:

再设置当列表项选中时Detail字体颜色:

现在效果如下:

还需要添加一个效果，

就是列表项选中的时候宽度变宽，并且底下有一条青色的线，

如下图:

先设置列表项选中的宽度,

将ListBox的ItemWidthCalcType为isctSeparate,

将ListBox的SelectedItemWidth为120,

再设置DrawItemBackColorParam.FillColor为#FF46D2DC,

PushedEffect.EffectTypes把drpetIsFillChange打勾，

PushedEffect.IsFill设置为True,

先看一下效果，

发现背景色充满整个了列表项,都看不见Caption和Detail了:

因为这个DrawItemBackColorParam是设置列表项的背景颜色的，

要把它变细一点，

在DrawItemBackColorParam.DrawRectSetting中设置，

高度设置为5个像素，位置在底部，

把”周五”选中看看效果:

默认ListBox是垂直排列显示列表项的，可以上下拖动的，

水平排列显示ListBox需要可以左右拖动，

需要设置垂直滚动条类型为sbstNone，表示没有垂直滚动条，因此不允许上下拖动，

 

 

 

 

 

 

 

 

 

 

 

 

 

[o1]改成:需要设置垂直滚动条类型为sbstNone，表示没有垂直滚动条，因此不允许上下拖动，

设置水平滚动条类型为sbstHide，表示隐藏水平滚动条，但允许左右拖动