Cascades – Preventing red underlined text when using TextAreas for text display

I’ve been playing with Cascades for BlackBerry 10 since seeing it in action at BlackBerry Jam Europe last week and being really impressed with how quickly you can put together some really good looking stuff. I fairly quickly noticed a strange side effect of using the TextArea component for displaying text.

As TextAreas are also used for inputting text, they come by default with their (pretty cool) spell checking feature switched on by default, which highlights with the usual red underlining any misspelled words.

The code:

TextArea 
{
  text: "Welcome to my app, which is called: NotARealWord"
  enabled: false
  editable: false
  preferredWidth: 650
}

The result:

TextArea with spell check switched on

TextArea with spell check switched on

Obviously this looks pretty rubbish when using the component to display static text such as on the About page of your app, so you need to explicitly switch off the spell check feature of the TextArea by adding an input->flags section to your component as per the following code:

The code:

TextArea 
{
  text: "Welcome to my app, which is called: NotARealWord"
  enabled: false
  editable: false
  preferredWidth: 650
  input
  {
    flags: TextInputFlag.SpellCheckOff
  }
}

This now looks much better! The result:

TextArea with spell check switched off

TextArea with spell check switched off

As always the excellent documentation provided by BlackBerry helped out here. The documentation for TextArea is here

Leave a Reply