Question

I have a popup, yet in the visual designer it does not stretch nor does it center. Why is this? How can I achieve this effect?

This is how I have it set up in the visual tree:

    <Popup x:Name="namePromptPopup" IsLightDismissEnabled="True" Grid.Row="1" Grid.Column="1">
        <Popup.ChildTransitions>
            <TransitionCollection>
                <PopupThemeTransition/>
            </TransitionCollection>
        </Popup.ChildTransitions>
        <StackPanel>
            <Border BorderBrush="White" BorderThickness="5" >
                <Border.Background>
                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                        <GradientStop Color="#FF600F0F"/>
                        <GradientStop Color="#FFB81C1C" Offset="1"/>
                    </LinearGradientBrush>
                </Border.Background>
                <StackPanel HorizontalAlignment="Center" VerticalAlignment="Center">
                    <TextBox Text="Generic Name" FontSize="38" HorizontalAlignment="Center" Width="320" />
                    <Button Content="Submit" Click="namePromptSubmit" HorizontalAlignment="Center" />
                </StackPanel>
            </Border>
        </StackPanel>
    </Popup>

It just seems like the popup control simply doesn’t respond to layout.

Answer 1

I’ve checked the web and thanks to this guy, he has a solution you can use.

He just calculates the window width/height and use the popup width/height to give an offset.

//Here is where I get a bit tricky.  You see namePromptPopup.ActualWidth will show
//the full screen width, and not the actual width of the popup, and namePromptPopup.Width
//will show 0 at this point.  So we needed to calculate the actual
//display width.  I do this by using a calculation that determines the
//scaling percentage from the height, and then calculates that against my
//original width coding.
namePromptPopup.HorizontalOffset = (currentWindow.Bounds.Width / 2) - (400 / 2);
namePromptPopup.VerticalOffset = (currentWindow.Bounds.Height / 2) - (150 / 2);

Reference again