如何正确地将Popup绑定到ToggleButton?

时间:2013-01-10 06:40:27

标签: c# wpf xaml popup togglebutton

我正在尝试从用户界面级别做一些看起来相对简单和逻辑的东西,但我有一个非常烦人的错误。我有一个ToggleButton,我试图在按钮切换时显示Popup,并在按钮切换时隐藏Popup。当用户点击它时,Popup也会隐藏。

除了在Popup显示后点击切换按钮,Popup一瞬间消失然后重新出现时,所有内容都按照预期的方式使用以下XAML。

我怀疑这里发生的是点击Popup导致它关闭按钮,然后在鼠标点击按钮后再切换按钮。我只是不知道如何修复它。

感谢任何帮助。感谢。

    <ToggleButton x:Name="TogglePopupButton" Content="My Popup Toggle Button" Width="100" />

    <Popup StaysOpen="False" IsOpen="{Binding IsChecked, ElementName=TogglePopupButton, Mode=TwoWay}">
        <Border Width="100" Height="200" Background="White" BorderThickness="1" BorderBrush="Black">
            <TextBlock>This is a test</TextBlock>
        </Border>                
    </Popup>

4 个答案:

答案 0 :(得分:35)

Stephans的答案有一个缺点,即每当它失去焦点时关闭弹出窗口的所需行为也会消失。

我通过在弹出窗口打开时禁用切换按钮解决了这个问题。另一种方法是使用IsHitTestVisible属性而不是启用:

    <ToggleButton x:Name="TogglePopupButton" Content="My Popup Toggle Button" Width="100"  IsEnabled="{Binding ElementName=ToggledPopup, Path=IsOpen, Converter={StaticResource BoolToInvertedBoolConverter}}"/>
    <Popup x:Name="ToggledPopup" StaysOpen="False" IsOpen="{Binding IsChecked, ElementName=TogglePopupButton, Mode=TwoWay}">
        <Border Width="100" Height="200" Background="White" BorderThickness="1" BorderBrush="Black">
            <TextBlock>This is a test</TextBlock>
        </Border>                
    </Popup>

转换器如下所示:

public class BoolToInvertedBoolConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
    {
        if (value is bool)
        {
            bool boolValue = (bool)value;
            return !boolValue;
        }
        else
            return false;
    }

    public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
    {
        throw new NotImplementedException("ConvertBack() of BoolToInvertedBoolConverter is not implemented");
    }
}

答案 1 :(得分:17)

没有IValueConverter的解决方案:

<Grid>
    <ToggleButton x:Name="TogglePopupButton" Content="My Popup Toggle Button" Width="100" >
        <ToggleButton.Style>
            <Style TargetType="{x:Type ToggleButton}">
                <Setter Property="IsHitTestVisible" Value="True"/>
                <Style.Triggers>
                    <DataTrigger Binding="{Binding ElementName=Popup, Path=IsOpen}" Value="True">
                        <Setter Property="IsHitTestVisible" Value="False"/>
                    </DataTrigger>
                </Style.Triggers>
            </Style>
        </ToggleButton.Style>
    </ToggleButton>

    <Popup StaysOpen="false" IsOpen="{Binding IsChecked, ElementName=TogglePopupButton, Mode=TwoWay}"
               PlacementTarget="{Binding ElementName=TogglePopupButton}" PopupAnimation="Slide" 
           x:Name="Popup">
        <Border Width="100" Height="200" Background="White" BorderThickness="1" BorderBrush="Black">
            <TextBlock>This is a test</TextBlock>
        </Border>
    </Popup>
</Grid>

答案 2 :(得分:0)

在ToggleButton上设置属性ClickMode="Press" apixeltoofar

答案 3 :(得分:-1)

StaysOpen="True"

设置Popup

来自MSDN

  

获取或设置一个值,该值指示Popup控件是否关闭   当控件不再处于焦点时。

     

[...]

     如果true控件在Popup属性设置为IsOpen时关闭,则

false;

     

false如果在Popup控件之外发生鼠标或键盘事件时Popup控件关闭。