Question

我想在屏幕左上角放置一张图片。和放置图像的同一行中心的TextBlock。屏幕顶部的方法应该是左边的图像和中心的TextBlock。我尝试过如下。但是图像和TextBlock似乎都在中心对齐。

<StackPanel Orientation="Horizontal" HorizontalAlignment="Center" Background="AliceBlue" VerticalAlignment="Top">
    <Image x:Name="icon_goback2" Source="Assets/icon_home.png" Margin="10,0,0,0" Height="50" Width="50" />
    <TextBlock Text="Your Page" HorizontalAlignment="Center" FontWeight="Bold" Foreground="White" FontSize="70" />
</StackPanel>

Answer 1

您可以尝试以下代码：

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition/>
        <ColumnDefinition/>
        <ColumnDefinition/>
    </Grid.ColumnDefinitions>
    <Image x:Name="icon_goback2" Source="Assets/icon_home.png" Margin="10,0,0,0" Height="50" Width="50"/>
    <TextBlock Grid.Column="1" Text="Your Page" HorizontalAlignment="Center" FontWeight="Bold" Foreground="White" FontSize="70"/>
</Grid>

此代码的作用是将您的网格划分为3列，并将<Image>放入1 ^st列（Grid.Column="0"）和<TextBlock>中2 ^nd列（Grid.Column="1"）。如果需要，您还可以更改Image和Texblock的对齐方式。

另外，值得注意的是，当您将其方向设置为水平时，StackPanel将始终覆盖子元素的水平对齐方式。这就是为什么在这样的场景中使用网格并将其划分为多行和多列的原因。

修改： 由于您有相当大的文本块，您可以将列定义更改为以下内容：

<Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto"/>
        <ColumnDefinition Width="Auto"/>        
 </Grid.ColumnDefinitions>

这会将您的网格划分为2个部分，并自动设置列宽。

希望这有帮助。

Answer 2

只需使用<key>NSAppTransportSecurity</key> <dict>  <key>NSAllowsArbitraryLoads</key> <true/> </dict>并将Grid设为HorizontalAlignment，将Left设为Center和Image

TextBlock

将TextBlock和图像对齐在屏幕顶部 - uwp

2 个答案: