javafx 2 - technetwork - ¿Cómo implementar un panel transparente con niños no transparentes?

jre java 11

Question

¿Cómo puedo implementar un panel transparente con elementos secundarios no transparentes en JavaFX 2? El efecto que quiero lograr se aplica, por ejemplo, a los menús de Blender:

El panel de menú / ventana es transparente, pero los elementos de texto no son transparentes, lo que conduce a un bonito efecto.

Answer 1

Establezca el fondo de su panel en un color con un componente alfa. Puede usar una hoja de estilo o un estilo en línea para esto.

Por ejemplo, si su panel se llama vidrio, lo siguiente le dará un fondo cian translúcido y redondeado:

glass.setStyle("-fx-background-color: rgba(0, 100, 100, 0.5); -fx-background-radius: 10;");

También puede lograr efectos similares utilizando mezclas, stackpanes o grupos de elementos con el conjunto de opacity para los elementos en la parte posterior del stackpane o grupo.

Aquí hay un ejemplo ejecutable utilizando el método de fondo css.

import javafx.application.Application;
import javafx.geometry.Pos;
import javafx.scene.Scene;
import javafx.scene.control.*;
import javafx.scene.image.*;
import javafx.scene.layout.*;
import javafx.stage.Stage;

public class TranslucentPane extends Application {
  @Override public void start(final Stage stage) throws Exception {
    final ImageView imageView = new ImageView(
      new Image("https://upload.wikimedia.org/wikipedia/commons/b/b7/Idylls_of_the_King_3.jpg")
    );
    imageView.setFitHeight(300);
    imageView.setFitWidth(228);

    final Label label = new Label("The Once/nand/nFuture King");
    label.setStyle("-fx-text-fill: goldenrod; -fx-font: italic 20 /"serif/"; -fx-padding: 0 0 20 0; -fx-text-alignment: center");

    StackPane glass = new StackPane();
    StackPane.setAlignment(label, Pos.BOTTOM_CENTER);
    glass.getChildren().addAll(label);
    glass.setStyle("-fx-background-color: rgba(0, 100, 100, 0.5); -fx-background-radius: 10;");
    glass.setMaxWidth(imageView.getFitWidth() - 40);
    glass.setMaxHeight(imageView.getFitHeight() - 40);

    final StackPane layout = new StackPane();
    layout.getChildren().addAll(imageView, glass);
    layout.setStyle("-fx-background-color: silver; -fx-padding: 10;");
    stage.setScene(new Scene(layout));
    stage.show();
  }

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

Ejemplo de salida del programa: