Blurred text in JavaFX TextArea

I have figured out a solution for this issue. I was able to ascertain that the issue is centered around a bug introduced in JavaFX 8 which causes some blurriness of the content displayed within a ScrollPane when said ScrollPane has decimal value constraints, the bug has to do with the cached image of the content so turning off caching works. TextAreas make use of ScrollPanes.

textArea.setCache(false);
ScrollPane sp = (ScrollPane)textArea.getChildrenUnmodifiable().get(0);
sp.setCache(false);
for (Node n : sp.getChildrenUnmodifiable()) {
    n.setCache(false);
}

If someone has a similar problem inside PopOver from ControlsFX: Blurred text inside text controls (WebView, TextArea, etc).

The solution is to override the -fx-stroke-width attribute inside the .popover > .border selector:

.popover > .border { -fx-stroke-width: 1; }

Example: 

val popOver = PopOver()
val webView = WebView()
webView.engine.loadContent("<html>Some text that should be not blurred</html>")
popOver.contentNode = webView
popOver.root.stylesheets.add(this.javaClass.getResource("test.css").toString())


var b = Button("Press")
val scene = Scene(StackPane(b), 800.0, 600.0)

b.onAction = EventHandler { popOver.show(b) }

primaryStage.scene = scene
primaryStage.show()

enter image description here

Tags:

Java

Javafx

Recent Posts