Menu
I have a Silverlight 4 application with a ComboBox near the bottom of the form. There can be anywhere from about 30 to 100 items in the Dropdown.
When I first open the ComboBox, there is no SelectedItem, the Dropdown opens upwards and it makes about 23 entries visible; it will continue this behavior each time I re-open the Dropdown, as long as I do not select an item. Once I select an item, everytime I open the ComboBox thereafter it always opens the Dropdown downwards, and makes only 3 entries visible.
I'm guessing the Dropdown is limited to 3 items, because that is the bottom limit of the window when it is maximized on my screen.
How do I get it to display more items, even when an item has been previously selected?
Here is an example Silverlight application that demonstrates the behavior, both in and out of browser.
<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; }
}
}
398
You need to edit the basic ComboBox template and change the size of the element called Popup. In this example it has been set to 100 high and now shows the same fixed height popup whether initial list or after selection:
*Note: I used Expression blend to edit a copy of the basic template (which is quite detailed). As the element part is named "Popup" you could in theory write code to find that part in the visual tree and modify the height property that way.
<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>
I was having this exact same issue (actually with Silverlight 5, but the same behavior nonetheless) and found a rather unlikely solution that does not involve modifying the template (in my case, I did not want to force the Popup to have a fixed size and direction).
I discovered that if I populated my ComboBox with ComboBoxItems instead of a collection of custom objects, then the dropdown/selection/direction issue does not occur. I did not really want to do this because my original design was using Binding on ItemsSource, SelectedItem etc. But since it fixes the issue I went with ComboBoxItems and dropped the binding approach.
So here are a couple of quick code snippets that illustrate the difference - the first uses a collection of custom objects and results in the strange behavior (my VehicleData class is just a simple class with an ID and Name along with few 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 fine no matter how many items 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 this question has already been answered but thought I would post this in the event it helped someone else.
32
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
