Nativescript aligment in GridLayout question?


#1

Hello guys I have a quick question
I have a layout like this

<GridLayout rows="*" columns="auto,10,15,15,*" class="black m-y-auto">
                                                  <Label col="0" class="time" text="10:15" />
                                                  <Label col="2" text="phone" >
                                                  <Label col="4" class="caller" text="Test username reallly longggggggggggggggggg" textWrap="true" />
</GridLayout>

time and phone will always have same height and I also
want all of it vertical centered, but when caller is too long it will push all of them down how can I fix that ??


#2

Try setting verticalAlignment to center.


#3

Are you looking for something like this?

<GridLayout backgroundColor="red" rows="*" columns="auto, auto, auto" class="black m-y-auto" horizontalAlignment="center">
		<Label col="0" class="time" text="10:15" padding="5" />
		<Label col="1" text="phone" padding="5" />
		<Label col="2" class="caller" text="Test username reallly longggggggggggggggggg" textWrap="true" padding="5" />
</GridLayout>

Pro Tip: don’t use empty columns just to create spacers. Instead, rely on Padding/Margin.
Because those spacers you make can get messy and confusing real quick.