UWP 앱의 양식 / 페이지가 런타임에 잘리는 이유는 무엇인가요 (디자인 타임 크기를 반영하지 않음)?

Nov 24 2020

UWP 앱의 디자인 타임에 원하는 모든 것을위한 충분한 공간을 확보했습니다 (상단에있는 6 개의 버튼과 궁극적으로 더 많은 텍스트를 포함하는 TextBlock).

페이지 하단의 textBlocks도 참고하세요.

런타임에 맨 위 TextBlock이 심하게 잘리고 양식 / 페이지 맨 아래에있는 모든 TextBlock이 전혀 표시되지 않습니다. 아마도 같은 이유로 다음과 같습니다.

이것이 디자인 된대로 작동하는 경우 (Microsoft, 즉 내가 아닌) 런타임에 완전히 표시되는 레이아웃을 만드는 데 허용되는 방법에 부합하려면 어떻게해야합니까?

업데이트 2

Roy Li의 요청에 따라 다음은 코드입니다. 먼저 XAML :

<Page
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:CartographerYou"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:Custom="using:Windows.UI.Xaml.Controls.Maps"
    x:Class="CartographerYou.MainPage"
    mc:Ignorable="d"
    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}" Loaded="Page_Loaded">

    <Grid x:Name="grd">
        <Button x:Name="btnLoadMap" Content="Load Map" Margin="20,12,50,0" VerticalAlignment="Top" Click="btnLoadMap_Click" />
        <Button x:Name="btnCre8NewMap" Content="Create New Map" Margin="140,12,50,0" VerticalAlignment="Top" Click="btnCre8NewMap_Click"/>
        <Button x:Name="btnAddLoc" Content="Add Location" Margin="280,12,50,50" VerticalAlignment="Top" Click="btnAddLoc_Click"/>
        <Button x:Name="btnRemoveLoc" Content="Remove Location" Margin="400,12,0,0" VerticalAlignment="Top" Click="btnRemoveLoc_Click"/>
        <Button x:Name="btnPrint" Content="Print Map" Margin="570,12,0,0" VerticalAlignment="Top" Click="btnPrint_Click"/>
        <Button x:Name="btnSave" Content="Save Map Image" Margin="670,12,0,0" VerticalAlignment="Top" Click="btnSave_Click"/>
        <TextBlock x:Name="txtBlckMapType" HorizontalAlignment="Left" Margin="800,16,0,0" Text="Map Style: " TextWrapping="Wrap" VerticalAlignment="Top" FontWeight="Bold"/>
        <TextBlock x:Name="txtBlckCurrentMap" HorizontalAlignment="Left" Margin="1040,16,0,0" Text="Current Map: " TextWrapping="Wrap" VerticalAlignment="Top" FontWeight="Bold"/>
        <TextBlock x:Name="txtBlckLegend" HorizontalAlignment="Left" Margin="20,960,0,0" Text="LEGEND:" TextWrapping="Wrap" VerticalAlignment="Top" FontWeight="Bold" FontSize="14"/>
        <TextBlock x:Name="txtBlckRed" HorizontalAlignment="Left" Margin="90,960,0,0" Text="Red markers " TextWrapping="Wrap" VerticalAlignment="Top"/>
        <TextBlock x:Name="txtBlckOrange" HorizontalAlignment="Left" Margin="193,960,0,0" Text="Orange markers " TextWrapping="Wrap" VerticalAlignment="Top"/>
        <TextBlock x:Name="txtBlckYellow" HorizontalAlignment="Left" Margin="296,960,0,0" Text="Yellow markers " TextWrapping="Wrap" VerticalAlignment="Top"/>
        <TextBlock x:Name="txtBlckGreen" HorizontalAlignment="Left" Margin="399,960,0,0" Text="Green markers " TextWrapping="Wrap" VerticalAlignment="Top"/>
        <TextBlock x:Name="txtBlckBlue" HorizontalAlignment="Left" Margin="502,960,0,0" Text="Blue markers " TextWrapping="Wrap" VerticalAlignment="Top"/>
        <TextBlock x:Name="txtBlckIndigo" HorizontalAlignment="Left" Margin="605,960,0,0" Text="Indigo markers " TextWrapping="Wrap" VerticalAlignment="Top"/>
        <TextBlock x:Name="txtBlckViolet" HorizontalAlignment="Left" Margin="708,960,0,0" Text="Violet markers " TextWrapping="Wrap" VerticalAlignment="Top"/>
        <TextBlock x:Name="txtBlckBlack" HorizontalAlignment="Left" Margin="811,960,0,0" Text="Black markers" TextWrapping="Wrap" VerticalAlignment="Top"/>
        <TextBlock x:Name="txtBlckWhite" HorizontalAlignment="Left" Margin="914,960,0,0" Text="White markers " TextWrapping="Wrap" VerticalAlignment="Top"/>
        <TextBlock x:Name="txtBlckGray" HorizontalAlignment="Left" Margin="1017,960,0,0" Text="Gray markers " TextWrapping="Wrap" VerticalAlignment="Top"/>
        <Custom:MapControl x:Name="map" Margin="0,50,0,50" MapServiceToken="Gr8GooglyMoogly" />
        <ComboBox x:Name="cmbxMaptype" Margin="876,12,0,0" Width="160" DropDownClosed="cmbxMaptype_DropDownClosed"/>
    </Grid>
</Page>

... 그런 다음 코드 비하인드가 베어링을 가질 수 있습니다.

private void Page_Loaded(object sender, RoutedEventArgs e)
{
    txtBlckRed.Foreground = new SolidColorBrush(Windows.UI.Colors.Red);
    txtBlckOrange.Foreground = new SolidColorBrush(Windows.UI.Colors.Orange);
    txtBlckYellow.Foreground = new SolidColorBrush(Windows.UI.Colors.Yellow);
    txtBlckGreen.Foreground = new SolidColorBrush(Windows.UI.Colors.Green);
    txtBlckBlue.Foreground = new SolidColorBrush(Windows.UI.Colors.Blue);
    txtBlckIndigo.Foreground = new SolidColorBrush(Windows.UI.Colors.Indigo);
    txtBlckViolet.Foreground = new SolidColorBrush(Windows.UI.Colors.Violet);
    txtBlckBlack.Foreground = new SolidColorBrush(Windows.UI.Colors.Black);
    txtBlckWhite.Foreground = new SolidColorBrush(Windows.UI.Colors.White);
    txtBlckGray.Foreground = new SolidColorBrush(Windows.UI.Colors.Gray);    
}

답변

1 RoyLi-MSFT Nov 27 2020 at 02:58

동작의 이유 margin는 TextBlocks 의 속성에 대한 절대 값을 설정하기 때문입니다. 값이 너무 커서 이러한 TextBlock의 위치가 앱의 가시적 레이아웃을 벗어났습니다. 즉, 레이아웃이 조정되지 않습니다.

다음은 레이아웃을 수정하는 간단한 방법입니다.

 <Grid x:Name="grd">
   <!--Add row definitions-->
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="*"/>
        <RowDefinition Height="Auto"/>
    </Grid.RowDefinitions>
    <!--top area controls-->
    <Button x:Name="btnLoadMap" Content="Load Map" Margin="20,12,50,0" VerticalAlignment="Top" Click="btnLoadMap_Click" />
    <Button   x:Name="btnCre8NewMap" Content="Create New Map" Margin="140,12,50,0" VerticalAlignment="Top" Click="btnCre8NewMap_Click"/>
    <Button   x:Name="btnAddLoc" Content="Add Location" Margin="280,12,50,50" VerticalAlignment="Top" Click="btnAddLoc_Click"/>
    <Button   x:Name="btnRemoveLoc" Content="Remove Location" Margin="400,12,0,0" VerticalAlignment="Top" Click="btnRemoveLoc_Click"/>
    <Button    x:Name="btnPrint" Content="Print Map" Margin="570,12,0,0" VerticalAlignment="Top" Click="btnPrint_Click"/>
    <Button   x:Name="btnSave" Content="Save Map Image" Margin="670,12,0,0" VerticalAlignment="Top" Click="btnSave_Click"/>
    
    <TextBlock x:Name="txtBlckMapType" HorizontalAlignment="Left" Margin="800,16,0,0" Text="Map Style: " TextWrapping="Wrap" VerticalAlignment="Top" FontWeight="Bold"/>
    <TextBlock x:Name="txtBlckCurrentMap" HorizontalAlignment="Left" Margin="1040,16,0,0" Text="Current Map: " TextWrapping="Wrap" VerticalAlignment="Top" FontWeight="Bold"/>
    <ComboBox  x:Name="cmbxMaptype" Margin="876,12,0,0" Width="160" DropDownClosed="cmbxMaptype_DropDownClosed"/>
     <!--map controls-->
    <Maps:MapControl Grid.Row="1" x:Name="MapControl1" Style="Terrain"  />
    <!--bottom area controls-->
    <TextBlock x:Name="txtBlckLegend" HorizontalAlignment="Left"   Grid.Row="2" Margin="20,12,0,0" Text="LEGEND:" TextWrapping="Wrap" VerticalAlignment="Top" FontWeight="Bold" FontSize="14"/>
    <TextBlock x:Name="txtBlckRed" HorizontalAlignment="Left"  Grid.Row="2" Margin="90,12,0,0" Text="Red markers " TextWrapping="Wrap" VerticalAlignment="Top"/>
    <TextBlock x:Name="txtBlckOrange" HorizontalAlignment="Left"  Grid.Row="2" Margin="193,12,0,0" Text="Orange markers " TextWrapping="Wrap" VerticalAlignment="Top"/>
    <TextBlock x:Name="txtBlckYellow" HorizontalAlignment="Left"  Grid.Row="2" Margin="296,12,0,0" Text="Yellow markers " TextWrapping="Wrap" VerticalAlignment="Top"/>
    <TextBlock x:Name="txtBlckGreen" HorizontalAlignment="Left"  Grid.Row="2" Margin="399,12,0,0" Text="Green markers " TextWrapping="Wrap" VerticalAlignment="Top"/>
    <TextBlock x:Name="txtBlckBlue" HorizontalAlignment="Left"  Grid.Row="2" Margin="502,12,0,0" Text="Blue markers " TextWrapping="Wrap" VerticalAlignment="Top"/>
    <TextBlock x:Name="txtBlckIndigo" HorizontalAlignment="Left"  Grid.Row="2" Margin="605,12,0,0" Text="Indigo markers " TextWrapping="Wrap" VerticalAlignment="Top"/>
    <TextBlock x:Name="txtBlckViolet" HorizontalAlignment="Left"  Grid.Row="2" Margin="708,12,0,0" Text="Violet markers " TextWrapping="Wrap" VerticalAlignment="Top"/>
    <TextBlock x:Name="txtBlckBlack" HorizontalAlignment="Left"  Grid.Row="2" Margin="811,12,0,0" Text="Black markers" TextWrapping="Wrap" VerticalAlignment="Top"/>
    <TextBlock x:Name="txtBlckWhite" HorizontalAlignment="Left"  Grid.Row="2" Margin="914,12,0,0" Text="White markers " TextWrapping="Wrap" VerticalAlignment="Top"/>
    <TextBlock x:Name="txtBlckGray" HorizontalAlignment="Left"  Grid.Row="2" Margin="1017,12,0,0" Text="Gray markers " TextWrapping="Wrap" VerticalAlignment="Top"/>
    
</Grid>

내가 한 일은 Grid를 세 개의 행으로 나누고 컨트롤이 올바른 행에 배치되었는지 확인하는 것입니다. Grid.Row="2"이 TextBlocks이 맨 아래에있는 마지막 행에 표시되도록 TextBlocks를 추가 했습니다.

UWP 앱의 양식 / 페이지가 런타임에 잘리는 이유는 무엇인가요 (디자인 타임 크기를 반영하지 않음)?

최신 정보

업데이트 2

답변