Установить ширину элемента текущего экрана в универсальном приложении

Question

Я пытаюсь разработать приложение для Windows 10. Но со всеми новыми экранами я не могу понять, как получить элемент, соответствующий текущему размеру экрана устройства.

Например, я хочу, чтобы TextBlock соответствовал ширине окна, если вы измените его размер. Я пробовал ViewBox, VariableSIzedWrapGrid и т. Д., Но ничего не исправляет мою проблему. Кто-нибудь знает?

Update: Это SearchBox я стараюсь, чтобы соответствовать размеру окна ниже. Сетка заполняет все окно, так же как и RelativePanel, если я поместил на него цвет фона. Но SearchBox отказывается растягиваться ... Я не хочу, чтобы поисковая система масштабировалась по размеру, просто ее ширина соответствовала ширине окна/устройства.

 <!-- SEARCH GRID --> 
    <Grid Canvas.ZIndex="5" x:Name="GridSearchPackage" HorizontalAlignment="Stretch" Visibility="Visible" Opacity="0.85" Background="White"> 
     <RelativePanel HorizontalAlignment="Stretch" Margin="5,5,0,0" > 
      <Button x:Name="ButtonBackSearchGrid" Height="36" Width="36" FontSize="10" Margin="0,7,5,0" 
        Style="{StaticResource BackButtonStyle}" 
        Click="ButtonBackSearchGrid_Click" 
        AutomationProperties.Name="Back" 
        AutomationProperties.AutomationId="BackButton" 
        AutomationProperties.ItemType="Navigation Button" BorderBrush="Black" BorderThickness="3"> 
       <FontIcon x:Name="backButtonIcon" FontWeight="Bold" FontSize="20" Foreground="{StaticResource AppDarkBlueColor}" Glyph="&#xE72B;" /> 
      </Button> 
      <TextBlock x:Name="TextBlockPopupSearchTitle" RelativePanel.RightOf="ButtonBackSearchGrid" Foreground="{StaticResource AppDefaultBlueColor}" Text="Search XZY" FontSize="34"/> 
      <SearchBox FontSize="20" RelativePanel.Below="TextBlockPopupSearchTitle" HorizontalAlignment="Stretch" PlaceholderText="search" Margin="0,10,0,0" QuerySubmitted="SearchBox_QuerySubmitted" QueryText="{Binding SearchText, Mode=TwoWay}"/> 
     </RelativePanel> 
    </Grid> 

Answer 1

При использовании RelativePanel, вы можете захотеть установить AlignLeftWithPanel и AlignRightWithPanel = true, чтобы сделать все горизонтальное пространство, доступным для TextBlock (и аналогично AlignTopWithPanel, AlignBottomWithPanel=true для вертикального). Большинство UIElements имеют HorizontalAlignment/VerticalAlignment = Stretch по умолчанию, но вы можете также установить это явно, чтобы убедиться, что фактическое изображение TextBlock растянуто по всему экрану.

При изменении размера окна элемент будет автоматически изменять размер, используя указанные выше настройки. Для этого вам не нужно использовать ViewBox.

Answer 2

Чтобы позволить FrameworkElement растянуть, чтобы заполнить его контейнер установить его HorizontalAlignment растягиваться. Трудно это увидеть с помощью TextBlock, хотя, поскольку он не имеет фона и текст в TextBlock не растягивается. Вы можете добавить HorizontalAlignment на окружающий ViewBox, если хотите растянуть текст.

<ViewBox HorizontalAlignment="Stretch" VerticalAlignment="Top" Stretch="Uniform"> 
    <TextBlock Text="Lorem ipsum dolor sit Amet" /> 
</ViewBox> 

Другое, что нужно проверить, заключается в том, что контейнер, в котором находится TextBlock, заполняет окно. Большинство будет по умолчанию, если вы не переопределите его.