动态背景JavaFX的霜玻璃效果

时间:2015-12-09 13:49:11

标签: javafx cpu blur effect panes

我正在开发JavaFX应用程序:

http://i.stack.imgur.com/Q24i4.png

在这里,我希望左窗格具有模糊背景效果,即,当用户滚动地图时,左窗格后面的内容更改,我想使用该内容(模糊),作为背景左派恩。 &安培;我几乎完成了它。

每当我滚动Map时,它都会工作,并且内容Behind会更新,但在系统监视器中,我可以看到CPU使用率,温度和总功耗大幅上升。

为了实现霜冻玻璃效果,我已经添加了一个事件监听器(用于检测鼠标移动)到webEngine(包含地图):

Document doc = webEngine.getDocument();
((EventTarget) doc).addEventListener("mousemove", listener, false);

侦听器执行以下方法:

  1. 检索左窗格(地图)下方的实际内容。

  2. 模糊图像。

  3. 更新屏幕

  4. 要更新屏幕,方法将删除左窗格(VBox)和上一图像(背景)。 &安培;然后再次首先添加模糊图像窗格,然后将左窗格添加到根窗格。

    所以,我认为我遇到性能问题的原因是,它必须非常快速地删除和添加窗格(左窗格和背景图像)到根窗格,同时用户拖动地图。

      

    问题:CPU使用率非常高

    那么,JavaFX中是否还有其他方法,其中它不需要如此高的CPU使用率?

    喜欢的东西,它不需要一直删除和添加窗格。

1 个答案:

答案 0 :(得分:2)

在HBox中创建两个窗格,将地图的相关部分视图渲染到每个窗格中。在左窗格中设置模糊效果。不需要监听器,快照或动态添加或删除窗格。

尝试使用不同的设置(如BoxBlur和GuassianBlur),以调整性能特征。

  

直接在左侧窗格上设置模糊效果,模糊所有内容(按钮文字),并且因为我设置了透明效果,此设置仅模糊了左侧窗格,

在左窗格中使用堆栈窗格,堆栈底部的左侧地图部分(应用了模糊效果)和堆栈顶部的透明叠加层(没有应用效果)。

  

有没有办法,我可以模糊一个窗格的一部分,所以可以选择位于左侧窗格下方的部分&模糊?

是的,您使用的技术类似于:

示例

这是一个快速示例,作为概念验证,显然对于您的解决方案,您将需要稍微不同的东西。

map

import javafx.application.Application;
import javafx.geometry.Pos;
import javafx.scene.Node;
import javafx.scene.Scene;
import javafx.scene.control.Label;
import javafx.scene.control.ScrollPane;
import javafx.scene.effect.GaussianBlur;
import javafx.scene.image.Image;
import javafx.scene.image.ImageView;
import javafx.scene.layout.StackPane;
import javafx.scene.shape.Rectangle;
import javafx.scene.text.TextAlignment;
import javafx.stage.Stage;

/**
 * Constructs a scene with a pannable Map background.
 */
public class FrostedPannableView extends Application {
    private Image backgroundImage;

    private static final double W = 800;
    private static final double H = 600;

    @Override
    public void init() {
        backgroundImage = new Image("http://www.narniaweb.com/wp-content/uploads/2009/08/NarniaMap.jpg");
    }

    @Override
    public void start(Stage stage) {
        stage.setTitle("Drag the mouse to pan the map");
        stage.setResizable(false);

        // make a transparent pale blue overlay with non transparent blue writing on it.
        final Label label = new Label("Map\nof\nNarnia");
        label.setTextAlignment(TextAlignment.CENTER);
        label.setStyle("-fx-text-fill: midnightblue;  -fx-font: bold italic 40 'serif'; -fx-padding: 0 0 20 0;");

        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);");
        glass.setMaxWidth(W * 1/4);
        glass.setMaxHeight(H);
        StackPane.setAlignment(glass, Pos.CENTER_LEFT);

        // construct a partitioned node with left side blurred.
        ImageView leftMap = new ImageView(backgroundImage);
        ImageView rightMap = new ImageView(backgroundImage);

        // wrap the partitioned node in a pannable scroll pane.
        ScrollPane leftScroll = createScrollPane(leftMap);
        Rectangle leftClip = new Rectangle(W * 1/4, H);
        leftScroll.setClip(leftClip);
        leftScroll.setEffect(new GaussianBlur());

        ScrollPane rightScroll = createScrollPane(rightMap);
        Rectangle rightClip = new Rectangle(W * 1/4, 0, W * 3/4, H);
        rightScroll.setClip(rightClip);

        StackPane composite = new StackPane();
        composite.getChildren().setAll(
                leftScroll,
                rightScroll
        );

        StackPane layout = new StackPane(
                composite,
                glass
        );

        // show the scene.
        Scene scene = new Scene(layout);
        stage.setScene(scene);
        stage.show();

        // bind the scroll values together and center the scroll contents.
        leftScroll.hvalueProperty().bind(rightScroll.hvalueProperty());
        leftScroll.vvalueProperty().bind(rightScroll.vvalueProperty());
        rightScroll.setHvalue(rightScroll.getHmin() + (rightScroll.getHmax() - rightScroll.getHmin()) / 2);
        rightScroll.setVvalue(rightScroll.getVmin() + (rightScroll.getVmax() - rightScroll.getVmin()) / 2);
    }

    /**
     * @return a ScrollPane which scrolls the node.
     */
    private ScrollPane createScrollPane(Node node) {
        ScrollPane scroll = new ScrollPane();
        scroll.setHbarPolicy(ScrollPane.ScrollBarPolicy.NEVER);
        scroll.setVbarPolicy(ScrollPane.ScrollBarPolicy.NEVER);
        scroll.setPannable(true);
        scroll.setMinSize(ScrollPane.USE_PREF_SIZE, ScrollPane.USE_PREF_SIZE);
        scroll.setPrefSize(W, H);
        scroll.setMaxSize(ScrollPane.USE_PREF_SIZE, ScrollPane.USE_PREF_SIZE);
        scroll.setContent(node);
        return scroll;
    }

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