0

Please read before labelling this as a duplicate.

I am creating an application that calculates how fast a person can type by calculating WPM and CPM. However I have hit a snag with the UI as I found out that you cannot really highlight individual strings in a TextArea. My goal is to compare what the user is typing to the random text that is generated by having it so that the text is being dynamically coloured or highlighted as the user is typing.

See http://10fastfingers.com/typing-test/english to get an idea of what I mean

I recently read the following post Highlighting Strings in JavaFX TextArea

I was trying to achieve the same goal of highlighting individual strings inside a javaFX TextArea until I realised that it pretty much is not possible. So I looked into TextFlow which does allow me to edit individual strings. The problem with TextFlow is that all 200 of the generated words would have to appear at once which is not what I want. With a TextArea not all the text has to be displayed at once.enter image description here

This is what I have so far just so that you can further get an idea of where I am heading with this.

Community
  • 1
  • 1
Mr Spartacus
  • 127
  • 1
  • 10
  • "The problem with TextFlow is that all 200 of the generated words would have to appear at once". Why? – James_D Aug 31 '15 at 22:55
  • Because, unlike TextArea, there is no scroll bar. When I was testing it seemed like it just wrapped the content within it. – Mr Spartacus Aug 31 '15 at 22:59
  • If you want a scroll bar, put it in a `ScrollPane`. But that's not really what you said: you implied you couldn't add and remove text from the `TextFlow` dynamically, which is obviously nonsense. – James_D Aug 31 '15 at 23:01
  • Right thanks for the info. I honestly forgot about ScrollPane as I am relatively new to using javaFX. So if I put a TextFlow object inside I ScrollPane I should be able to make this work then? I do not know what you mean by your last comment though. How was I implying that? Unless you're suggesting that I should add a certain number of words to at a time before removing and replacing them. – Mr Spartacus Aug 31 '15 at 23:06
  • 1
    Yes, that's what I meant. You could consider adding just enough `Text` objects to fill the rows you want visible, then removing the earlier ones and adding new ones when you need. Might be tricky to implement, but it should be possible. Or, you could just put all the words in the `TextFlow`, put the `TextFlow` in a pane with a max height set (so only a portion would be visible), and then move the `TextFlow` as you need. Or use a `ScrollPane`, if a scroll bar is what you want. – James_D Aug 31 '15 at 23:20
  • Thank you. You were very helpful. – Mr Spartacus Aug 31 '15 at 23:50

0 Answers0