是否可以在闪光层上使用过渡?

时间:2016-04-06 22:00:18

标签: gluon gluon-mobile

我根据这个材料创建了一个自定义图层:  http://docs.gluonhq.com/charm/2.1.1/#_creating_a_layer,并将其添加到我的应用程序中:

MobileApplication.getInstance().addLayerFactory(LAYER_NAME, () -> customLayer);

现在我想向此图层添加转换。您可以在View上使用转化,例如:view.setShowTransitionFactory(BounceInDownTransition:new)

Layer没有提供类似的方法。所以我尝试了这种方法来应用转换:

private void showLayer() {
    MobileApplication.getInstance().showLayer(LAYER_NAME);
    new BounceInDownTransition(customLayer).play();
}

当我第一次致电showLayer()时,转换似乎不完整。缺少第一部分,其中图层应该从视图中转换出来。每次进一步调用showLayer()都会显示完整的过渡。

层是否意味着与转换一起使用? 如果可能的话推荐的方式是什么?

1 个答案:

答案 0 :(得分:2)

您可以使用Gluon Charm中的内置过渡,因为您只需要将一个节点传递给它们,然后调用play来启动动画。

对于Gluon的图层,视图中没有内置机制,但您可以轻松地将其添加到您的班级。

这将为隐藏显示和弹出效果创建一个反弹效果。

public class MyLayer extends Layer {

    private final Node root;
    private final double size = 150;

    public MyLayer() {
        final BounceInDownTransition transitionIn = new BounceInDownTransition(this, true);
        final BounceOutDownTransition transitionOut = new BounceOutDownTransition(this, true);
        transitionOut.setOnFinished(e -> hide());

        Button button = new Button("", MaterialDesignIcon.CLOSE.graphic());
        button.setOnAction(e -> transitionOut.playFromStart());
        root = new StackPane(button);
        root.setStyle("-fx-background-color: white;");
        getChildren().add(root);

        getGlassPane().getLayers().add(this);

        showingProperty().addListener((obs, ov, nv) -> {
            if (nv) {
                layoutChildren();
                setOpacity(0);
                transitionIn.playFromStart();
            }
        });
    }

    @Override
    public void show() {
        getGlassPane().setBackgroundFade(GlassPane.DEFAULT_BACKGROUND_FADE_LEVEL);
        super.show();
    }

    @Override
    public void hide() {
        getGlassPane().setBackgroundFade(0.0);
        super.hide();
    }

    @Override
    public void layoutChildren() {
        root.setVisible(isShowing());
        if (!isShowing()) {
            return;
        }
        root.resize(size, size);
        resizeRelocate((getGlassPane().getWidth() - size)/2, (getGlassPane().getHeight()- size)/2, size, size);
    }
}

现在,添加图层:

@Override
public void init() {
    addViewFactory(BASIC_VIEW, () -> new BasicView(BASIC_VIEW));

    addLayerFactory("My Layer", () -> new MyLayer());
}