Flex Layout , Xamarin Forms one image with three labels - forms

Question

Trying to put one image and three label in a row with multiple columns just using flex layout and without nested flex layout, need some help.
<XF.FlexLayout direction="Column">
<XF.CollectionView itemsSource={Bind.oneWay(() => this.viewModel.list)}
itemsLayout="VerticalList">
<XF.CollectionView.itemTemplate>
<XF.FlexLayout {...XF.FlexLayout.grow(1)}>
<XF.Label margin="10, 10, 10, 10" text={Bind.twoWays((x) => x.data.name)}
fontAttributes="Bold" fontSize={18}/>
<XF.Label text={Bind.twoWays((x) => x.data.description)}
fontSize={16} />
<XF.Label text={Bind.twoWays((x) => x.data.price)}
fontSize={16} />
<XF.ImageButton margin="10, 10, 10, 10" widthRequest={80} heightRequest={120} {...XF.FlexLayout.basis(100)}
source={Bind.twoWays((x) => x.data.url)}
aspect="AspectFill"
{...XF.FlexLayout.order(-1)} />
<XF.Button {...XF.FlexLayout.basis(150)}
margin="10, 10, 10, 10"
heightRequest={50}
widthRequest={150}
text="Details"
borderRadius="6"
backgroundColor="#F26857"
borderColor="#F26857"
borderWidth={2}
textColor={Colors.white} />
</XF.FlexLayout>
</XF.CollectionView.itemTemplate>
</XF.CollectionView>
</XF.FlexLayout>
</XF.ContentPage>

Answer 1

You can use Grid to achieve it:
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="50" />
<ColumnDefinition Width="50" />
<ColumnDefinition Width="50" />
<ColumnDefinition Width="50" />
</Grid.ColumnDefinitions>
<Image Grid.Row="0" Grid.Column="1" />
<Label text="lbl1" Grid.Row="0" Grid.Column="2" />
<Label text="lbl2" Grid.Row="0" Grid.Column="3" />
<Label text="lbl3" Grid.Row="0" Grid.Column="4" />
</Grid>