title: Disply a Dialog box for user input in a Win 8 Store XAML app
body: <p>Is there a way to achieve the Dialog like effect in a Win 8 Store XAML app; similar to the one indicated <a href="https://stackoverflow.com/questions/11593978/in-winrt-api-how-to-accept-user-input-in-a-dialog-just-like-in-weather-and-fina">in this post</a> where the content of the dialog is a custom control to gather user input.</p>
  <p>Here is some sample XAML content that I would like to display centered similar to the one indicated in the post above.</p>
  <pre class="lang-xml prettyprint-override"><code>&lt;common:LayoutAwarePage
  x:Class=&quot;App1.UserControls.Control1&quot;
  xmlns=&quot;http://schemas.microsoft.com/winfx/2006/xaml/presentation&quot;
  xmlns:x=&quot;http://schemas.microsoft.com/winfx/2006/xaml&quot;
  xmlns:d=&quot;http://schemas.microsoft.com/expression/blend/2008&quot;
  xmlns:mc=&quot;http://schemas.openxmlformats.org/markup-compatibility/2006&quot;   
  mc:Ignorable=&quot;d&quot;
  &gt;
  
  &lt;Grid HorizontalAlignment=&quot;Stretch&quot; Background=&quot;Gold&quot; VerticalAlignment=&quot;Center&quot;&gt;
      &lt;StackPanel  VerticalAlignment=&quot;Center&quot; HorizontalAlignment=&quot;Center&quot; AreScrollSnapPointsRegular=&quot;True&quot; Margin=&quot;20&quot;&gt;
          &lt;TextBlock Text=&quot;This is sample text&quot; FontSize=&quot;20&quot; Style=&quot;{StaticResource HeaderTextStyle}&quot;/&gt;            
          &lt;Button Content=&quot;Close&quot; Click=&quot;btnClose_Click&quot; Margin=&quot;0,20,0,0&quot; HorizontalAlignment=&quot;Right&quot;/&gt;
      &lt;/StackPanel&gt;
  &lt;/Grid&gt;&lt;/common:LayoutAwarePage&gt;
  </code></pre>
  <p>I am using the Popup control to display this from a Main page like so:</p>
  <pre class="lang-xml prettyprint-override"><code>&lt;common:LayoutAwarepage&gt;
  &lt;Grid Style=&quot;{StaticResource LayoutRootStyle}&quot;&gt;
     &lt;Popup x:Name=&quot;ParentedPopup&quot; VerticalOffset=&quot;300&quot; HorizontalOffset=&quot;200&quot; 
      HorizontalAlignment=&quot;Stretch&quot;&gt;
              &lt;usercontrols:CreateCategory/&gt;
     &lt;/Popup&gt;
   &lt;/Grid&gt;
  &lt;Page.BottomAppBar&gt;
      &lt;AppBar x:Name=&quot;bottomAppBar&quot; Padding=&quot;10,0,10,0&quot;&gt;
          &lt;Grid&gt;
              &lt;StackPanel Orientation=&quot;Horizontal&quot; HorizontalAlignment=&quot;Left&quot;&gt;
                  &lt;Button Style=&quot;{StaticResource AddAppBarButtonStyle}&quot; Click=&quot;AddButton_Click&quot;/&gt;
  
              &lt;/StackPanel&gt;
          &lt;/Grid&gt;
      &lt;/AppBar&gt;
  &lt;/Page.BottomAppBar&gt;&lt;/common:LayoutAwarePage&gt;
  </code></pre>
  <pre class="lang-cs prettyprint-override"><code>private void AddButton_Click(object sender, RoutedEventArgs e)
  {
      if (!ParentedPopup.IsOpen) { ParentedPopup.IsOpen = true; }
  }
  </code></pre>
  <p>However, this is not displaying as I intend it to, the popup does not show the xaml content centered, it shows up at the top and is not centered and stretched as I would like.</p>
  <p>Is there a simple way to achieve this?
  Note: I do not want to take dependencies on any libraries.</p>