CODEWITHSUNDEEP
nativescriptnativescript-vue
yoyojs
yoyojs

Reputation: 1783

centering a label in a FlexboxLayout of nativescript-vue

In a flexbox layout i want to have an image on the left and a center label title on the right :

  <FlexboxLayout backgroundColor="#bada55" justifyContent="space-between" height="300" class="head">
    <Image :src="posts.image_url" stretch="aspectFit" class="head_img"/>
    <Label :text="posts.product_name" alignSelf="center" alignContent="center" class="title" textWrap="true"/>
  </FlexboxLayout>

in my case the label text is going to the right but is not center, any idea on how to do that ?

Upvotes: 1

Views: 363

Answers (1)

Matt Saravitz
Matt Saravitz

Reputation: 111

You can add textAlignment="center" to the label.

 <FlexboxLayout backgroundColor="#bada55" justifyContent="space-between" height="300" class="head">
         <Image :src="posts.image_url" stretch="aspectFit" class="head_img"/>
         <Label :text="posts.product_name" alignSelf="center" alignContent="center" textAlignment="center" class="title" textWrap="true"/>
</FlexboxLayout>

Upvotes: 1

Related Questions