Question

我正在尝试创建一个工具栏控件，可以使用边框和标签对所选按钮进行分组。如果已经有一个内置控件可以执行此操作，那么我可以使用它而不是构建UserControl。

如果没有，那么我想要构建的是UserControl，它允许我输入一对多的ImageButton UserControls并设置如下的GroupLabel文本。这可以在WPF中完成吗？

class MeetingAdmin(admin.ModelAdmin):
    list_display = ['id', 'team_member', 'show_visitors' ]

    def show_visitors(self, obj):
        return "\n".join([a.visitor_name for a in obj.visitors.all()])

PS：我会发布一张图片，但这个古怪的论坛不允许我发布图片。

Answer 1

如果我找到了你，那么我认为你也可以实现这种方式，并且在鼠标输入和离开事件时你可以按下按钮点击工作。对于设置文本，您可以使用网格和其中的标签来设置文本，并在其下方使用图像按钮。

<UserControl x:Class="ABC.View.Oats"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             mc:Ignorable="d" 
             d:DesignHeight="300" d:DesignWidth="300">
    <Grid>
        <Image Source="{Binding Image}" Stretch="Fill"/>
    </Grid>
</UserControl>

Answer 2

我认为您正在寻找的是GroupBox，它有一个标题属性，您可以在其中设置标签。

这样的事情：

<GroupBox Width="300" Height="100">
        <GroupBox.Header>
            <Label>Text</Label>
        </GroupBox.Header>
        <StackPanel>
            <Button Content="Button"/>
            <Button Content="Button"/>
            <Button Content="Button"/>
        </StackPanel>
    </GroupBox>

Answer 3

我还建议使用groupbox，它似乎正在做你想要它做的事情，它看起来很整洁。以下是有关如何使用它们的一些示例：http://www.dotnetperls.com/groupbox-wpf

另一方面，如果您认为组合框不够，您可以创建一个从组框继承的控件，您可以扩展它并添加您需要的任何内容。它看起来像这样：

public class customGroupBox: GroupBox{
 ....Add whatever you need here
}

Answer 4

感谢您的回复。我尝试了GroupBox，它不是我们想要的布局，因为我们希望标签位于按钮下方并居中。我从来没有找到过将一个集合添加到UserControl的方法。也许我没有通过将其称为容器来解决问题。下面的代码可以使用，但它并不优雅。我想要在UserControl中包装布局的东西，并允许我为每个工具栏组添加可变数量的按钮。

＆＃13;

        <StackPanel Orientation="Horizontal" Grid.Row="0" Grid.Column="0">
            <Border Background="GhostWhite" BorderBrush="Gainsboro" BorderThickness="1">
                <StackPanel Orientation="Vertical">
                    <StackPanel Orientation="Horizontal">
                        <User_Controls:ImageButton ButtonText="New 1"/>
                        <User_Controls:ImageButton ButtonText="New 2"/>
                        <User_Controls:ImageButton ButtonText="New 3"/>
                    </StackPanel>
                    <Label HorizontalAlignment="Center" Content="Group 1"/>
                </StackPanel>
            </Border>
            <Border Background="GhostWhite" BorderBrush="Gainsboro" BorderThickness="1">
                <StackPanel Orientation="Vertical">
                    <StackPanel Orientation="Horizontal">
                        <User_Controls:ImageButton ButtonText="New 4"/>
                    </StackPanel>
                    <Label HorizontalAlignment="Center" Content="Group 2"/>
                </StackPanel>
            </Border>
        </StackPanel>

＆＃13;

Answer 5

实现此目的的一种方法是使用自定义样式的ItemsControl。

然后，您可以重复使用它，并将其绑定到不同的数据。

请原谅我，这是手工打字......

在您的资源中......

<Style x:Key="ToolbarGroupItemsControlStyle" TargetType="ItemsControl">
    ...
    <Setter Property="ItemsPanel">
        <Setter.Value>
            <ItemsPanelTemplate>
                <StackPanel Orientation="Horizontal"/>
            </ItemsPanelTemplate>
        </Setter.Value>
    </Setter>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="ItemsControl">
                <Grid>
                    ... XAML to form your group with a binding to the
                    ... group name
                    <ItemsPresenter/>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

<DataTemplate x:Key="ToolbarGroupItemTemplate">
    <Grid>
        ... XAML and binding for each toolbar group item ...
    </Grid>
</DataTemplate>

在你的XAML ......

<ItemsControl 
    Style="{DynamicResource ToolbarGroupItemsControlStyle}"
    ItemsSource="{Binding ToolbarGroupItems}"
    ItemTemplate="{DynamicResource ToolbarGroupItemTemplate"/>

如果您的资源位于应用程序级别，那么您可以将ItemsControl放在任何所需的Window / UserControl上。

您的ItemsSource需要是您创建的自定义类型的集合，该类型具有按钮文本的绑定等。

我希望这有用。

如何使WPF UserControl作为一个容器

5 个答案: