Silverlight 4 ComboBox Inconsistent Output

Question

I have a Silverlight 4 application with a ComboBox at the bottom of the form. The drop-down list can contain from 30 to 100 items.

When I first open ComboBox, there is no SelectedItem, the drop-down folder opens up and it displays about 23 entries; it will continue this behavior every time I open the drop-down menu again until I select an item. As soon as I select an item, every time I open the ComboBox, it always opens the drop-down list and makes only 3 entries visible.

I assume that the drop-down folder is limited to three elements, because this is the lower limit of the window when it is maximized on my screen.

How do I get it to display more items, even if the item was previously selected?

Here is an example Silverlight application that demonstrates behavior, both in the browser and outside it.

MainPage.xaml:

<UserControl x:Class="ComboBox_Test.MainPage" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d" d:DesignHeight="650" d:DesignWidth="1024"> <Grid x:Name="LayoutRoot" Background="LightSteelBlue" Loaded="MainPage_OnLoaded"> <Grid.RowDefinitions> <RowDefinition Height="3*" MinHeight="25" MaxHeight="25" /> <RowDefinition Height="35*" MinHeight="200" /> <RowDefinition Height="10*" MinHeight="70" MaxHeight="70" /> <RowDefinition Height="30*" MinHeight="230" MaxHeight="230" /> <RowDefinition Height="*" MinHeight="10" MaxHeight="30" /> </Grid.RowDefinitions> <Grid.ColumnDefinitions> <ColumnDefinition Width="12" /> <ColumnDefinition Width="150" /> <ColumnDefinition Width="*" /> <ColumnDefinition Width="12" /> </Grid.ColumnDefinitions> <TextBlock Name="lblData" Text="Data:" Grid.Row="1" Grid.Column="1" /> <TextBox x:Name="txtData" Grid.Row="1" Grid.Column="2" VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Auto" /> <StackPanel x:Name="AccessPanel" Orientation="Vertical" HorizontalAlignment="Left" Margin="5" Grid.Row="3" Grid.Column="2" Visibility="Visible"> <Grid> <Grid.RowDefinitions> <RowDefinition Height="75" /> <RowDefinition Height="*" /> </Grid.RowDefinitions> <StackPanel x:Name="CreationPanel" Orientation="Vertical" Grid.Row="1"> <Grid x:Name="CreationRoot"> <Grid.RowDefinitions> <RowDefinition Height="40" /> <RowDefinition Height="*" /> </Grid.RowDefinitions> <StackPanel x:Name="TypesPanel" Orientation="Horizontal" Grid.Row="1" Grid.Column="1" Margin="0 5 0 5"> <Grid x:Name="TypesRoot"> <Grid.RowDefinitions> <RowDefinition Height="25" /> <RowDefinition Height="*" /> </Grid.RowDefinitions> <Grid.ColumnDefinitions> <ColumnDefinition Width="220" /> <ColumnDefinition Width="220" /> <ColumnDefinition Width="*" /> </Grid.ColumnDefinitions> <TextBlock Text="Types" FontFamily="Arial" FontSize="12" FontWeight="Bold" Grid.Row="0" Grid.Column="0" /> <ComboBox x:Name="cboTypes" Width="220" Height="30" Grid.Row="1" Grid.Column="0" IsEnabled="True" SelectionChanged="cboTypes_SelectionChanged"> <ComboBox.ItemTemplate> <DataTemplate> <TextBlock Text="{Binding Name, Mode=OneWay}" /> </DataTemplate> </ComboBox.ItemTemplate> </ComboBox> </Grid> </StackPanel> </Grid> </StackPanel> </Grid> </StackPanel> </Grid> </UserControl> 

MainPage.xaml.cs:

 using System; using System.Windows; using System.Windows.Controls; namespace ComboBox_Test { public partial class MainPage : UserControl { public MainPage() { InitializeComponent(); } private void UpdateDataText(DataTypeDesc oData) { txtData.Text = String.Format("{0}\n\t{1}", oData.Name, oData.Desc); } private void MainPage_OnLoaded(object sender, RoutedEventArgs e) { object[] aDataTypeDescs = new object[] { new DataTypeDesc() {Name = "Boolean", Desc = "A Boolean value"} , new DataTypeDesc() {Name = "Byte", Desc = "An 8-bit unsigned integer"} , new DataTypeDesc() {Name = "Char", Desc = "A Unicode character"} , new DataTypeDesc() {Name = "Double", Desc = "A double-precision floating-point number"} , new DataTypeDesc() {Name = "float", Desc = "A single-precision floating-point number"} , new DataTypeDesc() {Name = "Int16", Desc = "A 16-bit signed integer"} , new DataTypeDesc() {Name = "Int32", Desc = "A 32-bit signed integer"} , new DataTypeDesc() {Name = "Int64", Desc = "A 64-bit signed integer"} , new DataTypeDesc() {Name = "SByte", Desc = "An 8-bit signed integer"} , new DataTypeDesc() {Name = "UInt16", Desc = "A 16-bit unsigned integer"} , new DataTypeDesc() {Name = "UInt32", Desc = "A 32-bit unsigned integer"} , new DataTypeDesc() {Name = "UInt64", Desc = "A 64-bit unsigned integer"} , new DataTypeDesc() {Name = "A", Desc = "The letter A in the alphabet"} , new DataTypeDesc() {Name = "B", Desc = "The letter B in the alphabet"} , new DataTypeDesc() {Name = "C", Desc = "The letter C in the alphabet"} , new DataTypeDesc() {Name = "D", Desc = "The letter D in the alphabet"} , new DataTypeDesc() {Name = "E", Desc = "The letter E in the alphabet"} , new DataTypeDesc() {Name = "F", Desc = "The letter F in the alphabet"} , new DataTypeDesc() {Name = "G", Desc = "The letter G in the alphabet"} , new DataTypeDesc() {Name = "H", Desc = "The letter H in the alphabet"} , new DataTypeDesc() {Name = "I", Desc = "The letter I in the alphabet"} , new DataTypeDesc() {Name = "J", Desc = "The letter J in the alphabet"} , new DataTypeDesc() {Name = "K", Desc = "The letter K in the alphabet"} , new DataTypeDesc() {Name = "L", Desc = "The letter L in the alphabet"} , new DataTypeDesc() {Name = "M", Desc = "The letter M in the alphabet"} , new DataTypeDesc() {Name = "N", Desc = "The letter N in the alphabet"} , new DataTypeDesc() {Name = "O", Desc = "The letter O in the alphabet"} , new DataTypeDesc() {Name = "P", Desc = "The letter P in the alphabet"} , new DataTypeDesc() {Name = "Q", Desc = "The letter Q in the alphabet"} , new DataTypeDesc() {Name = "R", Desc = "The letter R in the alphabet"} , new DataTypeDesc() {Name = "S", Desc = "The letter S in the alphabet"} , new DataTypeDesc() {Name = "T", Desc = "The letter T in the alphabet"} , new DataTypeDesc() {Name = "U", Desc = "The letter U in the alphabet"} , new DataTypeDesc() {Name = "V", Desc = "The letter V in the alphabet"} , new DataTypeDesc() {Name = "W", Desc = "The letter W in the alphabet"} , new DataTypeDesc() {Name = "X", Desc = "The letter X in the alphabet"} , new DataTypeDesc() {Name = "Y", Desc = "The letter Y in the alphabet"} , new DataTypeDesc() {Name = "Z", Desc = "The letter Z in the alphabet"} }; cboTypes.ItemsSource = aDataTypeDescs; } private void cboTypes_SelectionChanged(object sender, SelectionChangedEventArgs e) { DataTypeDesc oDesc = (DataTypeDesc)(cboTypes.SelectedItem); if (oDesc != null) UpdateDataText(oDesc); } } } 

DataTypeDesc.cs:

 using System; namespace ComboBox_Test { public class DataTypeDesc { public String Name { get; set; } public String Desc { get; set; } } } 

Answer 1

You need to edit the main ComboBox template and resize the Popup element. In this example, it was set to 100 high and now shows the same fixed height as the original list or after selection:

* Note. I used the Expression formula to edit a copy of the base template (which is pretty detailed). Since the element part is called "Popup", you can theoretically write code to find this part in the visual tree and thus change the height property.

Source for the modified page below:

 <UserControl xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:System="clr-namespace:System;assembly=mscorlib" x:Class="ComboBox_Test.MainPage" d:DesignHeight="650" d:DesignWidth="1024" mc:Ignorable="d"> <UserControl.Resources> <ControlTemplate x:Key="ValidationToolTipTemplate"> <Grid x:Name="Root" Margin="5,0" Opacity="0" RenderTransformOrigin="0,0"> <Grid.RenderTransform> <TranslateTransform x:Name="xform" X="-25"/> </Grid.RenderTransform> <VisualStateManager.VisualStateGroups> <VisualStateGroup x:Name="OpenStates"> <VisualStateGroup.Transitions> <VisualTransition GeneratedDuration="0"/> <VisualTransition GeneratedDuration="0:0:0.2" To="Open"> <Storyboard> <DoubleAnimation Duration="0:0:0.2" To="0" Storyboard.TargetProperty="X" Storyboard.TargetName="xform"> <DoubleAnimation.EasingFunction> <BackEase Amplitude=".3" EasingMode="EaseOut"/> </DoubleAnimation.EasingFunction> </DoubleAnimation> <DoubleAnimation Duration="0:0:0.2" To="1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="Root"/> </Storyboard> </VisualTransition> </VisualStateGroup.Transitions> <VisualState x:Name="Closed"> <Storyboard> <DoubleAnimation Duration="0" To="0" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="Root"/> </Storyboard> </VisualState> <VisualState x:Name="Open"> <Storyboard> <DoubleAnimation Duration="0" To="0" Storyboard.TargetProperty="X" Storyboard.TargetName="xform"/> <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="Root"/> </Storyboard> </VisualState> </VisualStateGroup> </VisualStateManager.VisualStateGroups> <Border Background="#052A2E31" CornerRadius="5" Margin="4,4,-4,-4"/> <Border Background="#152A2E31" CornerRadius="4" Margin="3,3,-3,-3"/> <Border Background="#252A2E31" CornerRadius="3" Margin="2,2,-2,-2"/> <Border Background="#352A2E31" CornerRadius="2" Margin="1,1,-1,-1"/> <Border Background="#FFDC000C" CornerRadius="2"/> <Border CornerRadius="2"> <TextBlock Foreground="White" MaxWidth="250" Margin="8,4,8,4" TextWrapping="Wrap" Text="{Binding (Validation.Errors)[0].ErrorContent}" UseLayoutRounding="false"/> </Border> </Grid> </ControlTemplate> <Style x:Key="ComboBoxStyle1" TargetType="ComboBox"> <Setter Property="Padding" Value="6,2,25,2"/> <Setter Property="Background" Value="#FF1F3B53"/> <Setter Property="HorizontalContentAlignment" Value="Left"/> <Setter Property="BorderThickness" Value="1"/> <Setter Property="TabNavigation" Value="Once"/> <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto"/> <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto"/> <Setter Property="BorderBrush"> <Setter.Value> <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> <GradientStop Color="#FFA3AEB9" Offset="0"/> <GradientStop Color="#FF8399A9" Offset="0.375"/> <GradientStop Color="#FF718597" Offset="0.375"/> <GradientStop Color="#FF617584" Offset="1"/> </LinearGradientBrush> </Setter.Value> </Setter> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="ComboBox"> <Grid> <Grid.Resources> <Style x:Name="comboToggleStyle" TargetType="ToggleButton"> <Setter Property="Foreground" Value="#FF333333"/> <Setter Property="Background" Value="#FF1F3B53"/> <Setter Property="BorderBrush"> <Setter.Value> <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> <GradientStop Color="#FFA3AEB9" Offset="0"/> <GradientStop Color="#FF8399A9" Offset="0.375"/> <GradientStop Color="#FF718597" Offset="0.375"/> <GradientStop Color="#FF617584" Offset="1"/> </LinearGradientBrush> </Setter.Value> </Setter> <Setter Property="BorderThickness" Value="1"/> <Setter Property="Padding" Value="3"/> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="ToggleButton"> <Grid> <VisualStateManager.VisualStateGroups> <VisualStateGroup x:Name="CommonStates"> <VisualState x:Name="Normal"/> <VisualState x:Name="MouseOver"> <Storyboard> <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="BackgroundOverlay"/> <ColorAnimation Duration="0" To="#7FFFFFFF" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[3].(GradientStop.Color)" Storyboard.TargetName="BackgroundGradient"/> <ColorAnimation Duration="0" To="#CCFFFFFF" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[2].(GradientStop.Color)" Storyboard.TargetName="BackgroundGradient"/> <ColorAnimation Duration="0" To="#F2FFFFFF" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)" Storyboard.TargetName="BackgroundGradient"/> </Storyboard> </VisualState> <VisualState x:Name="Pressed"> <Storyboard> <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="BackgroundOverlay2"/> <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="Highlight"/> <ColorAnimation Duration="0" To="#E5FFFFFF" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)" Storyboard.TargetName="BackgroundGradient"/> <ColorAnimation Duration="0" To="#BCFFFFFF" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[2].(GradientStop.Color)" Storyboard.TargetName="BackgroundGradient"/> <ColorAnimation Duration="0" To="#6BFFFFFF" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[3].(GradientStop.Color)" Storyboard.TargetName="BackgroundGradient"/> <ColorAnimation Duration="0" To="#F2FFFFFF" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[0].(GradientStop.Color)" Storyboard.TargetName="BackgroundGradient"/> </Storyboard> </VisualState> <VisualState x:Name="Disabled"/> </VisualStateGroup> <VisualStateGroup x:Name="CheckStates"> <VisualState x:Name="Checked"> <Storyboard> <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="BackgroundOverlay3"/> <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="Highlight"/> <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="BackgroundGradient2"/> <ColorAnimation Duration="0" To="#E5FFFFFF" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[1].(GradientStop.Color)" Storyboard.TargetName="BackgroundGradient2"/> <ColorAnimation Duration="0" To="#BCFFFFFF" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[2].(GradientStop.Color)" Storyboard.TargetName="BackgroundGradient2"/> <ColorAnimation Duration="0" To="#6BFFFFFF" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[3].(GradientStop.Color)" Storyboard.TargetName="BackgroundGradient2"/> <ColorAnimation Duration="0" To="#F2FFFFFF" Storyboard.TargetProperty="(Shape.Fill).(GradientBrush.GradientStops)[0].(GradientStop.Color)" Storyboard.TargetName="BackgroundGradient2"/> </Storyboard> </VisualState> <VisualState x:Name="Unchecked"/> </VisualStateGroup> <VisualStateGroup x:Name="FocusStates"> <VisualState x:Name="Focused"> <Storyboard> <ObjectAnimationUsingKeyFrames Duration="0" Storyboard.TargetProperty="Visibility" Storyboard.TargetName="FocusVisualElement"> <DiscreteObjectKeyFrame KeyTime="0"> <DiscreteObjectKeyFrame.Value> <Visibility>Visible</Visibility> </DiscreteObjectKeyFrame.Value> </DiscreteObjectKeyFrame> </ObjectAnimationUsingKeyFrames> </Storyboard> </VisualState> <VisualState x:Name="Unfocused"/> </VisualStateGroup> </VisualStateManager.VisualStateGroups> <Rectangle x:Name="Background" Fill="{TemplateBinding Background}" RadiusY="3" RadiusX="3" Stroke="{TemplateBinding BorderBrush}" StrokeThickness="{TemplateBinding BorderThickness}"/> <Rectangle x:Name="BackgroundOverlay" Fill="#FF448DCA" Opacity="0" RadiusY="3" RadiusX="3" Stroke="#00000000" StrokeThickness="{TemplateBinding BorderThickness}"/> <Rectangle x:Name="BackgroundOverlay2" Fill="#FF448DCA" Opacity="0" RadiusY="3" RadiusX="3" Stroke="#00000000" StrokeThickness="{TemplateBinding BorderThickness}"/> <Rectangle x:Name="BackgroundGradient" Margin="{TemplateBinding BorderThickness}" RadiusY="2" RadiusX="2" Stroke="#FFFFFFFF" StrokeThickness="1"> <Rectangle.Fill> <LinearGradientBrush EndPoint=".7,1" StartPoint=".7,0"> <GradientStop Color="#FFFFFFFF" Offset="0"/> <GradientStop Color="#F9FFFFFF" Offset="0.375"/> <GradientStop Color="#E5FFFFFF" Offset="0.625"/> <GradientStop Color="#C6FFFFFF" Offset="1"/> </LinearGradientBrush> </Rectangle.Fill> </Rectangle> <Rectangle x:Name="BackgroundOverlay3" Fill="#FF448DCA" Opacity="0" RadiusY="3" RadiusX="3" Stroke="#00000000" StrokeThickness="{TemplateBinding BorderThickness}"/> <Rectangle x:Name="BackgroundGradient2" Margin="{TemplateBinding BorderThickness}" Opacity="0" RadiusY="2" RadiusX="2" Stroke="#FFFFFFFF" StrokeThickness="1"> <Rectangle.Fill> <LinearGradientBrush EndPoint=".7,1" StartPoint=".7,0"> <GradientStop Color="#FFFFFFFF" Offset="0"/> <GradientStop Color="#F9FFFFFF" Offset="0.375"/> <GradientStop Color="#E5FFFFFF" Offset="0.625"/> <GradientStop Color="#C6FFFFFF" Offset="1"/> </LinearGradientBrush> </Rectangle.Fill> </Rectangle> <Rectangle x:Name="Highlight" IsHitTestVisible="false" Margin="{TemplateBinding BorderThickness}" Opacity="0" RadiusY="2" RadiusX="2" Stroke="#FF6DBDD1" StrokeThickness="1"/> <ContentPresenter x:Name="contentPresenter" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/> <Rectangle x:Name="FocusVisualElement" IsHitTestVisible="false" Margin="1" RadiusY="3.5" RadiusX="3.5" Stroke="#FF6DBDD1" StrokeThickness="1" Visibility="Collapsed"/> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style> </Grid.Resources> <VisualStateManager.VisualStateGroups> <VisualStateGroup x:Name="CommonStates"> <VisualState x:Name="Normal"/> <VisualState x:Name="MouseOver"/> <VisualState x:Name="Disabled"> <Storyboard> <DoubleAnimation Duration="00:00:00" To=".55" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="DisabledVisualElement"/> </Storyboard> </VisualState> </VisualStateGroup> <VisualStateGroup x:Name="FocusStates"> <VisualState x:Name="Focused"> <Storyboard> <DoubleAnimation Duration="00:00:00" To="1" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="FocusVisualElement"/> </Storyboard> </VisualState> <VisualState x:Name="Unfocused"/> <VisualState x:Name="FocusedDropDown"> <Storyboard> <ObjectAnimationUsingKeyFrames Duration="00:00:00" Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="PopupBorder"> <DiscreteObjectKeyFrame KeyTime="00:00:00"> <DiscreteObjectKeyFrame.Value> <Visibility>Visible</Visibility> </DiscreteObjectKeyFrame.Value> </DiscreteObjectKeyFrame> </ObjectAnimationUsingKeyFrames> </Storyboard> </VisualState> </VisualStateGroup> <VisualStateGroup x:Name="ValidationStates"> <VisualState x:Name="Valid"/> <VisualState x:Name="InvalidUnfocused"> <Storyboard> <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="ValidationErrorElement"> <DiscreteObjectKeyFrame KeyTime="0"> <DiscreteObjectKeyFrame.Value> <Visibility>Visible</Visibility> </DiscreteObjectKeyFrame.Value> </DiscreteObjectKeyFrame> </ObjectAnimationUsingKeyFrames> </Storyboard> </VisualState> <VisualState x:Name="InvalidFocused"> <Storyboard> <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="ValidationErrorElement"> <DiscreteObjectKeyFrame KeyTime="0"> <DiscreteObjectKeyFrame.Value> <Visibility>Visible</Visibility> </DiscreteObjectKeyFrame.Value> </DiscreteObjectKeyFrame> </ObjectAnimationUsingKeyFrames> <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="IsOpen" Storyboard.TargetName="validationTooltip"> <DiscreteObjectKeyFrame KeyTime="0"> <DiscreteObjectKeyFrame.Value> <System:Boolean>True</System:Boolean> </DiscreteObjectKeyFrame.Value> </DiscreteObjectKeyFrame> </ObjectAnimationUsingKeyFrames> </Storyboard> </VisualState> </VisualStateGroup> </VisualStateManager.VisualStateGroups> <Border x:Name="ContentPresenterBorder"> <Grid> <ToggleButton x:Name="DropDownToggle" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" HorizontalAlignment="Stretch" HorizontalContentAlignment="Right" Margin="0" Style="{StaticResource comboToggleStyle}" VerticalAlignment="Stretch"> <Path x:Name="BtnArrow" Data="F1 M 301.14,-189.041L 311.57,-189.041L 306.355,-182.942L 301.14,-189.041 Z " HorizontalAlignment="Right" Height="4" Margin="0,0,6,0" Stretch="Uniform" Width="8"> <Path.Fill> <SolidColorBrush x:Name="BtnArrowColor" Color="#FF333333"/> </Path.Fill> </Path> </ToggleButton> <ContentPresenter x:Name="ContentPresenter" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"> <TextBlock Text=" "/> </ContentPresenter> </Grid> </Border> <Rectangle x:Name="DisabledVisualElement" Fill="White" IsHitTestVisible="false" Opacity="0" RadiusY="3" RadiusX="3"/> <Rectangle x:Name="FocusVisualElement" IsHitTestVisible="false" Margin="1" Opacity="0" RadiusY="2" RadiusX="2" Stroke="#FF6DBDD1" StrokeThickness="1"/> <Border x:Name="ValidationErrorElement" BorderBrush="#FFDB000C" BorderThickness="1" CornerRadius="1" Visibility="Collapsed"> <ToolTipService.ToolTip> <ToolTip x:Name="validationTooltip" DataContext="{Binding RelativeSource={RelativeSource TemplatedParent}}" Placement="Right" PlacementTarget="{Binding RelativeSource={RelativeSource TemplatedParent}}" Template="{StaticResource ValidationToolTipTemplate}"> <ToolTip.Triggers> <EventTrigger RoutedEvent="Canvas.Loaded"> <BeginStoryboard> <Storyboard> <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="IsHitTestVisible" Storyboard.TargetName="validationTooltip"> <DiscreteObjectKeyFrame KeyTime="0"> <DiscreteObjectKeyFrame.Value> <System:Boolean>true</System:Boolean> </DiscreteObjectKeyFrame.Value> </DiscreteObjectKeyFrame> </ObjectAnimationUsingKeyFrames> </Storyboard> </BeginStoryboard> </EventTrigger> </ToolTip.Triggers> </ToolTip> </ToolTipService.ToolTip> <Grid Background="Transparent" HorizontalAlignment="Right" Height="12" Margin="1,-4,-4,0" VerticalAlignment="Top" Width="12"> <Path Data="M 1,0 L6,0 A 2,2 90 0 1 8,2 L8,7 z" Fill="#FFDC000C" Margin="1,3,0,0"/> <Path Data="M 0,0 L2,0 L 8,6 L8,8" Fill="#ffffff" Margin="1,3,0,0"/> </Grid> </Border> <Popup x:Name="Popup"> <Border x:Name="PopupBorder" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" CornerRadius="3" HorizontalAlignment="Stretch" Height="100"> <Border.Background> <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> <GradientStop Color="#FFFFFFFF" Offset="0"/> <GradientStop Color="#FFFEFEFE" Offset="1"/> </LinearGradientBrush> </Border.Background> <ScrollViewer x:Name="ScrollViewer" BorderThickness="0" Padding="1"> <ItemsPresenter/> </ScrollViewer> </Border> </Popup> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style> </UserControl.Resources> <Grid x:Name="LayoutRoot" Background="LightSteelBlue" Loaded="MainPage_OnLoaded"> <Grid.RowDefinitions> <RowDefinition Height="3*" MinHeight="25" MaxHeight="25" /> <RowDefinition Height="35*" MinHeight="200" /> <RowDefinition Height="10*" MinHeight="70" MaxHeight="70" /> <RowDefinition Height="30*" MinHeight="230" MaxHeight="230" /> <RowDefinition Height="*" MinHeight="10" MaxHeight="30" /> </Grid.RowDefinitions> <Grid.ColumnDefinitions> <ColumnDefinition Width="12" /> <ColumnDefinition Width="150" /> <ColumnDefinition Width="*" /> <ColumnDefinition Width="12" /> </Grid.ColumnDefinitions> <TextBlock x:Name="lblData" Text="Data:" Grid.Row="1" Grid.Column="1" /> <TextBox x:Name="txtData" Grid.Row="1" Grid.Column="2" VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Auto" /> <StackPanel x:Name="AccessPanel" Orientation="Vertical" HorizontalAlignment="Left" Margin="5" Grid.Row="3" Grid.Column="2" Visibility="Visible"> <Grid> <Grid.RowDefinitions> <RowDefinition Height="75" /> <RowDefinition Height="*" /> </Grid.RowDefinitions> <StackPanel x:Name="CreationPanel" Orientation="Vertical" Grid.Row="1"> <Grid x:Name="CreationRoot"> <Grid.RowDefinitions> <RowDefinition Height="40" /> <RowDefinition Height="*" /> </Grid.RowDefinitions> <StackPanel x:Name="TypesPanel" Orientation="Horizontal" Grid.Row="1" Grid.Column="1" Margin="0 5 0 5"> <Grid x:Name="TypesRoot"> <Grid.RowDefinitions> <RowDefinition Height="25" /> <RowDefinition Height="*" /> </Grid.RowDefinitions> <Grid.ColumnDefinitions> <ColumnDefinition Width="220" /> <ColumnDefinition Width="220" /> <ColumnDefinition Width="*" /> </Grid.ColumnDefinitions> <TextBlock Text="Types" FontFamily="Arial" FontSize="12" FontWeight="Bold" Grid.Row="0" Grid.Column="0" /> <ComboBox x:Name="cboTypes" Width="220" Height="30" Grid.Row="1" Grid.Column="0" IsEnabled="True" SelectionChanged="cboTypes_SelectionChanged" MaxDropDownHeight="600" Style="{StaticResource ComboBoxStyle1}"> <ComboBox.ItemTemplate> <DataTemplate> <TextBlock Text="{Binding Name, Mode=OneWay}" /> </DataTemplate> </ComboBox.ItemTemplate> </ComboBox> </Grid> </StackPanel> </Grid> </StackPanel> </Grid> </StackPanel> </Grid> </UserControl> 

Answer 2

I had the same problem (actually with Silverlight 5, but the same behavior) and found a rather unlikely solution that was not related to modifying the template (in my case, I did not want to force Popup to have a fixed size and direction).

I found that if I populated my ComboBox with ComboBoxItems instead of a set of custom objects, then the dropdown menu / select / direction problem would not occur. I really did not want to do this, because my original design used Binding on ItemsSource, SelectedItem, etc. But since it fixes the problem, I went with ComboBoxItems and refused the binding.

So, here are a few brief code snippets that illustrate the difference: the first uses a collection of custom objects and leads to weird behavior (my VehicleData class is just a class with identifier and name along with several other properties):

 // List of Custom Objects - Results in inconsistent behavior ObservableCollection<VehicleData> vehicleList = new ObservableCollection<VehicleData>(); for (int i = 0; i < 80; i++) { vehicleList.Add(new VehicleData { ID = i, Name = string.Format("Vehicle {0}", i) }); } ComboBoxVehicles.DisplayMemberPath = "Name"; ComboBoxVehicles.ItemsSource = vehicleList; 

And here is an example that works great regardless of how many elements are added and what the positioning of the ComboBox is:

 // List of ComboBoxItems - WORKS List<ComboBoxItem> testValues = new List<ComboBoxItem>(); for (int i = 0; i < 80; i++) { testValues.Add(new ComboBoxItem { Content = "Item " + i, Tag = i }); } ComboBoxVehicles.ItemsSource = testValues; 

I know that this question has already been answered, but I thought that I would publish it if he helped someone else.

Answer 3

Depending on the number of items you have and your available screen height, you can also set ScrollViewer.VerticalScrollBarVisibility="Disabled" , this will make it open upward, as there is no room downward.