【问题标题】:WrapPanel ListBox not wrappingWrapPanel ListBox 不换行
【发布时间】:2015-08-08 19:19:46
【问题描述】:

我正在尝试使用这种样式创建一个带有 Button DataTemplate 的 WrapPanel ListBox:

    <Style x:Key="lbxStyle" TargetType="ListBox">
        <Setter Property="Background" Value="{StaticResource primaryBrush}"/>
        <Setter Property="Foreground" Value="White"/>
        <Setter Property="VerticalAlignment" Value="Top"/>
        <Setter Property="VerticalContentAlignment" Value="Top"/>
        <Setter Property="ScrollViewer.CanContentScroll" Value="True"/>
        <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Hidden"/>
        <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled"/>
        <Setter Property="Margin" Value="6"/>
        <Setter Property="ItemsPanel">
            <Setter.Value>
                <ItemsPanelTemplate>
                    <WrapPanel
                        IsItemsHost="True"
                        Orientation="Horizontal"/>
                </ItemsPanelTemplate>
            </Setter.Value>
        </Setter>
        <Setter Property="ItemTemplate">
            <Setter.Value>
                <DataTemplate>
                    <Button>
                        <Button.Template>
                            <ControlTemplate TargetType="Button">
                                <Border
                                    HorizontalAlignment="Left"
                                    VerticalAlignment="Top"
                                    BorderBrush="White"
                                    Background="Transparent"
                                    BorderThickness="2"
                                    Margin="4,2,0,0">
                                    <Border.Triggers>
                                        <EventTrigger RoutedEvent="Border.MouseEnter">
                                            <EventTrigger.Actions>
                                                <BeginStoryboard>
                                                    <Storyboard>
                                                        <ColorAnimation
                                                            Storyboard.TargetProperty="
                                                                (Border.Background).
                                                                (SolidColorBrush.Color)"
                                                            From="Transparent"
                                                            To="{StaticResource accentColorTwo}"
                                                            Duration="0:0:0.25"/>
                                                    </Storyboard>
                                                </BeginStoryboard>
                                            </EventTrigger.Actions>
                                        </EventTrigger>
                                        <EventTrigger RoutedEvent="Border.MouseLeave">
                                            <EventTrigger.Actions>
                                                <BeginStoryboard>
                                                    <Storyboard>
                                                        <ColorAnimation
                                                            Storyboard.TargetProperty="
                                                                (Border.Background).
                                                                (SolidColorBrush.Color)"
                                                            From="{StaticResource accentColorTwo}"
                                                            To="Transparent"
                                                            Duration="0:0:0.25"/>
                                                    </Storyboard>
                                                </BeginStoryboard>
                                            </EventTrigger.Actions>
                                        </EventTrigger>
                                    </Border.Triggers>
                                    <ContentPresenter
                                        TextBlock.TextAlignment="Center"
                                        TextBlock.Foreground="White"
                                        TextBlock.FontFamily="SegoeUI"
                                        TextBlock.FontSize="14"
                                        Content="{Binding}"
                                        Name="content"/>
                                </Border>
                            </ControlTemplate>
                        </Button.Template>
                    </Button>
                </DataTemplate>
            </Setter.Value>
        </Setter>
    </Style>

在主窗口中,它是这样引用的:

    <ListBox
        x:Name="lbxUninspectedPrints"
        Height="125"
        Margin="16,0"
        Style="{StaticResource lbxStyle}"
        ItemsSource="{Binding UninspectedPrintList}"
        SelectedValue="{
            Binding DiePrintNav.SelectedDiePrintString, 
            Mode=OneWayToSource}"/>

但它不想正确包装。截图如下:

【问题讨论】:

  • 我将您的整个样式复制粘贴到 WPF 应用程序中,它按预期工作。也许您的列表框所在的容器具有较大的“高度”属性集,这意味着包装面板不需要包装。
  • 啊,这是一个很好的观点。 ListBox 具有动态高度;它总是填充窗口中的剩余空间,因此调整大小事件会导致高度发生变化。你知道我该如何解决这个问题吗?

标签: c# wpf button listbox


【解决方案1】:

所以诀窍是将宽度、高度和对齐设置器移出边框并移入按钮本身。我进行了一些其他更改,但此列表框的工作版本发布在下面(请注意,由于绑定问题,我不得不将所有内容移出样式并与 ListBox 引用内联)。

        <ListBox
            Name="lbxUninspectedPrints"
            Height="125"
            Margin="16,0"
            Background="{StaticResource primaryBrush}"
            Foreground="White"
            VerticalAlignment="Top"
            VerticalContentAlignment="Top"
            HorizontalContentAlignment="Left"
            ScrollViewer.CanContentScroll="True"
            ScrollViewer.VerticalScrollBarVisibility="Hidden"
            ScrollViewer.HorizontalScrollBarVisibility="Disabled"
            ItemsSource="{Binding UninspectedPrintList}">
            <ListBox.ItemsPanel>
                <ItemsPanelTemplate>
                    <WrapPanel/>
                </ItemsPanelTemplate>
            </ListBox.ItemsPanel>
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <Button
                        DataContext="{Binding}"
                        Width="44"
                        Height="24"
                        VerticalAlignment="Top"
                        VerticalContentAlignment="Center"
                        HorizontalAlignment="Left"
                        HorizontalContentAlignment="Center"
                        Content="{Binding}"
                        Command="{
                            Binding DataContext.DiePrintNav.UninspectedPrintSelectedCommand,
                            RelativeSource={RelativeSource AncestorType=ListBox}}"
                        CommandParameter="{Binding RelativeSource={RelativeSource Self}, Path=Content}">
                        <Button.Template>
                            <ControlTemplate TargetType="Button">
                                <Border
                                    BorderBrush="White"
                                    BorderThickness="2"
                                    Background="Transparent">
                                    <Border.Triggers>
                                        <EventTrigger RoutedEvent="Border.MouseEnter">
                                            <EventTrigger.Actions>
                                                <BeginStoryboard>
                                                    <Storyboard>
                                                        <ColorAnimation
                                                            Storyboard.TargetProperty="
                                                                (Border.Background).
                                                                (SolidColorBrush.Color)"
                                                            From="Transparent"
                                                            To="{StaticResource accentColorTwo}"
                                                            Duration="0:0:0.25"/>
                                                    </Storyboard>
                                                </BeginStoryboard>
                                            </EventTrigger.Actions>
                                        </EventTrigger>
                                        <EventTrigger RoutedEvent="Border.MouseLeave">
                                            <EventTrigger.Actions>
                                                <BeginStoryboard>
                                                    <Storyboard>
                                                        <ColorAnimation
                                                            Storyboard.TargetProperty="
                                                                (Border.Background).
                                                                (SolidColorBrush.Color)"
                                                            From="{StaticResource accentColorTwo}"
                                                            To="Transparent"
                                                            Duration="0:0:0.25"/>
                                                    </Storyboard>
                                                </BeginStoryboard>
                                            </EventTrigger.Actions>
                                        </EventTrigger>
                                    </Border.Triggers>
                                    <ContentPresenter
                                        TextBlock.TextAlignment="Center"
                                        TextBlock.Foreground="White"
                                        TextBlock.FontFamily="SegoeUI"
                                        TextBlock.FontSize="14"
                                        Content="{TemplateBinding Content}"/>
                                </Border>
                            </ControlTemplate>
                        </Button.Template>
                    </Button>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2016-04-07
    • 2010-09-13
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-11-23
    相关资源
    最近更新 更多