Vertical text in label control. Is it possible?

0
0

Hi!

I would like vertical text in label control. is it possible?

Thank you!

  • You must to post comments
0
0

Hi all,

For those in need for vertical writing, I’m sharing here how I implemented it :

Add a StyleSheet component to the form.

In the StyleSheet “styles” property add this code :

.rotated270 { writing-mode: tb-rl; transform: rotate(-180deg); }

Add i.e a Label, set it’s “AutoSize” property to “false

Due to the Stylesheet component, now you have a property attached to the label “CssClass”, let’s type the name of the style we defined “rotated270“.

For some controls, as soon as you start resizing it in the designer, the designer will show you the control with the vertical text.

For others like a textbox, it isn’t the case, but at least you can visually place your component.

Sometimes you have to play with the property “TextAlign” to get the wanted result.

Some other components like Listview and combobox need the addition of a”rotation” component instead of the “stylesheet” component.

In that case you define the angle into : rotation -> RotateZ=-90

I prefer to use as much as possible the stylesheet, because when you start using the rotate component, exact positioning becomes really tricky. At time of writing, it doesn’t support docking, and you have to try and fail the transform using the “origin” property, i.e “0% 100%” …

So, the bottom line is : not the perfect world, but at least you can achieve decent designs.

Regards.

  • You must to post comments
0
0

Thank you!

  • You must to post comments
0
0

Yes. In three different ways:

  • Use StyleSheet component and set the css style to rotate the widget and the ClassName property added to the label.
  • Use the Rotation component and set the Rotation properties on the label.
  • Use a theme mixin and set the transform style

https://www.w3schools.com/cssref/css3_pr_transform.asp

  • You must to post comments
Showing 3 results
Your Answer

Please first to submit.