如何使用触发按钮关闭弹出窗口

Will 发表于 Dev

将要

嗨，我需要触发按钮来打开和关闭弹出窗口，只要在弹出窗口外单击鼠标，弹出窗口就应该关闭。

这是我的 XAML：

<Button x:Name="About"
                    Height="50"
                    Margin="0,-30,5,0"
                    HorizontalAlignment="Right"
                    Style="{StaticResource AboutButtonStyle}" />
<Popup HorizontalOffset="-300"
                   IsOpen="{Binding IsAboutPopupOpen, Mode=TwoWay}"
                   Placement="RelativePoint"
                   PlacementTarget="{Binding ElementName=About}"
                   StaysOpen="False"
                   VerticalOffset="-125">
    <Border Padding="10"
                        Background="White"
                        BorderBrush="{StaticResource SeparatorColorBrush}"
                        BorderThickness="1">
        <TextBlock>Some Text</TextBlock>
    </Border>
</Popup>

在我的 AboutViewModel 中，我实现了一个属性IsAboutPopupOpen：

private bool isAboutPopupOpen;

public bool IsAboutPopupOpen
{
    get
    {
        return this.isAboutPopupOpen;
    }

    set
    {
        if (value != this.isAboutPopupOpen)
        {
            this.isAboutPopupOpen = value;
            this.NotifyOfPropertyChange(() => IsAboutPopupOpen);
        }
    }
}

public void About()
{
    IsAboutPopupOpen = true;
}

问题是，当弹出窗口打开时，我单击“关于”按钮，弹出窗口关闭并再次打开。它应该关闭。除此之外，行为是正确的。

我已经为此寻找了一个简单的解决方案，但似乎找不到。这应该是一个普遍的问题。哦，我正在使用 Caliburn.Micro，但这应该无关紧要，我不认为。谢谢

将要

@Xiaoy312 为我指明了正确的方向。首先，我决定使用 ToggleButton：

    <ToggleButton
        x:Name="ShowAboutPopup"
        Grid.Row="1"
        Height="50"
        Margin="0,-30,5,0"
        HorizontalAlignment="Right"
        Grid.ZIndex="1000"
        Style="{StaticResource AboutButtonStyle}" />

然后我决定通过 IsOpen 属性将我的 ToggleButton 连接到弹出窗口，并将 StaysOpen 设置为 false：

    <Popup
        Grid.Row="1"
        Closed="AboutPopup_OnClosed"
        HorizontalOffset="-300"
        IsOpen="{Binding ElementName=ShowAboutPopup, Path=IsChecked, Mode=OneWay}"
        Placement="RelativePoint"
        PlacementTarget="{Binding ElementName=ShowAboutPopup}"
        StaysOpen="False"
        VerticalOffset="-125">
...
    </Popup>

最后我在代码隐藏中实现了 AboutPopup_OnClosed：

    private void AboutPopup_OnClosed(object sender, EventArgs e)
    {
        if (!object.Equals(this.ShowAboutPopup, Mouse.DirectlyOver))
        {
            this.ShowAboutPopup.IsChecked = false;
        }
    }

希望这可以帮助其他可能为此而苦苦挣扎的人。最重要的是，您通常应该使用切换按钮来打开和关闭弹出窗口。

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。