making the backround of a javafx textArea clear

Question

I was looking into this whole text area class in java, I was going to use it in my cool GUI i'm making but, when I was looking to make the background clear the only thing I could find is a method that allows you to set the opaqueness. but that is of the whole text area (including the text) I want just the background to clear. any advice/tips

also all the google searches I made came up with a lot of css related posts huh?

http://stackoverflow.com/questions/21936585/transparent-background-of-a-textarea-in-javafx-8 probably 2-nd part `Code Example` is what you are looking — varren, Jun 01 '15 at 02:33
Though note he explicitly states "The code shouldn't be used for production. It's just for demonstrating the node structure." CSS is really the preferred solution for this (event though that code example is really cool). — James_D, Jun 01 '15 at 02:38
Wow guys thanks i understand the css but in confused I know where to put the Java where do I put the css in the compiler? In its own class? — Sam Hoffmann, Jun 02 '15 at 10:45

James_D · Accepted Answer · 2015-06-01T02:09:45.047

A TextArea contains a scroll pane internally. The three things you need to make transparent to make the text area appear transparent are

The text area iteself
The viewport for the text area's internal scroll pane
The content pane that displays the text inside the scroll pane

The CSS rule for this is

.text-area, .text-area .viewport, .text-area .content {
    -fx-background-color: transparent ;
}

Complete example:

TransparentTextArea.java:

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.TextArea;
import javafx.scene.layout.StackPane;
import javafx.stage.Stage;

public class TransparentTextArea extends Application {

    @Override
    public void start(Stage primaryStage) {
        TextArea textArea = new TextArea();
        StackPane root = new StackPane(textArea);
        Scene scene = new Scene(root, 400, 400);
        scene.getStylesheets().add("transparent-text-area.css");
        primaryStage.setScene(scene);
        primaryStage.show();
    }

    public static void main(String[] args) {
        launch(args);
    }
}

transparent-text-area.css:

.root {
    -fx-background-color: linear-gradient(to bottom right, white 0%, cornflowerblue 100% );

}

.text-area, .text-area .viewport, .text-area .content {
    -fx-background-color: transparent ;
}

enter image description here

making the backround of a javafx textArea clear

1 Answers1