I'm trying to create a dropdown control consisting of a ToggleButton and a Popup control with a TabControl inside. My problem is, that the Popup doesn't close automatically unless I've clicked a certain control inside it.
Consider the example below where the popup contains a TabControl which itself contains a Calendar control inside a TabItem.
The expected behavior is that the Popup Closes whenever it loses focus (i.e. clicking the container window), but in order for the popup to fire a LostFocus event and thus closing, I have to click one of the arrow buttons on the Calendar control first.
<UserControl x:Class="DropDownExample" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"> <Grid> <ToggleButton x:Name="ToggleButton" ClickMode="Press">Example</ToggleButton> <Popup x:Name="Popup" Placement="Bottom" AllowsTransparency="True" StaysOpen="False" PopupAnimation="Slide" FocusManager.IsFocusScope="false"> <TabControl x:Name="TabControl" MinHeight="200"> <TabItem> <Calendar /> </TabItem> </TabControl> </Popup> </Grid> </UserControl>
The opening/closing of the Popup is controlled in the Checked/Unchecked events of the ToggleButton.