Skip to content

Latest commit

 

History

History
72 lines (38 loc) · 2.57 KB

design-patterns-controls-TextBlock.md

File metadata and controls

72 lines (38 loc) · 2.57 KB

TextBlock

Basics

The TextBlock control enables you to easily display a block of read only text.

When to use

Use when displaying read only text.

Displaying and gathering text is available via multiple controls, choose the one most suited to your needs

  • CopyableLabel - multi-line text input with built-in support for infoBalloonContent and an easy way for user to copy value.
  • MultilineTextBox - multi-line text input with built-in support for validations, infoBalloonContent and placeHolderText
  • NumericTextBox - restricts input to numbers only and built-in support for validations, infoBalloonContent and placeHolderText
  • PasswordBox - text input that uses a * character instead of echoing user input with built-in support for validations, infoBalloonContent and placeHolderText. Use PasswordBox for security sensitive fields.
  • TextBlock - Readonly control used to display text.
  • TextBox - single-line text input with built-in support for validations, infoBalloonContent and placeHolderText

Best practices

Do

  • Provide enough space for the text to be displayed
  • Set a max width of no greater than 800px so that text will wrap in a readable way.
  • Use the label option to provide a helpful name for the control.
  • When part of a form, provide clear designations for which fields are required vs. optional.

Don't

  • Don't use this control if the user may want to easily copy the text, consider the CopyableLabel instead.
  • Don't use this if the text is of a known syntax that needs format markups, consider the Editor control to display structured text in a nice way.

Developer tips and tricks

Interactive control and sample source code

Go to the playground site to use the latest control and get source code for your project. Learn more about playground.

Related info