How to set fixed aspect ratio view inside parent in UWP and can stretch uniform when resize window?

Question

I want set the DropShadowPanel width and height is depend on its parent when still keep aspect ratio.

<Grid Background="White" Padding="10,10,10,10">

    <controls:DropShadowPanel Color="Black"
                      BlurRadius="30"
                      ShadowOpacity=".7"
                      Width="200" Height="300"                          
                      HorizontalContentAlignment="Stretch"                                          
                      VerticalContentAlignment="Stretch">
        <Grid />
    </controls:DropShadowPanel>
</Grid>

When resize the window (resize grid parent), its width or height will change to maximum value. How should I do?

Answer 1

How to set fixed aspect ratio view inside parent in UWP and can stretch uniform when resize window?

For your requirement, we suggest you insert DropShadowPanel into ViewBox, it is a container control that scales its content to a specified size.

<Grid Padding="10,10,10,10" Background="White">
    <Viewbox>
        <controls:DropShadowPanel
            Width="200"
            Height="300"
            HorizontalContentAlignment="Stretch"
            VerticalContentAlignment="Stretch"
            BlurRadius="30"
            ShadowOpacity=".7"
            Color="Black">
            <Grid />
        </controls:DropShadowPanel>
    </Viewbox>

</Grid>