C# 如何在没有数据的情况下创建每行都有边框的背景?
请看上面的图片 我希望我的xaml页面背景是这样的。每一行都应该有边框。我已经使用itemControl实现了目标,并转储了一个虚拟列表。虽然我得到了我想要的,但它看起来是多余的,所以我试着看看是否有更好的方法。请不要建议我创建一个看起来像这样的图像并将其用作背景 以下是我所做的:C# 如何在没有数据的情况下创建每行都有边框的背景?,c#,wpf,xaml,border,C#,Wpf,Xaml,Border,请看上面的图片 我希望我的xaml页面背景是这样的。每一行都应该有边框。我已经使用itemControl实现了目标,并转储了一个虚拟列表。虽然我得到了我想要的,但它看起来是多余的,所以我试着看看是否有更好的方法。请不要建议我创建一个看起来像这样的图像并将其用作背景 以下是我所做的: <ItemControl DataContext="{Binding [someViewmodel]}" BorderThickness="0,0,1,0" BorderBrush="#E6E6E6"
<ItemControl DataContext="{Binding [someViewmodel]}" BorderThickness="0,0,1,0" BorderBrush="#E6E6E6"
ItemSource="{Binding DummyList}">
<ItemsControl.ItemTempalte>
<DataTemplate>
<Border BorderThickness="1" BorderBrush="#E6E6E6" Background="White">
<StackPanel Height="50">
</StackPanel>
</Border>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemControl>
在我的viewmodel中:
for(int i=0;i<10;i++)
{
Object haha = new Object();
this.DummyList.add(haha);
}
for(int i=0;i再次编辑:
如果只是背景,您可以根据屏幕高度添加线条,并为代码隐藏中的每个x像素添加线条。如果您想要线条上的内容,请像您一样使用您选择的datatemplate of items控件。当然,您可以为此创建自己的控件,这样就不会损坏页面的代码隐藏:)
如果你能接受使用一幅图像,那么就使用矢量图像,这样线条清晰,背景透明。将图像裁剪到屏幕大小,裁剪溢出,或者将图像放置在ViewBox中,让其拉伸到屏幕大小。有很多选择,这取决于你需要什么
编辑:
另一种方法是手动绘制线(如果使用网格)。将此抽象到您自己的控制中
<Grid>
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
<Line Grid.Row="1" X1="0" Y1="0" X2="1" Y2="0" Stroke="DarkSlateBlue" StrokeThickness="3" Stretch="Uniform" VerticalAlignment="Top"/>
<Line Grid.Row="2" X1="0" Y1="0" X2="1" Y2="0" Stroke="DarkSlateBlue" StrokeThickness="3" Stretch="Uniform" VerticalAlignment="Top"/>
<Line Grid.Row="3" X1="0" Y1="0" X2="1" Y2="0" Stroke="DarkSlateBlue" StrokeThickness="3" Stretch="Uniform" VerticalAlignment="Top"/>
</Grid>
我假设你想使用网格,因为你说了行?下面是如何使用网格,简单地将ShowGridLines设置为true。(请注意虚线)
代码
图片:
您所需要做的就是不要绘制边框的所有四边。您可以通过调整控制面板来实现这一点。请尝试以下方法:
<ItemControl DataContext="{Binding [someViewmodel]}" BorderThickness="0,0,1,0"
BorderBrush="#E6E6E6"
ItemSource="{Binding DummyList}">
<ItemsControl.ItemTempalte>
<DataTemplate>
<Border BorderThickness="0,0,0,1" BorderBrush="#E6E6E6" Background="White">
<StackPanel Height="50">
</StackPanel>
</Border>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemControl>
如果希望行进一步扩展,只需向数据绑定集合添加一些空项即可
如果我误解了你的问题(很可能是因为你的问题不清楚),那么请让我详细了解。。。它看起来是多余的,所以我想看看是否有更好的方法来解决这个问题,它不是很具有描述性,也不会帮助任何人理解您的问题。来自文档:“启用网格线将在网格内的所有元素周围创建虚线。只有虚线可用,因为此属性旨在作为调试布局问题的设计工具,而不是用于生产质量代码。如果希望线位于栅格内,请设置栅格内图元的样式,使其具有边框。“很高兴知道有这样的属性,但似乎它并不真正适合添加seond选项。这只有在您确切知道要硬编码多少行时才有效。我的应用程序可能必须在不同的屏幕分辨率上运行,因此我将此摘要写到您自己的控件中。
<ItemControl DataContext="{Binding [someViewmodel]}" BorderThickness="0,0,1,0"
BorderBrush="#E6E6E6"
ItemSource="{Binding DummyList}">
<ItemsControl.ItemTempalte>
<DataTemplate>
<Border BorderThickness="0,0,0,1" BorderBrush="#E6E6E6" Background="White">
<StackPanel Height="50">
</StackPanel>
</Border>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemControl>