瀑布流视图适用于每个列表项高度不同，却又要紧凑排列在一起的情况，

如淘宝、花瓣,如下图所示:

 

 

 

ListView.Properties.ViewType除了lvtIcon图标视图，lvtList列表视图，

还有lvtWaterfall瀑布流视图，

 

ListView在lvtIcon图标视图下，每个Item都是一个个水平排列的，

如果排列列表项时遇到宽度放不下了，那就会换一行，

并且换行时，Top取的是上一行最高的那个列表项的Bottom,

如下图所示:

 

ListView在lvtList列表模式下，ListView就是一个ListBox,

一行一个每个列表项，如下图所示:

而ListView在lvtWaterfall瀑布流模式下，

每个列表项排列的时候，都需要判断上方是否有空的地方可以插入，

如下图所示:

因此，只需要将ListView.Properties.ViewType设置为lvtWaterfall,

就可以实现瀑布流效果。

 

下面以朋友圈的瀑布流为示例，

先放一个ListView,

设置ListView.Properties.ViewType为vtWaterfall

ListView.Properties.ItemHeight设置为200,

ListView.Properties.ItemWidth设置为140,

ListView.Properties.ItemSpace设置为10,

ListView.Properties.ColCount设置为2,表示每行显示2个列表项，

双击ListView,添加好三个Item,

需要的数据如下图所示:

把大图放在Item.Icon,

头像放在Item.Pic,

标题(如大家辛苦了)放在Item.Caption,

用户名(如DelphiTeacher)放在Item.Detail,

图片分类(如郊游.风景)放在Item.Detail1，

每个列表项的高度需要设置成不一样，

比如第一个列表项的高度为200,

第二个列表项的高度为150,

第三个列表项的高度为180,

如下图所示:

 

 

再在上面放一个ItemDesignerPanel,

设置给ListView.Properties.ItemDesignerPanel,

在ItemDesignerPanel上放好Image,Panel和Label,

并做好绑定，如下图所示:

最后，效果如下图所示: