0

我正在尝试为 Windows 10 开发一个应用程序。但是对于所有新的屏幕大小,我似乎无法弄清楚如何让一个元素适合设备屏幕的当前大小。

例如,如果您调整它的大小,我希望 TextBlock 适合窗口的宽度。我已经尝试过 ViewBox、VariableSizedWrapGrid 等,但似乎没有什么能解决我的问题。有谁知道? 在此处输入图像描述

更新:这是我试图适应下面窗口大小的搜索框。如果我在其上放置背景颜色,则网格会填充整个窗口,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>
4

2 回答 2

13

当您使用RelativePanel时,您可能希望设置AlignLeftWithPanel并使AlignRightWithPanel = true整个水平空间可用于TextBlock(类似地AlignTopWithPanelAlignBottomWithPanel=true用于垂直)。大多数UIElements都有HorizontalAlignment/VerticalAlignment = Stretch作为默认值,但您可能还需要明确设置它以确保在TextBlock屏幕上拉伸的实际视觉效果。

调整窗口大小时,元素将使用上述设置自动调整大小。你不需要在ViewBox这里使用来实现这一点。

于 2015-05-04T22:42:57.813 回答
0

要让 FrameworkElement 拉伸以填充其容器,请将其Horizo ​​ntalAlignment 设置为 Stretch。使用 TextBlock 很难看到这一点,因为它没有背景,而且 TextBlock 中的文本不会拉伸。如果要拉伸文本,可以在周围的 ViewBox 上添加 Horizo​​ntalAlignment。

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

要检查的另一件事是您的 TextBlock 所在的容器是否填充了窗口。如果您不覆盖它,大多数默认情况下会这样做。

于 2015-05-04T07:22:14.127 回答