Android GridLayout中的Nativescript垂直对齐不工作

Android GridLayout中的Nativescript垂直对齐不工作,android,css,mobile,nativescript,Android,Css,Mobile,Nativescript,在nativescript中,我对GridLayout中的StackLayout有一些问题。我无法在StackLayout center垂直对齐标签 以下是我想要实现的一幅图片: 在这里你可以看到,我想要感叹号图标垂直居中 但不幸的是,我一直得到这个: 以下是我使用的代码: tns.html <GridLayout class="formMessage warning" columns="auto,*" rows="auto"> <StackLayout col="0"

在nativescript中,我对GridLayout中的StackLayout有一些问题。我无法在StackLayout center垂直对齐标签

以下是我想要实现的一幅图片:

在这里你可以看到,我想要感叹号图标垂直居中

但不幸的是,我一直得到这个:

以下是我使用的代码:

tns.html

<GridLayout class="formMessage warning" columns="auto,*" rows="auto">
  <StackLayout col="0" class="formMessageIcon">
    <Label class="icon fa" [text]="'fa-exclamation-circle' | fonticon"></Label>
  </StackLayout>
  <Label col="1" class="formMessageText" text="lorem ipsum dolor sit amet lorem ipsum dolor sit amet lorem ipsum dolor sit amet" textWrap="true"></Label>
</GridLayout>
如何修复图标居中?我做错了什么?多谢各位

下面是我将如何改变它,使其发挥作用

<GridLayout class="formMessage warning" columns="auto,*" rows="auto">
    <Label col="0" class="iconbkg" text=""></Label>
    <Label col="0" class="icon fa" [text]="'fa-exclamation-circle' | fonticon"></Label>
    <Label col="1" class="formMessageText" text="lorem ipsum dolor sit amet lorem ipsum dolor sit amet lorem ipsum dolor sit amet" textWrap="true"></Label>
</GridLayout>
这种布局的优点是,它实际上比使用StackLayout占用的资源更少;并简化您的处理


诀窍是对不打印任何文本的背景使用普通的
标签
(使用.iconbkg类);然后把你的心放在中间!在另一个
标签中,它们都位于数据网格的第0列

您可以尝试将verticalAlignment=“center”添加到StackLayout中,也可以尝试将两个列都设置为=“,”而不是“自动”*?尝试在
StackLayout中指定标签的
高度
当我将verticalAlignment=“center”添加到StackLayout中时,左侧部分不会填充红色,只需将其挤压到中心即可,使用图标。所以它将居中,而不仅仅是图标。我将尝试添加图标的高度,谢谢,我们将看到它。(此外,如果我向StackLayout添加了指定的高度,则问题会消失,但它应该是动态的,取决于lorem ipsum标签。最小高度没有帮助。:()添加图标(标签)的高度没有帮助。:(非常感谢,这是一个非常聪明的方法来解决这个问题!我的工作非常完美。是的,从那时起,框架已经修复了很多类似的问题。
vertical align
现在应该可以正常工作了。。。
<GridLayout class="formMessage warning" columns="auto,*" rows="auto">
    <Label col="0" class="iconbkg" text=""></Label>
    <Label col="0" class="icon fa" [text]="'fa-exclamation-circle' | fonticon"></Label>
    <Label col="1" class="formMessageText" text="lorem ipsum dolor sit amet lorem ipsum dolor sit amet lorem ipsum dolor sit amet" textWrap="true"></Label>
</GridLayout>
.formMessage {
    width: 100%;
    border-width: 2;
    border-color: #ff344e;
}

.iconbkg {
    width: 30;
    background-color: red;
    margin-right: 2;
}

.icon {
    width: 30;
    vertical-align: center;
    text-align: center;
    margin-right: 2;
    font-size: 18;
    color: #2b3535;
}

.formMessageText {
    padding: 5 8;
    color: #ff344e;
}