为什么GridLayout覆盖整个屏幕？

Question

我有以下HTML代码：

<GridLayout>
  <GridLayout #background class="background">
  </GridLayout>

  <StackLayout #initialContainer class="initial-container">
    <Image src="res://logo_login">
    </Image>
    ....
    ....
  </StackLayout>
</GridLayout>

我的问题是关于带有background类的GridLayout。

这是班级的CSS：

.background {
  background-image: url("res://apple");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}

显然它是实际的背景（这里的橙色背景，而不是徽标！）。

问题 我不明白GridLayout为什么会覆盖整个屏幕。即使它确实如此，我也期待StackLayout在GridLayout之后。我已经知道background-size:cover涵盖了整个空间，但为什么GridLayout也覆盖了整个屏幕？为什么当徽标和标题不在我的CSS中时，它们显示为绝对定位？

Answer 1

你的外部布局是GridLayout，如果你没有指定行和列，布局中的任何布局或项目将在最左上方的网格单元格中相互堆叠，分层以便它们在HTML。要解决此问题，请将外部布局交换为StackLayout