小编ans*_*777的帖子

GridLayout中的Nativescript垂直对齐无法正常工作

在nativescript中,StackLayout存在GridLayout中的一些问题.我无法在StackLayout中心垂直对齐Label.

这是我想要实现的图片:

在此输入图像描述

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

但不幸的是我一直这样:

在此输入图像描述

这是我使用的代码:

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>
Run Code Online (Sandbox Code Playgroud)

CSS

.formMessage {
  width: 100%;
  border-width: 2;
  border-color: #ff344e;
}

.formMessageIcon {
  background-color: #ff344e;
  width: 30;
}

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

.formMessageText {
  padding: 5 8;
  color: #ff344e;
}
Run Code Online (Sandbox Code Playgroud)

如何修复图标居中?我做错了什么?非常感谢你!

css mobile android nativescript

6
推荐指数
1
解决办法
3323
查看次数

标签 统计

android ×1

css ×1

mobile ×1

nativescript ×1