UWPでウィンドウのサイズを変更したときにオブジェクトを表示する

Question

現在、ユニバーサルウィンドウアプリケーションを学校の仕事として開発しています。ウィンドウや画面のサイズに関係なく、ユーザーに見えるようにするという大きな問題があります。

メニューとフレームを作成しましたが、サイズを正しく設定しているように見えますが、フレームはサイズに関係なくウィンドウの境界から同じ距離を保ちますが（空であれば）、ウィンドウの高さや幅が変更されるとフレームコンテンツは消えます以下に示す： （灰色の領域はフレームである）

私が望むすべては、例えば、1つのテキストボックスが25％次など、他のいくつかのブロックをフレーム幅の25％を有するであろうということです... 私はMSDNとstackoverflowからいくつかのソリューションをチェックしましたが、これまでは動作していないようです。事前にあなたの助け&時間

おかげ

現在の状態で私のプロジェクトのXAMLコード：

<Page 
    x:Class="Fublisher.real_program" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:local="using:Fublisher" 
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    mc:Ignorable="d"> 
    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"> 
     <Grid.ChildrenTransitions> 
      <TransitionCollection> 
       <EntranceThemeTransition FromHorizontalOffset="480" /> 
      </TransitionCollection> 
     </Grid.ChildrenTransitions> 
     <Grid x:Name="GR_STRAN" Margin="0" Padding="0"> 
      <Grid x:Name="GR_MENU" HorizontalAlignment="Left" Width="60" d:LayoutOverrides="TopPosition, BottomPosition"> 
       <Button x:Name="BT_MENU" Content="&#xEA37;" VerticalAlignment="Top" HorizontalAlignment="Stretch" d:LayoutOverrides="LeftPosition, RightPosition" Height="59.8" FontFamily="Segoe MDL2 Assets" Background="Transparent" FontSize="20" Click="CL_MENU"/> 
       <Button x:Name="BT_MENU_DOMOV" Content="&#xE80F;" VerticalAlignment="Top" HorizontalAlignment="Stretch" Height="59.8" FontFamily="Segoe MDL2 Assets" Background="Transparent" d:LayoutOverrides="LeftPosition, RightPosition" Margin="0,65,0,0" FontSize="20" Click="CL_DOMOV"/> 
       <Button x:Name="BT_MENU_VSEBINA" Content="&#xE70F;" VerticalAlignment="Top" HorizontalAlignment="Stretch" Height="59.8" FontFamily="Segoe MDL2 Assets" Background="Transparent" Margin="0,130,0,0" d:LayoutOverrides="LeftPosition, RightPosition" FontSize="20" Click="CL_VSEBINA"/> 
       <Button x:Name="BT_MENU_ABOUT" Content="&#xE946;" VerticalAlignment="Bottom" HorizontalAlignment="Stretch" Height="59.8" FontFamily="Segoe MDL2 Assets" Background="Transparent" d:LayoutOverrides="LeftPosition, RightPosition" FontSize="20"/> 
       <Button x:Name="BT_MENU_USER" Content="&#xE2AF;" VerticalAlignment="Bottom" HorizontalAlignment="Stretch" Height="59.8" FontFamily="Segoe MDL2 Assets" Background="Transparent" Margin="0,0,0,65" d:LayoutOverrides="LeftPosition, RightPosition" FontSize="20"/> 
       <Button x:Name="BT_MENU_OBLIKA" Content="&#xE771;" VerticalAlignment="Top" HorizontalAlignment="Stretch" Height="59.8" FontFamily="Segoe MDL2 Assets" Background="Transparent" Margin="0,195,0,0" d:LayoutOverrides="LeftPosition, RightPosition" FontSize="20"/> 
      </Grid> 
      <Grid x:Name="GR_VSEBINA" Margin="60,0,0,0" Background="#FFF1F1F1"> 
       <Frame x:Name="frame6" d:LayoutOverrides="LeftPosition, RightPosition, TopPosition, BottomPosition" Margin="10" Background="#FFE2E2E2"/> 
      </Grid> 
     </Grid> 
    </Grid> 
</Page> 

、ページのコードがフレーム内に示した：

<Page 
    x:Class="Fublisher.home" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:local="using:Fublisher" 
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    mc:Ignorable="d" Width="1860" Height="1080"> 

    <Grid Background="White"> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="1080"/> 
     </Grid.RowDefinitions> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="0"/> 
      <ColumnDefinition Width="1860"/> 
     </Grid.ColumnDefinitions> 
     <Grid.ChildrenTransitions> 
      <TransitionCollection> 
       <EntranceThemeTransition FromHorizontalOffset="480" /> 
      </TransitionCollection> 
     </Grid.ChildrenTransitions> 
     <Viewbox Grid.ColumnSpan="2" HorizontalAlignment="Center" Height="336" VerticalAlignment="Center" Width="601"> 
      <Grid Height="336" Width="601"> 
       <TextBlock x:Name="textBlock" TextWrapping="Wrap" Text="Hey!" FontSize="120" TextAlignment="Center" FontFamily="Segoe UI Light" Margin="23,0" Height="143" VerticalAlignment="Top" d:LayoutOverrides="LeftPosition, RightPosition"/> 
       <Button x:Name="button" Content="&#xEE56;" FontFamily="Segoe MDL2 Assets" FontSize="53.333" VerticalAlignment="Bottom" Margin="0,0,0,66" HorizontalAlignment="Left" Background="{x:Null}" Height="99" Width="187"/> 
       <Button x:Name="button_Copy" Content="&#xE771;" HorizontalAlignment="Stretch" FontFamily="Segoe MDL2 Assets" FontSize="53.333" VerticalAlignment="Bottom" Margin="207,0,207,66" Background="{x:Null}" Height="99" d:LayoutOverrides="LeftPosition, RightPosition"/> 
       <Button x:Name="button_Copy1" Content="&#xE78B;" FontFamily="Segoe MDL2 Assets" FontSize="53.333" VerticalAlignment="Bottom" HorizontalAlignment="Right" Margin="0,0,1,64" Background="{x:Null}" Height="101" Width="187"/> 
       <TextBlock x:Name="textBlock1" TextWrapping="Wrap" Text="Write" FontSize="26.667" TextAlignment="Center" Height="46" VerticalAlignment="Bottom" HorizontalAlignment="Left" Width="187"/> 
       <TextBlock x:Name="textBlock1_Copy" Margin="207,0" TextWrapping="Wrap" Text="Design" FontSize="26.667" TextAlignment="Center" Height="46" VerticalAlignment="Bottom" d:LayoutOverrides="LeftPosition, RightPosition"/> 
       <TextBlock x:Name="textBlock1_Copy1" TextWrapping="Wrap" Text="Publish" FontSize="26.667" TextAlignment="Center" Height="46" VerticalAlignment="Bottom" HorizontalAlignment="Right" Width="187"/> 
      </Grid> 
     </Viewbox> 
    </Grid> 
</Page> 

Answer 1

ハードコード幅本当にUWP Appで仕事をするのは不可能かもしれません。このため、マイクロソフトで適応パネルを使用しているのはDesign adaptive UIです。 HTMLページとほとんど同じように、オブジェクトは互いに相対的に流れなければなりません。リンクにRelativePanelを参照してください、そして、あなたはボタンが彼らの例のように、RightOf textBox1テキストボックスにすることであることを示すために

RelativePanel.RightOf="textBox1" 

ようなコードを追加することができます。