3
这是现在的样子：设置ComboboxItem的MaxWidth这样条件的项目宽度不超过ComboboxWidth
我想ComboBoxItem s到具有相同的宽度为ComboBox。我已覆盖默认模板ComboBox和ComboBoxItem。
ComboBoxItem风格：
<Style x:Key="{x:Type ComboBoxItem}"
TargetType="{x:Type ComboBoxItem}">
<Setter Property="SnapsToDevicePixels"
Value="true" />
<Setter Property="OverridesDefaultStyle"
Value="true" />
<Setter Property="FocusVisualStyle"
Value="{x:Null}" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ComboBoxItem}">
<Border Name="Border"
Padding="2"
SnapsToDevicePixels="true">
<ContentPresenter />
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsHighlighted"
Value="true">
<Setter TargetName="Border"
Property="Background"
Value="#9982B5D8" />
</Trigger>
<Trigger Property="IsEnabled"
Value="false">
<Setter Property="Foreground"
Value="#888888" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
ComboBox风格：
<Style x:Key="{x:Type ComboBox}"
TargetType="{x:Type ComboBox}">
<Setter Property="SnapsToDevicePixels"
Value="true" />
<Setter Property="OverridesDefaultStyle"
Value="true" />
<Setter Property="ScrollViewer.HorizontalScrollBarVisibility"
Value="Auto" />
<Setter Property="ScrollViewer.VerticalScrollBarVisibility"
Value="Auto" />
<Setter Property="ScrollViewer.CanContentScroll"
Value="true" />
<Setter Property="MinHeight"
Value="20" />
<Setter Property="FocusVisualStyle"
Value="{x:Null}" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ComboBox}">
<Border x:Name="comboBoxBorder"
BorderThickness="1"
BorderBrush="Transparent">
<Grid d:DesignWidth="250.25"
d:DesignHeight="24.75">
<ToggleButton Name="ToggleButton"
Template="{StaticResource ComboBoxToggleButton}"
Grid.Column="2"
Focusable="false"
IsChecked="{Binding Path=IsDropDownOpen,Mode=TwoWay,RelativeSource={RelativeSource TemplatedParent}}"
ClickMode="Press">
</ToggleButton>
<ContentPresenter Name="ContentSite"
IsHitTestVisible="False"
Content="{TemplateBinding SelectionBoxItem}"
ContentTemplate="{TemplateBinding SelectionBoxItemTemplate}"
ContentTemplateSelector="{TemplateBinding ItemTemplateSelector}"
Margin="3,3,23,3"
VerticalAlignment="Center"
HorizontalAlignment="Left" />
<TextBox x:Name="PART_EditableTextBox"
Style="{x:Null}"
Template="{StaticResource ComboBoxTextBox}"
HorizontalAlignment="Left"
VerticalAlignment="Center"
Margin="3,3,23,3"
Focusable="True"
Background="Transparent"
Visibility="Hidden"
IsReadOnly="{TemplateBinding IsReadOnly}" />
<Popup Name="Popup"
Placement="Bottom"
IsOpen="{TemplateBinding IsDropDownOpen}"
AllowsTransparency="True"
Focusable="False"
PopupAnimation="Slide">
<Grid Name="DropDown"
SnapsToDevicePixels="True"
MinWidth="{Binding ElementName=ToggleButton,
Path=ActualWidth}"
MaxHeight="{TemplateBinding MaxDropDownHeight}">
<Border x:Name="DropDownBorder"
Background="#FFFFFF"
BorderThickness="0.5"
BorderBrush="#FF1B75BB" />
<ScrollViewer x:Name="PopupItemsScrollViewer"
Margin="1,1,0,0.5"
CanContentScroll="False"
SnapsToDevicePixels="True">
<ItemsPresenter />
</ScrollViewer>
</Grid>
</Popup>
</Grid>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="HasItems"
Value="false">
<Setter TargetName="DropDownBorder"
Property="MinHeight"
Value="95" />
</Trigger>
<Trigger Property="IsEnabled"
Value="false">
<Setter Property="Foreground"
Value="#888888" />
<Setter Property="IsEnabled"
TargetName="ToggleButton"
Value="False" />
</Trigger>
<Trigger Property="IsGrouping"
Value="true">
<Setter Property="ScrollViewer.CanContentScroll"
Value="false" />
</Trigger>
<Trigger SourceName="Popup"
Property="AllowsTransparency"
Value="true" />
<Trigger Property="IsEditable"
Value="true">
<Setter Property="IsTabStop"
Value="false" />
<Setter TargetName="PART_EditableTextBox"
Property="Visibility"
Value="Visible" />
<Setter TargetName="ContentSite"
Property="Visibility"
Value="Hidden" />
</Trigger>
<Trigger Property="IsFocused"
Value="True">
<Setter TargetName="comboBoxBorder"
Property="BorderBrush"
Value="{StaticResource ComboBoxDropdownButtonBackgroundBrush}" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
ComboBoxToggleButton风格：
<ControlTemplate x:Key="ComboBoxToggleButton"
TargetType="{x:Type ToggleButton}">
<Grid x:Name="grid"
d:DesignWidth="243.25"
d:DesignHeight="20.667">
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition Width="20" />
</Grid.ColumnDefinitions>
<Border x:Name="Border"
Grid.ColumnSpan="2"
CornerRadius="0,0,0,0"
Background="{DynamicResource ComboBoxDropdownButtonBackgroundBrush}"
BorderBrush="#FF6CA1CB"
BorderThickness="0,0,0,0"
Margin="0,0,0,0" />
<Border x:Name="BlankSpaceBorder"
Grid.Column="0"
CornerRadius="0,0,0,0"
Margin="0,0,0,0"
Background="#FFFFFF"
BorderThickness="0.5,0.5,0,0.5"
BorderBrush="{DynamicResource ComboBoxToggleButtonNormalBorderBrush}">
</Border>
<Grid x:Name="grid1"
Grid.Column="1">
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition />
</Grid.RowDefinitions>
<Path x:Name="path"
Grid.Column="0"
Fill="#FFFFFFFF"
Stretch="Fill"
Width="11.49"
Height="5.744"
Data="F1M759.5938,228.6523L765.3408,234.3963L771.0838,228.6523z"
HorizontalAlignment="Center"
Margin="0,0,0,0"
VerticalAlignment="Center"
d:LayoutOverrides="Height"
Grid.RowSpan="2" />
<Path Fill="#FFAEDEE4"
Stretch="Fill"
Width="19.996"
Opacity="0.19999699294567108"
Data="F1M774.4961,229.3877L774.4961,220.7157L754.5001,220.7157L754.5001,231.1477C760.2531,229.2797,765.2251,227.7837,774.4961,229.3877"
HorizontalAlignment="Right"
Margin="0,0,0,0"
VerticalAlignment="Stretch"
Grid.Column="0" />
</Grid>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="ToggleButton.IsMouseOver"
Value="true">
<Setter Property="BorderBrush"
TargetName="BlankSpaceBorder">
<Setter.Value>
<SolidColorBrush Color="#FF1B75BB" />
</Setter.Value>
</Setter>
<Setter Property="BorderBrush"
TargetName="Border"
Value="#FF1B75BB" />
<Setter Property="Fill"
TargetName="path"
Value="{DynamicResource ComboBoxToggleButtonMouseOverArrowFill}" />
<Setter Property="Background"
TargetName="Border"
Value="White" />
<Setter Property="BorderThickness"
TargetName="Border"
Value="0,0.5,0.5,0.5" />
<Setter Property="Margin"
TargetName="grid1"
Value="0,0.5,0.5,0" />
</Trigger>
<Trigger Property="IsEnabled"
Value="False">
<Setter Property="Opacity"
TargetName="grid"
Value="0.25" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
XAML用法：
<ComboBox x:Name="ModesComboBox"
IsEditable="False"
ItemsSource="{Binding ModesCollection}"
SelectedIndex="{Binding CurrentMode}"
ToolTip="{Binding SelectedItem.Name,RelativeSource={RelativeSource Self}}"
HorizontalAlignment="Stretch"
VerticalContentAlignment="Top">
<ComboBox.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding Name}"
TextTrimming="CharacterEllipsis"
MaxWidth="{Binding ElementName=BlankSpaceBorder,
Path=ActualWidth}">
</TextBlock>
</DataTemplate>
</ComboBox.ItemTemplate>
</ComboBox>
我只是想将此MaxWidth设置为适当的值...想法？
更新时间： 我也尝试设置ComboboxItem的MaxWidth到ComoboBox的宽度，但在这种情况下，ScrollViewer出现后ComoboBox如下：
其实这是怎么了它现在显示，早先的代码是我想修改的。
但是，这将限制所有combobox有这样的行为..我不想这样的限制。我只是在这个东西只在我的应用程序的特定地方...这意味着我想包括XAML部分的变化。 – Rohit 2011-03-07 19:19:23
@Rohit - 查看我的更新。 – 2011-03-07 19:54:36
感谢您的回复。但遗憾的是，这件事在combobox之后带来了scrollviewer。查看图片的更新问题。 – Rohit 2011-03-08 06:08:28