一、场景
对于自定义集合类控件样式时,经常会遇到的一个问题就是,定义好子项样式后,添加到集合控件中时,发现和实际设计的样式存在细节偏差,子项并没有能够按照预期方式实现全填充,存在着部分的线条或者空白间隙。
原始xaml
<ListView SelectedIndex="0"> <ListViewItem local:ControlExtensions.Data="{StaticResource bingren}" Content="病人管理"/> <ListViewItem local:ControlExtensions.Data="{StaticResource chuangwei}" Content="床位管理"/> <ListViewItem local:ControlExtensions.Data="{StaticResource yihu}" Content="医护管理"/> <ListViewItem local:ControlExtensions.Data="{StaticResource baobiao}" Content="报表管理"/> <ListViewItem local:ControlExtensions.Data="{StaticResource shebei}" Content="设备管理"/> <ListViewItem local:ControlExtensions.Data="{StaticResource xitong}" Content="系统设置"/> <!--<ListView.Template> <ControlTemplate> <ItemsPresenter></ItemsPresenter> </ControlTemplate> </ListView.Template>--> </ListView
运行效果:
去除Border
,设置BorderThickness
宽度为0
<ListView SelectedIndex="0" BorderThickness="0"> ...... </ListView>
运行效果:
二、解决方案
实际通过比较可以发现,子项的右端存在着一个间距大约一个像素的间隙,内部子项并不是全填充,然后就遇到现在的问题,如何让子项全填充?一下为笔者找到的最佳方案-----重写ListView对应的Template
,剔除控件自身的默认布局,以下为具体方案:
重写ListBox
或ListView
对应的Template
:
<ListView> <ListViewItem IsSelected="True" local:ControlExtensions.Data="{StaticResource xitong}" Content="系统设置"/> <ListView.Template> <ControlTemplate> <ItemsPresenter></ItemsPresenter> </ControlTemplate> </ListView.Template> </ListView>
运行效果: