cancel
Showing results for 
Search instead for 
Did you mean: 

Infolabel values in Row format

tamilselvanm
Participant
0 Kudos

Hi Guys,

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

Currently the data is in array format.

Kindly help.

Regards,

Tamilselvan

Accepted Solutions (0)

Answers (3)

Answers (3)

ssrinivas
Advisor
Advisor
0 Kudos

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
Participant
0 Kudos

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
Advisor
Advisor
0 Kudos

Use justifyContent="SpaceBetween" at FlexBox

ssrinivas
Advisor
Advisor
0 Kudos

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
Participant
0 Kudos

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
Advisor
Advisor
0 Kudos

justifyContent="SpaceBetween" at FlexBox

yogananda
Product and Topic Expert
Product and Topic Expert
0 Kudos

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
Participant
0 Kudos

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