How to close popup in silverlight?

I have ListBox. when i click on ListBox item I have to show item information in popup But it does not close after clicking out side. I am creating popup in itemsselected event. 开发者_如何学Chow to handle popup close?

One approach is to create a canvas with a transparent background that you make visible at the same time as opening the Popup and attaching to is Mouse down event to closed the popup. Like this:-

Xaml:-

<Grid x:Name="LayoutRoot" Background="White" >

    <Grid.RowDefinitions>
        <RowDefinition Height="*" />
        <RowDefinition Height="Auto" />
    </Grid.RowDefinitions>

        <Popup x:Name="MyPopup" Closed="MyPopup_Closed" HorizontalOffset="100" VerticalOffset="100" Opened="Popup_Opened">
            <ListBox x:Name="PopupChild" MaxHeight="300" LostFocus="PopupChild_LostFocus">
                <sys:String>Hello World</sys:String>
            </ListBox>
        </Popup>

        <Button Content="Open Popup" Grid.Row="1" Click="Button_Click" />

    <Canvas x:Name="PopupOpen" Visibility="Collapsed" Background="Transparent" Grid.RowSpan="2" MouseLeftButtonDown="PopupOpen_MouseLeftButtonDown" />

</Grid>

Code:-

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

    private void Popup_Opened(object sender, EventArgs e)
    {
        PopupOpen.Visibility = Visibility.Visible;
    }

    private void PopupChild_LostFocus(object sender, RoutedEventArgs e)
    {
        MyPopup.IsOpen = false;
    }

    private void PopupOpen_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
    {
        MyPopup.IsOpen = false;
    }

    private void MyPopup_Closed(object sender, EventArgs e)
    {
        PopupOpen.Visibility = Visibility.Collapsed;
    }

Note that its important that if your popup contains a control that can receive the focus that you also handle LostFocus.

This is similar to a question that I had. Take a look at How to dismiss a popup in Silverlight when clicking outside of the control?. I posted in my solution an extension method that's been very helpful in making popups close when clicking outside of them.

I'm not quite sure what you mean by "clicking out side" because popups act in a modal way.

You should set up your popup window as a ChildWindow. Then you can handle the Closed event.

Here's a very simple sample that shows a selected string from a listbox in a main window.

First the main window:

<UserControl x:Class="PopupTest.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="400">

<Grid x:Name="LayoutRoot" Background="White">
    <StackPanel Orientation="Vertical">
        <ListBox x:Name="SomeList" Width="100" Height="100"  />
        <TextBlock x:Name="DialogResult" Width="100" />
    </StackPanel>
</Grid>

In the codebehind, the popup is triggered when the list selection changes. Simply set up a Closed handler. In this example, I simply put the chosen list item into a textblock, then upon closing the popup, I just put the dialog result in a textblock on the main window (to show if the user pushed ok or cancel).

    public MainPage()
    {
        InitializeComponent();
        SomeList.SelectionChanged += new SelectionChangedEventHandler(SomeList_SelectionChanged);

        SomeList.Items.Add("one");
        SomeList.Items.Add("two");
        SomeList.Items.Add("three");
    }

    void SomeList_SelectionChanged(object sender, SelectionChangedEventArgs e)
    {
        var popup = new SomePopup();
        popup.Closed += new EventHandler(popup_Closed);
        popup.ChosenItem.Text = (string)SomeList.SelectedItem;
        DialogResult.Text = "";
        popup.Show();
    }

    void popup_Closed(object sender, EventArgs e)
    {
        var popup = sender as SomePopup;
        if (popup.DialogResult == true)
            DialogResult.Text = "Ok";
        else
            DialogResult.Text = "Cancel";
    }

The popup closes when the user pushes Ok or Cancel, because the DialogResult value is set in the popup's code-behind:

        private void OKButton_Click(object sender, RoutedEventArgs e)
    {
        this.DialogResult = true;
    }

    private void CancelButton_Click(object sender, RoutedEventArgs e)
    {
        this.DialogResult = false;
    }