views:

494

answers:

0

Hi, I am trying to open the combobox popup when it is focused using Style/Event Trigger

I used the following code in my Combobox control Template:

<ControlTemplate x:Key="ComboBoxTemplate" TargetType="{x:Type ComboBox}">
        <Grid >
            <ToggleButton Grid.Column="2" Template="{DynamicResource ComboBoxToggleButton}" x:Name="ToggleButton" Focusable="false" IsChecked="{Binding Path=IsDropDownOpen, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" ClickMode="Press"/>
            <ContentPresenter  HorizontalAlignment="Left" Margin="3,3,23,3" x:Name="ContentSite" VerticalAlignment="Center" Content="{TemplateBinding SelectionBoxItem}" ContentTemplate="{TemplateBinding SelectionBoxItemTemplate}" ContentTemplateSelector="{TemplateBinding ItemTemplateSelector}" IsHitTestVisible="False"/>
            <TextBox Visibility="Hidden" Template="{DynamicResource ComboBoxTextBox}" HorizontalAlignment="Left" Margin="3,3,23,3" x:Name="PART_EditableTextBox" Style="{x:Null}" VerticalAlignment="Center"  Focusable="True" Background="Transparent" IsReadOnly="{TemplateBinding IsReadOnly}"/>
            <Popup IsOpen="{TemplateBinding IsDropDownOpen}" Placement="Bottom" x:Name="Popup" Focusable="False" AllowsTransparency="True" PopupAnimation="Slide">
                <Grid MaxHeight="{TemplateBinding MaxDropDownHeight}" MinWidth="{TemplateBinding ActualWidth}" x:Name="DropDown" SnapsToDevicePixels="True">
                    <Border x:Name="DropDownBorder" Background="{DynamicResource ShadeBrush}" BorderBrush="{DynamicResource SolidBorderBrush}" BorderThickness="1"/>
                    <ScrollViewer Margin="4,6,4,6"   SnapsToDevicePixels="True" HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto" CanContentScroll="True">
                        <StackPanel IsItemsHost="True" KeyboardNavigation.DirectionalNavigation="Contained"/>
                    </ScrollViewer>
                </Grid>
            </Popup>
        </Grid>
        <ControlTemplate.Triggers>
            <Trigger Property="IsMouseOver"  Value="True">
                <Setter Property="IsOpen" Value="True" TargetName="Popup"/>
            </Trigger>
        </ControlTemplate.Triggers>
    </ControlTemplate>

But nothing happens with this code. So I trid the following Event trigger in ControlTemplate.Triggers

<EventTrigger RoutedEvent="UIElement.GotFocus">
                <BeginStoryboard>
                    <Storyboard >
                        <BooleanAnimationUsingKeyFrames Storyboard.TargetName="Popup" Storyboard.TargetProperty="IsOpen" FillBehavior="HoldEnd">
                            <DiscreteBooleanKeyFrame KeyTime="00:00:00"  Value="True" />
                        </BooleanAnimationUsingKeyFrames>
                        </Storyboard>
                </BeginStoryboard>
            </EventTrigger>
            <EventTrigger RoutedEvent="UIElement.LostFocus">
                <BeginStoryboard>
                    <Storyboard >
                        <BooleanAnimationUsingKeyFrames Storyboard.TargetName="Popup" Storyboard.TargetProperty="IsOpen" FillBehavior="HoldEnd">
                            <DiscreteBooleanKeyFrame KeyTime="00:00:00"  Value="False" />
                        </BooleanAnimationUsingKeyFrames>
                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger>

Now this helps open the popup on focus, but when I select any item from dropdown the pop up doesnt disappear as usual; it stays open. it closes only after I click somewhere else in the window. Can someone please suggest the proper way to do this Thanks in advance