Popup doesn't lose focus and close until I've clicked a control within it

Question

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.

Answer 1

The problem is in that the ToggleButton has ClickMode=Press. Setting ClickMode=Release fixes the problem and Popup closes on focus lost.

Answer 2

I have no problem closing the Popup when I click anywhere else on the screen using this code:

<Window x:Class="AutomaticPopupClosing.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="100" Width="240">
    <Grid>
        <Button Content="Show Popup"
                VerticalAlignment="Center"
                HorizontalAlignment="Center"
                Click="ButtonBase_OnClick" />
        <Popup x:Name="Popup"
               StaysOpen="False"
               FocusManager.IsFocusScope="False"
               PopupAnimation="Slide"
               AllowsTransparency="True">
            <Border Padding="5"
                    Background="White"
                    FocusManager.IsFocusScope="False">
                <StackPanel>
                   <TabControl x:Name="TabControl" MinHeight="200">
                       <TabItem>
                           <Calendar />
                       </TabItem>
                   </TabControl>
                </StackPanel>
            </Border>
        </Popup>
    </Grid>
</Window>

In the ButtonBase_OnClick method I just assign true to the Popup.IsOpen property:

private void ButtonBase_OnClick(object sender, RoutedEventArgs e)
{
    Popup.IsOpen = true;
}

Do you have anything else that is worth noting? I could not reconstruct your problem.

Edit: after reading your comments, I tried to move the above code in a user control. The code is basically the same:

<UserControl x:Class="PopupDoesNotClose.PopupCalendar"
             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" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             mc:Ignorable="d" 
             d:DesignHeight="50" d:DesignWidth="100">
    <Grid>
        <Button Content="Show Popup"
                VerticalAlignment="Center"
                HorizontalAlignment="Center"
                Click="ButtonBase_OnClick" />
        <Popup x:Name="Popup"
               StaysOpen="False"
               FocusManager.IsFocusScope="False"
               PopupAnimation="Slide"
               AllowsTransparency="True">
            <Border Padding="5"
                    Background="White">
                <StackPanel>
                    <TabControl x:Name="TabControl"
                                MinHeight="200">
                        <TabItem>
                            <Calendar />
                        </TabItem>
                    </TabControl>
                </StackPanel>
            </Border>
        </Popup>
    </Grid>
</UserControl>

MainWindow now looks like this:

<Window x:Class="PopupDoesNotClose.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="clr-namespace:PopupDoesNotClose"
        Title="MainWindow"
        Height="100"
        Width="240">
    <local:PopupCalendar />
</Window>

When I open the popup and try to move the window afterwards using its title bar, the popup will close and I have to click and drag the title bar again to actually perform the move operation. Is there still something in your code that is not part of your question? I still cannot reconstruct your problem.