How to calculate the size of Popup content in Windows Store App?


  • I am working on a Win8.1 app. When the user clicks on a button on some page a Popup control should show up next the button.

    I managed to get the position of the button relative to the screen and now all I need to place the Popup next to the button is the size of Popup. The size of the Popup is automatically adapted to its content which is in my case a UserControl.

    The Problem 1: The size of the UserControl (and thus of the Popup) is not fixed but dynamic.

    private void ButtonClick(object sender, RoutedEventArgs e) {
        Point buttonOrigin = GetControlOrigin(sender);
        PopupContentControl contentControl = new PopupContentControl(SomeContent);
        Point popupOrigin = new Point();
        popupOrigin.X = buttonOrigin.X - margin - content.Width;
        popupOrigin.Y = buttonOrigin.Y;
        Popup popup = new Popup();
        popup.Child = contentControl;
        popup.IsLightDismissEnabled = true;
        popup.ChildTransitions = new Windows.UI.Xaml.Media.Animation.TransitionCollection() { new PaneThemeTransition() };
        popup.VerticalOffset = popupOrigin.Y;
        popup.HorizontalOffset = popupOrigin.X;
        popup.IsOpen = true;

    The Problem 2: The size of the PopupContentControl only once the controls Loaded() Event was fired. Before this content.Width .Height .ActualWidth and .ActualHeight are all 0 and thus not very helpfull.

    I need the correct size before popup.IsOpen is used to open the Popup but the only gets loaded after the Popup is shown...

    How can I solve this?

    I could set the opacity of the Popup to 0 or hide it by setting its offset to some off-screen values until Loades() was called and I know the correct size. But then the ChildTransitions would not really work.

    How can I solve this?

    I know that I could this with a flyout but there are some reasons why a Flyout cannot be used. For example the content uses some controls with Flyouts and it is not possible to show a Flyout in a Flyout...

    Tuesday, March 4, 2014 11:51 AM

All replies

  • if you have an project that isolates the problem i can help a bit. not having a complete awsner for this now

    Microsoft Certified Solutions Developer - Windows Store Apps Using C#

    Tuesday, March 4, 2014 12:03 PM
  • I think a sample project would be a little bit overdone. The code in my question covers pretty much the complete problem. The UserControl that is used as content is not included but this could be any UserControl.
    Tuesday, March 4, 2014 12:17 PM