我正在制作WPF新闻应用程序。我有一个新闻源列表视图,并且它具有自己的项目模板。此模板为300px; 400px网格。 ListView的宽度为610px。现在,如何使该列表的“视图2”列化?I want like this[picture]
答案 0 :(得分:0)
每当需要在WPF中绘制项目列表时,都应从ItemsControl开始并通过数据绑定附加元素,此后,只需将Item和Panel模板设置为完成工作所需的任何东西即可。您还应该始终选择最轻量的布局面板。对于这种特殊情况,网格太重了,UniformGrid可以很好地完成工作:
<Border BorderBrush="Black" BorderThickness="5">
<StackPanel Orientation="Vertical">
<TextBlock Text="NEWS FEED" FontSize="40" Foreground="Black" Background="Orange" HorizontalAlignment="Stretch" VerticalAlignment="Top" TextAlignment="Center" />
<Rectangle Stroke="Black" StrokeThickness="5" HorizontalAlignment="Stretch" VerticalAlignment="Top"/>
<Border Background="Yellow" Padding="0,2.5,5,2.5">
<ItemsControl ItemsSource="{Binding Items}">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<UniformGrid Columns="2" />
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
<ItemContainerTemplate>
<Border Height="300" BorderBrush="Black" BorderThickness="2.5" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Margin="5,2.5,0,2.5" >
<Grid HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Background="White">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="1*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="3*" />
</Grid.ColumnDefinitions>
<Rectangle Width="40" Height="40" Stroke="Black" StrokeThickness="1" Margin="5"/>
<Path Grid.Row="1" Stroke="Black" StrokeThickness="1" Data="M 0,40 20,0 40,40 Z" HorizontalAlignment="Center" Margin="5,5,5,2.5" />
<Path Grid.Row="2" Stroke="Black" StrokeThickness="1" Data="M 0,0 20,40 40,0 Z" HorizontalAlignment="Center" Margin="5,2.5,5,5" />
<Rectangle Grid.RowSpan="4" Grid.Column="1" Stroke="Black" StrokeThickness="1" Margin="5"/>
</Grid>
</Border>
</ItemContainerTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</Border>
</StackPanel>
</Border>
正确设置“项目”绑定,您将获得以下信息: