2

この資料に従って、カスタムレイヤーを作成しました: 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()、完全な遷移が表示されます。

レイヤーは、トランジションと組み合わせて使用​​することを意図していますか? 可能な場合、推奨される方法は何ですか？

4

1 に答える 1

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());
}
于 2016-04-07T14:06:47.360 に答える