Wpf Close popup when ListboxItem is selected

Question

I have listbox inside popup. How would I close popup right after I select item from list box; here is code:

 <Popup x:Name="ColorPopup" AllowsTransparency="True" 
 IsOpen="{Binding ElementName=ColorToggle, Path=IsChecked}" Placement="Bottom" StaysOpen="False" PlacementTarget="{Binding ElementName=ColorToggle}">

  <Border x:Name="DropDownBorder1" BorderBrush="{DynamicResource {x:Static SystemColors.WindowFrameBrushKey}}" Margin="0, 0,5,5" BorderThickness="1" Background="{DynamicResource {x:Static SystemColors.WindowBrushKey}}" Effect="{DynamicResource WindowShadowEffect}">
      <ListBox Name="ColorList" VerticalContentAlignment="Stretch" Margin="1, 3, 1, 3"   IsEnabled="True" Grid.Column="0" Background="Transparent" HorizontalContentAlignment="Center" SelectedItem="{Binding fColor}" SelectionMode="Single" Style="{StaticResource HorizontalListBoxStyle2}" ItemsSource="{Binding FillColors}">
      </ListBox>

   </Border>

</Popup>

Kapitán Mlíko Kapitán Mlíko · Accepted Answer · 2013-04-25T14:19:51

Subscribe to SelectionChanged event.

you can either do it in code-behind:

private void ListBox_SelectionChanged_1(object sender, SelectionChangedEventArgs e)
{
    // ColorPopup.IsOpen = false; ?? or ColorToggle.IsChecked = false; 
}

<ListBox SelectionChanged="ListBox_SelectionChanged_1" ... />

or maybe if you use MVVM pattern...

It could be something like this for example for MVVM-Light:

<ListBox ...>
    <i:Interaction.Triggers>
        <i:EventTrigger EventName="SelectionChanged">
            <cmd:EventToCommand Command="{Binding Path=ClosePopupCommand}" PassEventArgsToCommand="True" />
        </i:EventTrigger>
    </i:Interaction.Triggers>
</ListBox>

Or Prism could be almost the same :

 <ListBox>
      <i:Interaction.Triggers>
           <i:EventTrigger EventName="SelectionChanged">
                <prism:InvokeCommandAction Command="{Binding Path=ClosePupupCommand}" />
           </i:EventTrigger>
      </i:Interaction.Triggers>
 </ListBox>

Or if you have dirty mind you could also close popup in fColor property setter. :)

    public object fColor
    {
        get
        {
            return this.fColorField;
        }

        set
        {
            this.fColorField= value;
            IsColorToggelChecked = false;
            RaisePropertyChanged(() => this.fColor);
        }
    }

Wpf Close popup when ListboxItem is selected

1 Answers