如何在WPF中的列表框内部的底部,顶部,左侧或右侧添加工具栏?

时间:2009-09-23 19:10:30

标签: wpf listbox toolbar listboxitem

我有一个带圆角样式的列表框。我想在列表框中添加一个与该特定列表框相关的工具栏。目前,如果我在包含列表框的网格中添加工具栏,它将与行中的最后一项重叠(取决于工具栏的高度)。有没有人对实现这个的最佳方法有任何想法?我知道我可以创建一个与列表框边缘相匹配的边框控件,然后在主边框内放置一个没有边框样式的列表框,并在底部放置工具栏,但我希望有更好的方法保留我当前的列表框样式,只需将工具栏放在列表框底部,不隐藏任何列表框项目。

谢谢,

约翰

2 个答案:

答案 0 :(得分:1)

不确定我完全遵循,但我认为你有几个选择:

  1. ToolBar集成到ListBox模板中,可能是通过编写扩展ListBox的控件并添加属性来设置ToolBar项目。
  2. 关闭Border上的ListBox,并将自己的Border粘贴在ToolBar周围。
  3. 2稍微容易一些,可能就是你想要的。

    1的示例

    (我没有在这里继承子类ListBox - 我只是硬编码了一些ToolBar项目)

        <Grid Margin="10">
            <ListBox>
                <ListBox.Template>
                    <ControlTemplate TargetType="ListBox">
                        <Border BorderThickness="{TemplateBinding Border.BorderThickness}" Padding="1,1,1,1" BorderBrush="{TemplateBinding Border.BorderBrush}" Background="{TemplateBinding Panel.Background}" Name="Bd" SnapsToDevicePixels="True" CornerRadius="5">
                            <Grid>
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="Auto"/>
                                    <RowDefinition Height="*"/>
                                </Grid.RowDefinitions>
    
                                <ToolBarTray Background="White">
                                    <ToolBar Band="1" BandIndex="1">
                                        <Button>
                                            Cut
                                        </Button>
                                        <Button>
                                            Copy
                                        </Button>
                                        <Button>
                                            Paste
                                        </Button>
                                    </ToolBar>
                                    <ToolBar Band="2" BandIndex="1">
                                        <Button>
                                            Undo
                                        </Button>
                                        <Button>
                                            Redo
                                        </Button>
                                    </ToolBar>
                                </ToolBarTray>
                                <ScrollViewer Grid.Row="1" Padding="{TemplateBinding Control.Padding}" Focusable="False">
                                    <ItemsPresenter SnapsToDevicePixels="{TemplateBinding UIElement.SnapsToDevicePixels}" />
                                </ScrollViewer>
                            </Grid>
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="UIElement.IsEnabled" Value="False">
                                <Setter Property="Panel.Background" TargetName="Bd">
                                    <Setter.Value>
                                        <DynamicResource ResourceKey="{x:Static SystemColors.ControlBrushKey}" />
                                    </Setter.Value>
                                </Setter>
                            </Trigger>
                            <Trigger Property="ItemsControl.IsGrouping" Value="True">
                                <Setter Property="ScrollViewer.CanContentScroll" Value="False"/>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </ListBox.Template>
                <ListBoxItem>One</ListBoxItem>
                <ListBoxItem>Two</ListBoxItem>
                <ListBoxItem>Three</ListBoxItem>
            </ListBox>
        </Grid>
    

    2

    的例子
    <Grid Margin="10">
        <Border CornerRadius="5" BorderThickness="1" BorderBrush="Black" Padding="1">
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="*"/>
                </Grid.RowDefinitions>
    
                <ToolBarTray Background="White">
                    <ToolBar Band="1" BandIndex="1">
                        <Button>
                            Cut
                        </Button>
                        <Button>
                            Copy
                        </Button>
                        <Button>
                            Paste
                        </Button>
                    </ToolBar>
                    <ToolBar Band="2" BandIndex="1">
                        <Button>
                            Undo
                        </Button>
                        <Button>
                            Redo
                        </Button>
                    </ToolBar>
                </ToolBarTray>
                <ListBox Grid.Row="1" BorderThickness="0">
                    <ListBoxItem>One</ListBoxItem>
                    <ListBoxItem>Two</ListBoxItem>
                    <ListBoxItem>Three</ListBoxItem>
                </ListBox>
            </Grid>
        </Border>
    </Grid>
    

    在这两种情况下,结果都类似:

    alt text http://img42.imageshack.us/img42/372/screenshotof.png

答案 1 :(得分:0)

如果事物在视觉上重叠,很可能在代码中声明了一些错误。您应该使用Grid.Row =“0”声明ListBox,并将工具栏设置为Grid.Row =“1”(或类似的东西),如果您希望它们不重叠。 This MSDN article很好地解释了网格布局。

如果ListBoxItems不是数据绑定,则只需添加一个自定义样式的ListBoxItem作为列表中的最后一项。否则,您可以使用DataTemplateSelector根据其中的内容格式化项目样式。