ViewBox 使 UWP 应用程序崩溃

Question

我试图让我的界面适合所有 phone 屏幕分辨率，所以我考虑使用 ViewBox 因为它应该很好地缩放内容问题是每当我包装 Canvas 有我所有的 ViewBox 元素都是这样的：

       <Viewbox Stretch="Uniform" >
        <Canvas x:Name="canvas">
        <Canvas.Background>
            <ImageBrush Stretch="Uniform" ImageSource="Assets/start-01.jpg"/>
        </Canvas.Background>
                <Image x:Name="play" HorizontalAlignment="Left" Height="36" Margin="70,271,0,0" VerticalAlignment="Top" Width="194" Source="Assets/start bottuns-01.png" Stretch="Fill" Tapped="play_Tapped"/>
                <TextBlock x:Name="playTB" Height="36" Margin="117,265,221,0" TextWrapping="Wrap" Text="RACE" FontSize="30" VerticalAlignment="Top" CharacterSpacing="364" Tapped="play_Tapped" FontFamily="Lucida Sans Unicode"/>
                <Image x:Name="highscoresBT" HorizontalAlignment="Left" Height="36" Margin="70,337,0,0" VerticalAlignment="Top" Width="194" Source="Assets/start bottuns-01.png" Stretch="Fill" Tapped="highscoresBT_Tapped"/>
                <TextBlock x:Name="highscoreTB" Height="36" Margin="72,337,236,0" TextWrapping="Wrap" Text="HIGHSCORES" FontSize="24" VerticalAlignment="Top" CharacterSpacing="194" Tapped="highscoresBT_Tapped" FontFamily="Lucida Sans Unicode"/>
                <Image x:Name="storeBT" HorizontalAlignment="Left" Height="36" Margin="70,403,0,0" VerticalAlignment="Top" Width="194" Source="Assets/start bottuns-01.png" Stretch="Fill" Tapped="storeBT_Tapped"/>
                <TextBlock x:Name="storeTB" HorizontalAlignment="Left" Height="36" Margin="111,397,0,0" TextWrapping="Wrap" Text="STORE" Width="151" FontSize="30" VerticalAlignment="Top" CharacterSpacing="364" Tapped="storeBT_Tapped"/>
                <Image x:Name="helpBut" HorizontalAlignment="Left" Height="100" Margin="131,522,0,0" VerticalAlignment="Top" Width="72" Source="Assets/helpBut-01.png" Tapped="helpBut_Tapped"/>
                <Image x:Name="coinsBG" HorizontalAlignment="Left" Height="19" Margin="282,0,0,0" VerticalAlignment="Top" Width="56" Source="Assets/comp bar-01.png" Stretch="Fill"/>
                <Image x:Name="coinsIC" HorizontalAlignment="Left" Height="19" VerticalAlignment="Top" Width="14" Source="Assets/coins-01.png" Margin="316,1,0,0"/>
                <TextBlock x:Name="coinsOwnedTB" HorizontalAlignment="Left" Height="14" Margin="290,2,0,0" TextWrapping="Wrap" Text="120" VerticalAlignment="Top" Width="21" FontSize="10" FontFamily="Lucida Sans Unicode" Foreground="#FF535257"/>
                <Image x:Name="scoreBG" HorizontalAlignment="Left" Height="23" VerticalAlignment="Top" Width="136" Source="Assets/comp bar-01.png" Stretch="Fill"/>
                <TextBlock x:Name="scoreNameTB" HorizontalAlignment="Left" Height="21" Margin="1,2,0,0" TextWrapping="Wrap" Text="Score: " VerticalAlignment="Top" Width="48" FontSize="14" FontFamily="Lucida Sans Unicode" Foreground="#FF535257"/>
                <TextBlock x:Name="scoreTB" HorizontalAlignment="Left" Height="21" Margin="49,2,0,0" TextWrapping="Wrap" Text="" VerticalAlignment="Top" Width="87" FontSize="14" FontFamily="Lucida Sans Unicode" Foreground="#FF535257"/>
                <Image x:Name="feedbackBT" HorizontalAlignment="Left" Height="36" Margin="70,469,0,0" VerticalAlignment="Top" Width="194" Source="Assets/start bottuns-01.png" Stretch="Fill" Tapped="feedback_Tapped"/>
                <TextBlock x:Name="feedbackTB" Height="36" Margin="83,463,244,0" TextWrapping="Wrap" Text="SUPPORT" FontSize="30" VerticalAlignment="Top" Tapped="feedback_Tapped" FontFamily="Lucida Sans Unicode" TextAlignment="Center" CharacterSpacing="200"/>
    </Canvas>
    </Viewbox>

所有元素都消失了，当运行在 Phone 模拟器上时，应用程序崩溃有人对此有什么想法吗？

注意：使用 Grid 而不是 Canvas 可以解决问题，但我的应用程序中有些地方应该使用 canvas 并且导致 ViewBox 出现同样的问题，这就是我发布的原因以这个问题为例，我知道这个页面并不需要 Canvas。谢谢

Answer 1

事实证明 canvas 应该有高度和宽度才能在视图框中正确查看，而 Grid 不需要它，这实际上是合乎逻辑的，因为 Grid 需要其中元素的大小，而canvas 没有。

仍然是一个谜，为什么在 phone 模拟器上添加 ViewBox 时没有设置 canvas 的高度和宽度时应用程序会崩溃，但如果设置它则可以正常工作。

ViewBox 使 UWP 应用程序崩溃

ViewBox crashes the UWP app

layout

xaml

viewbox

uwp