Wednesday, 9 April 2014

FX 2.2 to FX 8.0 Part 5 (caret)

I have a sticky note like widget on one of my views. Its actually just a TextArea with some effects on it, here's how it looks in FX 2.2 when its empty:

When you click on it its supposed to receive focus and then the cursor or caret appears so that you know where you are typing, like so in FX 2.2:

But in FX 8.0 there's no caret, you can click all you want and it doesn't appear. So what's the user to think ?  Can I type or can't I type .... that is the question.

Well it turns out you can type and as soon as you start the caret appears. But I don't think that's a good user experience, they need feedback.

Technically what happens when you click on the text area is that some effects and css are applied to the node and "Click here to add Reminder" is replaced with an empty "" string, like so:
styleList = reminderNote.getStyleClass();
styleList.remove( "reminderoff" );
styleList.add( "reminderpresent" );
reminderNote.setEffect( shadowAndSepia ); // Sepia can't be specified in css ?
reminderNote.setText( "" );
An adequate solution I found was to just replace the empty string with a space instead: 
reminderNote.setText( " " );   // note the space
Problem solved, then I had some scroll pains .... see part 6.

No comments:

Post a Comment