Search code examples
c#popupwindows-phone

Windows Phone close popup if tap anywhere else


I have a Windows Phone app that I'm currently developing, and my share button opens a small popup with several options, using the following code:

       private void share_Click(object sender, System.EventArgs e) 
    {

        Popup share= new Popup();
        share.Child = new sharePopup();
        share.IsOpen = true;
        share.VerticalOffset = 30;
        share.HorizontalOffset = 0;
    }

Now, this Popup has a 'close' button, but if I don't tap it, and instead tap another button on the previous, still visible page, the popup stays in place, even after moving to a new page. I HAVE to click on 'close' for the popup to go away.

What I'm looking for is a way for the popup to close if I tap anywhere outside of the popup itself. Is there a predefined method to do this? If not, what ways could I go at it?

Thanks in advance

EDIT: Here's the c# code for the pop-up

      public partial class sharePopup : UserControl
{
    public sharePopup()
    {
        InitializeComponent();
    }

    private void Button_Click(object sender, RoutedEventArgs e)
    {            
        Popup mensaje = this.Parent as Popup;
        mensaje.IsOpen = false;
    }
      private void UserControl_Loaded(object sender, RoutedEventArgs e)
    {
        this.Focus();
    }

    private void UserControl_LostFocus(object sender, RoutedEventArgs e)
    {
        Popup mensaje = this.Parent as Popup;
        mensaje.IsOpen = false;
    }
}

}

The XAML for the popup only contains size, color and button definitions:

<UserControl x:Class="MSPinTrainingApp.sharePopup"
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"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
d:DesignHeight="480" d:DesignWidth="480"
Width="480" Height="200" >

<Grid x:Name="LayoutRoot" LostFocus="LayoutRoot_LostFocus">
    <Grid.RowDefinitions>
        <RowDefinition Height="auto"/>
        <RowDefinition Height="*"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="auto"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>
    <Grid.Background>
        <SolidColorBrush Color="{StaticResource PhoneChromeColor}"/>
    </Grid.Background>
    <TextBlock HorizontalAlignment="Stretch" VerticalAlignment="Stretch"
               Margin="3" x:Name="txtMensaje" Text="Compartir:" LostFocus="txtMensaje_LostFocus" />
    <Image Margin="70,60,335,62" Source="appbar.email.hardedge.png" Stretch="Fill" Tap="Image_Tap_1"/>
    <Image Margin="200,60,200,62" Source="appbar.facebook.png" Stretch="Fill" Tap="Image_Tap_2"/>
    <Image Margin="335,60,70,62" Source="appbar.twitter.bird.png" Stretch="Fill" Tap="Image_Tap_3"/>
    <Image Margin="430,-12,11,134" Source="/appbar.close.png" Width="50" Tap="Image_Tap_4"/>
</Grid>


Solution

  • After much failed experimentation and looking around the web, I came upon the Coding4Fun toolkit, and was able to make a working popup with its MessagePrompt. The toolkit is available at http://coding4fun.codeplex.com/