WPF:ComboBox项显示在列中

时间:2018-11-21 19:47:15

标签: wpf xaml combobox

在修改默认组合框模板的WPF应用程序中显示组合框项目时出现问题。

有人无法引导我解决此问题,因为我找不到我在哪里做错了

该代码已在.NET Framework 4.6.1上使用Visual Studio 2017编写。

谢谢。

组合框样式

<ControlTemplate TargetType="ToggleButton" x:Key="ComboBoxToggleButtonTemplate">
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition />
            <ColumnDefinition Width="20" />
        </Grid.ColumnDefinitions>
        <Border Grid.ColumnSpan="2" Name="Border" BorderBrush="{StaticResource ControlsBorderColorBrush}" CornerRadius="0" BorderThickness="0" Background="{StaticResource ControlsBackgroundColorBrush}" />
        <Border Grid.Column="1" Margin="0,0,0,3" Name="ButtonBorder" CornerRadius="0" BorderThickness="0" Background="{StaticResource ControlsBackgroundColorBrush}" />
        <Path Name="Arrow" Grid.Column="1" Data="M0,0 L0,2 L4,6 L8,2 L8,0 L4,4 z" Fill="{StaticResource ControlsBorderColorBrush}" VerticalAlignment="Center" HorizontalAlignment="Center" />
    </Grid>
    <ControlTemplate.Triggers>
        <Trigger Property="UIElement.IsMouseOver" Value="True">
            <Setter Property="Panel.Background" TargetName="ButtonBorder" Value="{StaticResource ControlsBackgroundColorBrush}"/>
        </Trigger>
        <Trigger Property="ToggleButton.IsChecked" Value="True">
            <Setter Property="Panel.Background" TargetName="ButtonBorder" Value="{StaticResource ControlsBorderColorBrush}"/>
            <Setter Property="Shape.Fill" TargetName="Arrow" Value="{StaticResource ControlsBackgroundColorBrush}"/>
        </Trigger>
        <Trigger Property="UIElement.IsEnabled" Value="False">
            <Setter Property="Panel.Background" TargetName="Border" Value="{StaticResource ComboBoxDisabledBackgroundBrush}"/>
            <Setter Property="Panel.Background" TargetName="ButtonBorder" Value="{StaticResource ComboBoxDisabledBackgroundBrush}"/>
            <Setter Property="Border.BorderBrush" TargetName="ButtonBorder" Value="{StaticResource ComboBoxDisabledBorderBrush}"/>
            <Setter Property="TextElement.Foreground" Value="{StaticResource ComboBoxDisabledForegroundBrush}"/>
            <Setter Property="Shape.Fill" TargetName="Arrow" Value="#999"/>
        </Trigger>
    </ControlTemplate.Triggers>
</ControlTemplate>
<Style x:Key="ControlsComboBox"  TargetType="{x:Type ComboBox}">
    <Setter Property="Background" Value="{StaticResource ControlsBackgroundColorBrush }"/>
    <Setter Property="Height" Value="40"/>
    <Setter Property="Width" Value="200"/>
    <Setter Property="Padding" Value="3"/>
    <Setter Property="UIElement.SnapsToDevicePixels" Value="True"/>
    <Setter Property="FrameworkElement.OverridesDefaultStyle" Value="True"/>
    <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto"/>
    <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/>
    <Setter Property="ScrollViewer.CanContentScroll" Value="True"/>
    <Setter Property="TextElement.Foreground" Value="{StaticResource TextColorBrush}"/>
    <Setter Property="FrameworkElement.FocusVisualStyle" Value="{x:Null}"/>
    <Setter Property="Control.Template">
        <Setter.Value>
            <ControlTemplate TargetType="ComboBox">
                <Grid>
                    <ToggleButton Name="ToggleButton" Grid.Column="2" ClickMode="Press" Focusable="False" IsChecked="{Binding Path=IsDropDownOpen, RelativeSource={RelativeSource TemplatedParent}, Mode=TwoWay}" Template="{StaticResource ComboBoxToggleButtonTemplate}"/>
                    <ContentPresenter Name="ContentSite" Margin="5, 3, 23, 3" IsHitTestVisible="False" HorizontalAlignment="Left" VerticalAlignment="Center" Content="{TemplateBinding ComboBox.SelectionBoxItem}" ContentTemplate="{TemplateBinding ComboBox.SelectionBoxItemTemplate}" ContentTemplateSelector="{TemplateBinding ItemTemplateSelector}"/>
                    <TextBox Name="PART_EditableTextBox" Margin="3, 3, 23, 3" IsReadOnly="{TemplateBinding IsReadOnly}" Visibility="Hidden" Background="Transparent" HorizontalAlignment="Left" VerticalAlignment="Center" Focusable="True">
                        <TextBox.Template>
                            <ControlTemplate TargetType="TextBox" >
                                <Border Name="PART_ContentHost" Focusable="False" />
                            </ControlTemplate>
                        </TextBox.Template>
                    </TextBox>
                    <!-- Popup showing items -->
                    <Popup Name="Popup" Placement="Bottom" Focusable="False" AllowsTransparency="True" IsOpen="{TemplateBinding ComboBox.IsDropDownOpen}" PopupAnimation="Slide">
                        <Grid Name="DropDown" SnapsToDevicePixels="True" MinWidth="{TemplateBinding FrameworkElement.ActualWidth}" MaxHeight="{TemplateBinding ComboBox.MaxDropDownHeight}">
                            <Border Name="DropDownBorder" Background="{StaticResource ControlsBackgroundColorBrush }" Margin="0" CornerRadius="0" BorderThickness="3,0,3,3" BorderBrush="{StaticResource ControlsBorderColorBrush}"/>
                            <ScrollViewer Margin="4" SnapsToDevicePixels="True">
                                <ItemsPresenter KeyboardNavigation.DirectionalNavigation="Contained" />
                            </ScrollViewer>
                        </Grid>
                    </Popup>
                </Grid>
                <ControlTemplate.Triggers>
                    <Trigger Property="ItemsControl.HasItems" Value="False">
                        <Setter Property="FrameworkElement.MinHeight" TargetName="DropDownBorder" Value="95"/>
                    </Trigger>
                    <Trigger Property="UIElement.IsEnabled" Value="False">
                        <Setter Property="TextElement.Foreground" Value="{StaticResource ComboBoxDisabledForegroundBrush}"/>
                    </Trigger>
                    <Trigger Property="ItemsControl.IsGrouping" Value="True">
                        <Setter Property="ScrollViewer.CanContentScroll" Value="False"/>
                    </Trigger>
                    <Trigger Property="ComboBox.IsEditable" Value="True">
                        <Setter Property="KeyboardNavigation.IsTabStop" Value="False"/>
                        <Setter Property="UIElement.Visibility" TargetName="PART_EditableTextBox" Value="Visible"/>
                        <Setter Property="UIElement.Visibility" TargetName="ContentSite" Value="Hidden"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

页面标记

<Grid>
    <StackPanel Style="{StaticResource StackPanelVertical}">
        <TextBlock Style="{StaticResource ControlsTextBlock}">Select Work Server</TextBlock>
        <Border Style="{StaticResource ControlsBorder}">
            <StackPanel>
                <Image Source="/Content/Images/Controls/ServerLogo.png" ToolTip="Please select iManage Work Server" />
                <ComboBox Style="{StaticResource ControlsComboBox}"  Name="cbxServerName" ToolTip="Please select iManage Work Server">
                    <ComboBoxItem>Test 1</ComboBoxItem>
                    <ComboBoxItem>Test 2</ComboBoxItem>
                </ComboBox>
            </StackPanel>
        </Border>
    </StackPanel>
</Grid>

输出位于附件图像的下方,如您所见,它以列格式显示,但我正在寻找行 Final Outout

1 个答案:

答案 0 :(得分:0)

我不确定,但是只是创建了一个新的解决方案并复制了相同的XAML,并且它可以正常工作而没有任何问题,不知道是什么原因导致了旧解决方案中的此问题。