如何对不透明的孩子实施透明的窗格? [英] How to implement a transparent Pane with non-transparent children?

问题描述

如何在JavaFX 2中实现具有非透明子代的透明面板? 我想要达到的效果例如应用于Blender中的菜单:

How can i implement a transparent panel with non-transparent children in JavaFX 2? The effect i want to achieve is for example applied to menus in Blender:

菜单面板/窗口是透明的，但是文本项不是透明的，从而产生漂亮的效果.

The menu-panel / window is transparent, but the text items are not transparent which leads to a pretty effect.

推荐答案

将窗格的背景设置为具有alpha成分的颜色.您可以为此使用样式表或嵌入式样式.

Set the background of your pane to a color with an alpha component. You can use a stylesheet or an inline style for this.

例如，如果您的窗格被命名为玻璃，则以下内容将使它成为圆形的半透明青色背景:

For example, if your pane was named glass, then the following will give it a rounded, translucent cyan background:

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

您还可以使用不透明度为堆栈窗格或组背面的项目设置.

You could also accomplish similar effects using blends, stackpanes or groups of items with the opacity set for items at the back of the stackpane or group.

这是一个使用css背景方法的可执行示例.

Here is an executable example using the css background method.

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); }
}

示例程序输出:

这篇关于如何对不透明的孩子实施透明的窗格?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！