Infolabel values in Row format

[tamilselvanm]

Hi Guys,

I need to display the info labels in this below format.

Currently the data is in array format.

Kindly help.

Regards,

Tamilselvan

[ssrinivas]

Hello tamilselvanm,

Please find the details below.

1. I need to give the space between the values - Use property alignContent="SpaceBetween"

2. All the values are displaying in the same line. How we can display the values in multiple lines - Use property wrap="Wrap"
API Reference - FlexBox

Srinivas

PS : Mark as solution provided if the case is solved. So we can close it. Thank you

[tamilselvanm]

Hi Srinivas,

I already used the property alignContent="SpaceBetween" but it does not work.

<FlexBox direction="Inherit" id="_IDGenFlexBox1" items="{orgContext>/}" wrap="Wrap" width="auto" height="auto" alignContent="SpaceBetween">

<items>

<tnt:InfoLabel id="_IDGenInfoLabel1" text="{orgContext>value_text}" colorScheme="{orgContext>ColorScheme}" width="auto" />

</items>

</FlexBox>

There is no space between info label values.

Regards,

Tamilselvan

[ssrinivas]

Use justifyContent="SpaceBetween" at FlexBox

[ssrinivas]

Hello tamilselvanm ,

Your "orgContext" model is structured as an array of objects, making it suitable for aggregation binding. However, if you intend to bind a single object, it's recommended to employ property binding.

Aggregation Binding

<FlexBox items="Your Model Goes here">
<items>
<tnt:InfoLabeltext="{ModelName>value_text}" colorScheme="{ModelName>ColorScheme}"/>
</items>
</FlexBox>

To address your specific issue, ensure that you accurately specify the path. For instance:

<tnt:InfoLabel id="idInfoLabel" text="{orgContext>/n/value_text}" colorScheme="{orgContext>/n/ColorScheme}"/>

In the provided example, "\n\" [0,1,2 ...... ]represents the object index within the array. Please make sure to adjust the path accordingly for your use case.

[tamilselvanm]

Hi Srinivas,

I am able to display the info labels like below.

1. I need to give the space between the values

2. All the values are displaying in the same line. How we can display the values in multiple lines.

Regards,

Tamilselvan

[ssrinivas]

justifyContent="SpaceBetween" at FlexBox

[yogananda]

tamilselvanm

To show in Horizontal line ... I would build it through sap.m.HBox

there are some samples in https://ui5.sap.com/#/controls

[tamilselvanm]

Hi Yoganandha,

I have used the below syntax to display the info label values. The named model is orgContext and the data is array format. Even though the data is available in Model but it is not displaying in the view.

XML View

<HBox>

<tnt:InfoLabel id="idInfoLabel" text="{orgContext>value_text}" colorScheme="{orgContext>ColorScheme}"/>

</HBox>

Model Data

How the named model data can be displayed in the info label?

Regards,

Tamilselvan