需要创建具有标题和滚动条支持的上下文菜单

时间:2011-08-12 11:47:36

标签: .net wpf xaml contextmenu scrollviewer

我需要一个全局上下文菜单style / template,其中包含标题,然后是各种菜单项;由于我的上下文菜单中的菜单项数量可能很大,因此需要支持滚动。

我目前的风格问题是它不支持滚动;即使菜单项数量增长超过屏幕尺寸,也不会显示滚动条。

这是我正在使用的当前样式 -

<Style
    TargetType="{x:Type ContextMenu}"
    x:Key="ContextMenuStyle">
    <Setter
        Property="ContextMenu.Template">
        <Setter.Value>
            <ControlTemplate>
                <Border
                    BorderBrush="#868686"
                    BorderThickness="1"
                    Background="#FAFAFA">
                    <StackPanel
                        Orientation="Vertical">
                        <Label
                            Foreground="White"
                            Background="Blue">
                            <Binding
                                RelativeSource=
                                              "{RelativeSource AncestorType=
                                                {x:Type ContextMenu}}"
                                Path="PlacementTarget.Tag" />
                        </Label>
                        <Grid>
                            <Rectangle
                                Margin="1,1,1,1"
                                Width="25"
                                HorizontalAlignment="Left"
                                Fill="#E9EEEE" />
                            <Rectangle
                                Margin="26,1,0,1"
                                Width="1"
                                HorizontalAlignment="Left"
                                Fill="#C5C5C5" />
                            <Rectangle
                                Margin="27,1,0,1"
                                Width="1"
                                HorizontalAlignment="Left"
                                Fill="#FAFAFA" />
                            <ScrollViewer
                                Margin="1,0,1,0"
                                Style="{DynamicResource 
                                         {ComponentResourceKey                
                                         ResourceId=MenuScrollViewer,  
                                         TypeInTargetAssembly=
                                         {x:Type FrameworkElement}}}"
                                CanContentScroll="True"
                                Grid.ColumnSpan="2">
                                <ItemsPresenter
                                    KeyboardNavigation.DirectionalNavigation=
                                    "Cycle" />
                            </ScrollViewer>
                        </Grid>
                    </StackPanel>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

将hte scroll viewer放置在标题上方,但随后标题也会滚动。

实现这一目标的最佳方法是什么?

2 个答案:

答案 0 :(得分:2)

请尝试这样做。将垂直StackPanel(不限制高度)更改为具有两个RowDefinitions(Auto, *)的网格

<Style TargetType="{x:Type ContextMenu}">
    <Setter Property="ContextMenu.Template">
        <Setter.Value>
            <ControlTemplate>
                <Border BorderBrush="#868686"
                        BorderThickness="1"
                        Background="#FAFAFA">
                    <Grid VerticalAlignment="Stretch">
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto"/>
                            <RowDefinition Height="*"/>
                        </Grid.RowDefinitions>
                        <Label Grid.Row="0" Foreground="White" Background="Blue">
                            <Binding RelativeSource= "{RelativeSource AncestorType= {x:Type ContextMenu}}" Path="PlacementTarget.Tag" />
                        </Label>
                        <Grid Grid.Row="1">
                            <Rectangle Margin="1,1,1,1"
                                        Width="25"
                                        HorizontalAlignment="Left"
                                        Fill="#E9EEEE" />
                            <Rectangle Margin="26,1,0,1"
                                        Width="1"
                                        HorizontalAlignment="Left"
                                        Fill="#C5C5C5" />
                            <Rectangle Margin="27,1,0,1"
                                        Width="1"
                                        HorizontalAlignment="Left"
                                        Fill="#FAFAFA" />
                            <ScrollViewer Margin="1,0,1,0"
                                            Style="{DynamicResource {ComponentResourceKey ResourceId=MenuScrollViewer, TypeInTargetAssembly={x:Type FrameworkElement}}}"
                                            CanContentScroll="True"
                                            Grid.ColumnSpan="2">
                                <ItemsPresenter KeyboardNavigation.DirectionalNavigation="Cycle" />
                            </ScrollViewer>
                        </Grid>
                    </Grid>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

答案 1 :(得分:1)

试试这个:

    <Border>
        <DockPanel>
            <Label DockPanel.Dock="Top">Label</Label>
            <ScrollViewer>
                ....    
            </ScrollViewer>
        </DockPanel>
    </Border>

只需将您的stackpanel替换为dockpanel

即可