Nativescript内部StackLayout

Question

大家好，大家好，我正在尝试制作内部StackLayouts，但是第二个StackLayout位于第一个StackLayout的顶端，所以我看不出第二个StackLayout应该如何处理，或者是否有其他方法

这里是我的代码

<StackLayout orientation="horizontal">
    <StackLayout width="500">
         <GridLayout columns="50, *" rows="*" width="500" height="50" 
         verticalAlignment="top">
               <Label text="Name" row="0" col="0" backgroundColor="red">
               </Label>
               <Label text="Fol" row="0" col="1" class="alignRight" 
               backgroundColor="blue"></Label>
         </GridLayout>
    </StackLayout>

      <StackLayout orientation="horizontal" width="500" height="180"> 
           <Image src="http://lorempixel.com/400/200" width="500" left="10" 
           top="30">
           </Image>
      </StackLayout>
</StackLayout>

谢谢

Answer 1

首先，我会删除widths以查看页面的显示方式。500是一个非常大的价值。只有大的药片才能支持这一点。作为一个例子，我首先尝试这样做：

<GridLayout columns="auto, auto">
    <GridLayout col="0" columns="50, *" rows="*" verticalAlignment="top">
          <Label text="Name" row="0" col="0" backgroundColor="red">
          </Label>
          <Label text="Fol" row="0" col="1" class="alignRight" 
               backgroundColor="blue"></Label>
    </GridLayout>
    <Image col="1" src="http://lorempixel.com/400/200" left="10" op="30">
    </Image>      
</GridLayout>

在您看到两个部分水平对齐后，可以开始调整宽度。