在 DropDownButton 中使用 ScrollBar? [英] Use ScrollBar in DropDownButton?

问题描述

我想在我的 DropDown 按钮中使用类似 ComboBox 的滚动条，结构实际上是这样的:

I want use a scrollbar like ComboBox in my DropDown button, the structure actually is this:

<Controls:DropDownButton Content="Nazioni" Width="120" Margin="0, 0, 20, 0" 
                         ScrollViewer.VerticalScrollBarVisibility="Visible"
                         ScrollViewer.CanContentScroll="True"
                         ItemsSource="{Binding Countries}"
                         ItemTemplate="{StaticResource CombinedTemplate}"/>

但我没有看到任何 ScrollViewer，如下图所示:

but I don't see any ScrollViewer as you can see in the image below:

推荐答案

DropDownButton 的下拉列表已经包含一个 ScrollViewer(它被命名为 "SubMenuScrollViewer")，因此支持开箱即用地滚动其项目.问题是，特定的 ScrollViewer 的样式与默认的 ScrollViewer 不同 - 假设我们正在谈论垂直滚动，它在列表上方和下方有两个按钮，负责分别上下滚动，如下图:

The drop-down of the DropDownButton already contains a ScrollViewer (it is named "SubMenuScrollViewer"), so scrolling through its items is supported out-of-the-box. The thing is, that particular ScrollViewer is styled differently than a default ScrollViewer - assuming we're talking about vertical scrolling, it has two buttons above and below the list, responsible for scrolling up and down respectively, as shown below:

所以最好的办法是让特定的 ScrollViewer 使用默认样式而不是自定义样式.通过检查 MahApps.Metro 源代码我们可以看到有问题的 ScrollViewer 被连接到使用键值为 {ComponentResourceKey ResourceId=MenuScrollViewer, TypeInTargetAssembly 的动态资源={x:Type FrameworkElement}}.因此，您需要做的是为该控件提供带有该键的默认样式:

So your best bet is to make that particular ScrollViewer use the default style rather than a custom one. By inspecting the MahApps.Metro source code we can see that the ScrollViewer in question is wired to use a dynamic resource with a key value of {ComponentResourceKey ResourceId=MenuScrollViewer, TypeInTargetAssembly={x:Type FrameworkElement}}. So what you need to do is to supply a default style with that key for that control:

<Controls:DropDownButton (...)>
    <Controls:DropDownButton.Resources>
        <Style x:Key="{ComponentResourceKey ResourceId=MenuScrollViewer, TypeInTargetAssembly={x:Type FrameworkElement}}"
               TargetType="{x:Type ScrollViewer}"
               BasedOn="{StaticResource {x:Type ScrollViewer}}" />
    </Controls.DropDownButton.Resources>
</Controls.DropDownButton>

这样，下拉列表中的 ScrollViewer 将使用 MahApps.Metro 附带的默认样式.

This way the ScrollViewer within the drop-down will be styled with a default style shipped with MahApps.Metro.

这篇关于在 DropDownButton 中使用 ScrollBar?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！