如果这是一个明显的问题,请向你道歉;我是WPF的新手。我正在尝试创建一个类似于下图的“分组”列表框。有了google的帮助,我只是设法让它工作,除了某些原因我得到垂直滚动条可见。有没有任何想法?这让我疯了!感谢
我使用的代码如下:
public class SampleData
{
public string Name { get; set; }
public string Group { get; set; }
public SampleData(string name, string group)
{
this.Name = name;
this.Group = group;
}
}
public partial class MainWindow : Window
{
private ObservableCollection<SampleData> _items = new ObservableCollection<SampleData>();
public ObservableCollection<SampleData> Items
{
get { return _items; }
}
public MainWindow()
{
InitializeComponent();
_items.Add(new SampleData("Item1", "Group1"));
_items.Add(new SampleData("Item2", "Group1"));
_items.Add(new SampleData("Item3", "Group1"));
_items.Add(new SampleData("Item4", "Group1"));
_items.Add(new SampleData("Item5", "Group1"));
_items.Add(new SampleData("Item6", "Group1"));
_items.Add(new SampleData("Item7", "Group2"));
_items.Add(new SampleData("Item8", "Group2"));
_items.Add(new SampleData("Item9", "Group2"));
_items.Add(new SampleData("Item10", "Group2"));
_items.Add(new SampleData("Item11", "Group2"));
_items.Add(new SampleData("Item12", "Group2"));
_items.Add(new SampleData("Item13", "Group2"));
_items.Add(new SampleData("Item14", "Group2"));
}
}
并在xaml中,
<CollectionViewSource x:Key="groupedSampleData" Source="{Binding ElementName=main, Path=Items }">
<CollectionViewSource.GroupDescriptions>
<PropertyGroupDescription PropertyName="Group" />
</CollectionViewSource.GroupDescriptions>
</CollectionViewSource>
<Style x:Key="LBStyle" TargetType="{x:Type ListBox}">
<Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled"/>
<Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/>
<Setter Property="ScrollViewer.CanContentScroll" Value="True"/>
<Setter Property="ScrollViewer.PanningMode" Value="VerticalOnly"/>
</Style>
<ListBox Grid.Row="0" Style="{StaticResource LBStyle}" ItemsSource="{Binding Source={StaticResource groupedSampleData}}" VerticalAlignment="Center" HorizontalAlignment="Stretch" Margin="0" >
<ListBox.Template>
<ControlTemplate TargetType="{x:Type ListBox}">
<ScrollViewer CanContentScroll="True" VerticalScrollBarVisibility="Auto" PanningMode="VerticalOnly">
<StackPanel>
<ItemsPresenter/>
</StackPanel>
</ScrollViewer>
</ControlTemplate>
</ListBox.Template>
<ItemsControl.ItemTemplate>
<DataTemplate>
<StackPanel>
<Border Width="96" Height="96" Margin="4" Background="#DDD"/>
<TextBlock Margin="4,0,4,4" Text="{Binding Path=Name}" HorizontalAlignment="Center"/>
</StackPanel>
</DataTemplate>
</ItemsControl.ItemTemplate>
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<WrapPanel />
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.GroupStyle>
<GroupStyle>
<GroupStyle.Panel>
<ItemsPanelTemplate>
<VirtualizingStackPanel/>
</ItemsPanelTemplate>
</GroupStyle.Panel>
<GroupStyle.HeaderTemplate>
<DataTemplate>
<TextBlock Margin="4,16,4,4" FontWeight="Bold" FontSize="15" Text="{Binding Path=Name}"/>
</DataTemplate>
</GroupStyle.HeaderTemplate>
</GroupStyle>
</ItemsControl.GroupStyle>
</ListBox>
答案 0 :(得分:2)
删除此
<ListBox.Template>
<ControlTemplate TargetType="{x:Type ListBox}">
<ScrollViewer CanContentScroll="True" VerticalScrollBarVisibility="Auto" PanningMode="VerticalOnly">
<StackPanel>
<ItemsPresenter/>
</StackPanel>
</ScrollViewer>
</ControlTemplate>
</ListBox.Template>
Listbox在模板中有自己的默认scrollviewer,如果我看到的只是ScrollViewer和StackPanel,为什么还需要更改列表框的模板?然后,您将ItemPanelTemplate重新定义为WrapPanel。
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<WrapPanel />
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
有一个名为ScrollViewer的静态类,您可以在其中控制其scrollviewer的属性。
<ListBox ScrollViewer.VerticalScrollBarVisibility="Auto"/>