c# - 如果不直接在窗口中居中，图像就会消失 [Margin not "0"]

Question

我在基于 WPF Vb.net 的窗口中的图像有一点问题。
如果图像控件不直接位于边距为 0 的窗口中心，则在运行时不会显示。

这是两个图像的 XAML 代码:

    <Image x:Name="loaderlogo" Height="55" Margin="1825,985,40,40" Width="55" Stretch="Fill"/>
    <Image x:Name="tips" Height="128" Margin="0,732,0,220" Width="1920" Stretch="Fill" Opacity="0.9"/>

两者都包含在一个单行一列的网格中(创建新窗口时默认的网格)。

如果运行此代码，这些图像将不会出现，但是如果我制作边距

Margin="0"

它们看起来很好，但在控件的正中央

如果边距不为零(如果我将图像的位置移动到表单中心以外的任何位置，我怎样才能使控件仍然出现？

我用来获取图像文件的代码是:

    UseLayoutRounding = True
    Dim exepath As String = System.AppDomain.CurrentDomain.BaseDirectory
    loaderlogo.Source = New BitmapImage(New Uri(exepath & "loaderlogo.png", UriKind.Absolute))
    tips.Source = New BitmapImage(New Uri(exepath & "tips.png", UriKind.Absolute))

图像在死点时工作得很好所以我相信问题出在 XAML 但我不确定在哪里。我已经更改了水平/垂直对齐方式，但只要边距为 0，图像仍会出现在中心。

编辑:下面是我希望控件所在的位置，左下角是“loaderlogo”，窗口上的带是“提示”控件。

tips band position

loaderlogo position

编辑 2:下面是窗口的完整 XAML 代码:

<Window x:Class="loadingwindow" UseLayoutRounding="True"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:local="clr-namespace:applicationname"
    mc:Ignorable="d"
    Title="loadingwindow" Height="1080" Width="1920" AllowsTransparency="True" WindowStyle="None" ResizeMode="NoResize" WindowStartupLocation="CenterScreen" WindowState="Maximized" Loaded="Window_Loaded">
<Window.Triggers>
    <EventTrigger RoutedEvent="Window.Loaded">
        <BeginStoryboard>
            <Storyboard>
                <DoubleAnimation Duration="00:00:01" Storyboard.TargetProperty="Opacity" From="0" To="1" Completed="DoubleAnimation_Completed"/>
            </Storyboard>
        </BeginStoryboard>
    </EventTrigger>

</Window.Triggers>
<Grid>
    <Image x:Name="loaderlogo" Height="55" Margin="1825,985,40,40" Width="55" Stretch="Fill"/>
    <Image x:Name="tips" Height="128" Margin="0,732,0,220" Width="1920" Stretch="Fill" Opacity="0.9"/>

</Grid>

Answer 1

大边距是最糟糕的元素定位方式。更好的方法是使用正确的布局面板和正确的元素对齐方式。小边距可以在元素之间添加一些空间。

Grid 面板通常与许多 RowDefinition 和 ColumnDefinition 一起使用。元素被放置在不同的行和列中，并且生成的布局自适应大小变化

<Grid>
  <Grid.RowDefinitions>
    <RowDefinition/>
    <RowDefinition Height="Auto"/>
    <RowDefinition Height="Auto"/>
  </Grid.RowDefinitions>

  <Image x:Name="tips" Grid.Row="1" Height="128" Width="1920" Stretch="Fill" Opacity="0.9"/>
  <Image x:Name="loaderlogo" Grid.Row="2" Height="55" Width="55" Margin="10"
         HorizontalAlignment="Right" Stretch="Fill"/>
</Grid>