10
Views
1
Comments
Solved
Dynamically Change Font Size of Text in a Web Block
Application Type
Mobile
Service Studio Version
10.0.1022.0
Platform Version
10.0.1023.0

We have a mobile application where we use a web block to display information. This web block has a text area and the text is updated based on the rest api result. It was smooth till the text length is small (within 20 chars). But now, the text length is increasing (more than 40 char) due to which the text area within the web block is bulky when rendered with the dynamic information. Is there any way to resize the font to smaller size when the number of characters exceed a specific length?

In the below example, you can see, the column1 characters increase, but it is dragging down and the column 2 is static and not looking as clean UI. I want to reduce the size of font in column1 when the characters increase then a specific length. Is there also a way to center the column2 according to the length of the the column1? Thanks in advance!


Rank: #70
Solution

Hi Somesh,


You can use the length of the text to determine the size of the font.

Take a look at an example:


In this example, if the expression has a length below 20, the font-size will be 16px, otherwise it will be 12px.

You can adapt to the values of your use case.


Hope it helps.


Cheers,
João