Скрытие всплывающего окна при щелчке мыши с помощью Popup.StaysOpen в WPF

Question

Я получил свой UserControl, содержащий:

• Кнопка
• Всплывающее окно (содержит текстовый блок)

1009 * XAML *

<UserControl>
<button Name="btnShowPopup" Content="Button" Click="Button_Click"/>
<Popup Name="popup" StaysOpen="true">
<TextBlock Text="Popup"/>
</Popup>
</UserControl>

Код позади

private void Button_Click(object sender, System.Windows.RoutedEventArgs e)
{
   this.popup.IsOpen=!this.popup.IsOpen;
}

ВОПРОС: Я хочу скрыть всплывающее окно, если щелкнуть мышью в любом месте за пределами кнопки btnShowPopup.

ПРИМЕЧАНИЕ: я пытался изменить StaysOpen="false" и когда btnShowPopup.MouseDown событие: this.popup.IsOpen=!this.popup.IsOpen; Но это решение вызывает еще одну проблему: при btnShowPopup.MouseUp событии всплывающее окно исчезает.

Пожалуйста, помогите.

Answer 1

Вы также можете привязать свойство StaysOpen к кнопке переключения:

StaysOpen="{Binding ElementName=toggleButton,Path=IsMouseOver}"

https://social.msdn.microsoft.com/Forums/vstudio/en-US/f0502813-9c4f-4b45-bab8-91f98971e407/popup-popupstaysopen-togglebutton-and-data-binding-helpful-tip?forum=wpf

Проблема для меня заключалась в том, что если я дважды щелкнул по своей сетке данных, которая находится во всплывающем окне, всплывающее окно открылось напрямую, поэтому я использовал мультисвязь Что я сделал:

Я несколько привязал свойство StayOpen к IsMouseOver toggleButton и к моей сетке данных IsMouseOver, которая находится во всплывающем окне.

<Popup.StaysOpen>
    <MultiBinding Converter="{StaticResource MultiBinding_StayOpen}">
        <Binding ElementName="toggleButton"  Path="IsMouseOver"/>
        <Binding ElementName="dtg_loc" Path="IsMouseOver" />
    </MultiBinding>
</Popup.StaysOpen>

MultiBindingConverter:

public class MultiBinding_StayOpen : IMultiValueConverter
{
    public object Convert(object[] values, Type targetType, object parameter, System.Globalization.CultureInfo culture)
    {

        bool toggleIsMouseOver;
        bool datagridIsMouseOver;

        toggleIsMouseOver = System.Convert.ToBoolean(values[0]);
        datagridIsMouseOver = System.Convert.ToBoolean(values[1]);


        if (toggleIsMouseOver == false && datagridIsMouseOver == false)
            return false;

        if (toggleIsMouseOver == true && datagridIsMouseOver == false)
            return true;

        if (toggleIsMouseOver == true && datagridIsMouseOver == true)
            return false;

        return true;
    }

    public object[] ConvertBack(object value, Type[] targetTypes, object parameter, System.Globalization.CultureInfo culture)
    {
        throw new NotImplementedException();
    }
}

Надеюсь, это поможет :-)

Answer 2

Установите свойство ClickMode="Press" на кнопке переключения.

<ToggleButton x:Name="myToggle" ClickMode="Press" />

Answer 3

Я бы попробовал более подход WPF-esque. Вместо того чтобы делать код, я бы попытался связать свойства. Если вы измените кнопку для кнопки ToggleButton, это легко. Видите ли, ToggleButton имеет логическое свойство с именем IsChecked

<ToggleButton x:Name="myToggle" />
<Popup x:Name="Popup"
    IsOpen="{Binding Path=IsChecked, ElementName=myToggle}"
    Placement="Right"
    PlacementTarget="{Binding ElementName=myToggle}"
    AllowsTransparency="True" 
    Focusable="False"
    PopupAnimation="Fade"
    StaysOpen="False">
    <Textblock Text="Here goes my content" />
</Popup>

Что ты думаешь?

Answer 4

Тио. Это решение я тоже пробую. Однако есть две проблемы с этим.

1) Когда вы нажимаете кнопку, открывается всплывающее окно, однако, если вы нажмете кнопку еще раз, оно закроется, а затем быстро откроется снова. Такое поведение я не ожидал, я думал, что оно снова закроется.

2) Если вы не нажимаете кнопку переключения, всплывающее окно остается открытым.

Я немного погуглил, конечно, у какого-то другого парня была такая же проблема, и решил ее: =)

проверить это: http://social.msdn.microsoft.com/Forums/en-US/wpf/thread/f0502813-9c4f-4b45-bab8-91f98971e407