Technology Blogs by Members
Explore a vibrant mix of technical expertise, industry insights, and tech buzz in member blogs covering SAP products, technology, and events. Get in the mix!
cancel
Showing results for 
Search instead for 
Did you mean: 
Dhanasupriya
Active Participant
Hello All

This post is on the line breaks using SAP UI5 controls. We might have requirements to display wide range of information in 2-3 lines in order to avoid occupying the whole screen for better look & feel and UI experiences in SAP UI5 applications. Here is the demo for such needs and can be achieved using line feed and carriage return.

It's always a best practice to use the combination of line feed and carriage return.

  • Line feed: moving the test to next line.

  • Carriage return: a space between the words.


Line Breaks using line feed and carriage return in <ViewName>.view.xml,  <FragmentName>.fragment.xml:Line Breaks using line feed and carriage return in <ViewName>.view.js,  <FragmentName>.fragment.js, <ControllerName>.controller.js, i18n files.i18n:sap.m.Label: For Label, set wrapping property to true. Line break would work in combination with wrapping and \r\n.
	<Label text="{i18n>Label}" wrapping="true" />

sap.m.<control>: Tooltip for SAP UI5 controls:
	<Button text="Tooltip" tooltip="{i18n>Label}" />

sap.m.Text:
	<Text text="{i18n>Label}" />

sap.m.MessageStrip:sap.m.MessageStrip
<MessageStrip text="{i18n>MessageStrip}"  enableFormattedText="true"/>

i18n: key-values for sap.m.MessageStrip:
MessageStrip=Default <em>(Information)</em> with default icon and <strong>close button</strong>:

sap.m.FormattedText: sap.m.FormattedText

Output:Thank you!!

#EnhanceLearning

BR// Dhanasupriya Sidagam
4 Comments
Labels in this area