cancel
Showing results for 
Search instead for 
Did you mean: 
TuongDoan

Managing Font Size Consistency Between Classic and Modern Controls Across Canvas App

One challenge when creating a modern-looking canvas app is that we have a mixed usage of classic and modern controls, and you may notice that the text in modern controls appears smaller than in classic controls. To maintain visual consistency, we need to keep the font size consistent across all the app's controls

 

The difference arises from the unit of font size: modern control uses pixels, while classic control uses points.

  • To convert pixels of modern control to points in classic control , simply divide the font size value by 0.75.
  • Vice versa, you can convert the font size of classic control to pixels by multiplying it by 0.75.

 

He‌re is the demonstration:

Screenshot 2024-04-30 at 5.07.03 PM.png

  • To maintain consistent font sizes across the app, you can declare variables in the App’s Formulas property to store the values:

 

varFontSizeClassic = 13; 
varFontSizeModern = varFontSizeClassic * 0.75;

 

  • With these variables, when you add a new modern control, set the font size to varFontSizeModern to ensure the text size matches the default font size (13 points) of classic control.

  • If you plan to change the font size of classic control, set the font size of the classic control to varFontSizeClassic and update the value in the App's Formulas property.

 

Happy Coding!