[英]Missing vertical scrollbar in grouped WPF ListBox
Hi apologies if this is an obvious question; 抱歉,这是一个明显的问题; I'm fairly new to WPF.
我是WPF的新手。 I'm trying to create a 'grouped' listbox similar to the image below.
我正在尝试创建一个类似于下图的“分组”列表框。 With google's help I've just about managed to get it working except for some reason I get get the vertical scrollbar to be visible.
在google的帮助下,我几乎设法使其正常工作,但由于某种原因,我得到了垂直滚动条。 Does any body have any ideas?
有没有什么想法? This is driving me nuts!
这真让我发疯! Thanks
谢谢
The code I am using is as follows: 我使用的代码如下:
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"));
}
}
and in the xaml, 在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>
Remove this 删除这个
<ListBox.Template>
<ControlTemplate TargetType="{x:Type ListBox}">
<ScrollViewer CanContentScroll="True" VerticalScrollBarVisibility="Auto" PanningMode="VerticalOnly">
<StackPanel>
<ItemsPresenter/>
</StackPanel>
</ScrollViewer>
</ControlTemplate>
</ListBox.Template>
Listbox has its own default scrollviewer inside the template, why do you need to change the template of the listbox if all I see is the ScrollViewer and a StackPanel? 列表框在模板内有其自己的默认scrollviewer,如果我看到的只是ScrollViewer和StackPanel,为什么还要更改列表框的模板? And then you'll redefine the ItemPanelTemplate to a WrapPanel.
然后,将ItemPanelTemplate重新定义为WrapPanel。
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<WrapPanel />
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
There is a static class called ScrollViewer where you can control its scrollviewer's properties. 有一个称为ScrollViewer的静态类,您可以在其中控制其scrollviewer的属性。
<ListBox ScrollViewer.VerticalScrollBarVisibility="Auto"/>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.