0

私はボリュームノブをしようとしています、私はノブを持っています、しかし私は啓発された大きなスポットによって表されるノブの周りにボリュームインジケーターを配置したいと思います。Circleノードで試してみました。フレーム内の必要な場所にグループを配置できるようCircleに、それらすべてをに追加する配列を宣言しました。setTranslateXメソッドとsetTranslateYメソッドGroupを使用して各円を配置します。CircleそれぞれCircleに塗りつぶし用の放射状のグラデーションがあり、表示されません。スライダー（ボリュームノブ）の値をCircle配列内のそれぞれにマップし、valueChangedメソッドを呼び出して、Circle以下のすべての値を取得し、それぞれを表示するように設定します。Circle内側の位置に問題がありますGroup。それらがすべて表示されている場合、それらは完全に配置されていますが、一部のプロパティがfalseに表示される場合、残りの表示されているものはその位置に留まりません。だから私はこれを行うためのより良い設計アプローチを探しています。ありがとうございました。

コード例： サークルの作成

audioSelectionValueToCircle = new HashMap<Double, Circle>(audioSelectionCircle.length);
    for (int i = 0; i < 6; i++) {
        final int count = i;
        audioSelectionCircle[count] = new Circle(15.0);
        RadialGradient rgrad = RadialGradientBuilder.create().centerX(audioSelectionCircle[count].getCenterX() - audioSelectionCircle[count].getRadius() / 5).centerY(audioSelectionCircle[count].getCenterY() - audioSelectionCircle[count].getRadius() / 5).radius(audioSelectionCircle[count].getRadius()).proportional(false).stops(new Stop(0.0, Color.WHITE), new Stop(0.3, Color.ORANGE), new Stop(1.0, Color.TRANSPARENT)).build();
        audioSelectionCircle[count].setFill(rgrad);
        audioSelectionValueToCircle.put(audioSelectionValue[count], audioSelectionCircle[count]);
        audioSelectionCircle[count].setVisible(false);
    }

グループ作成

    gAudioSelectionCircle = new Group();
gAudioSelectionCircle.resizeRelocate(1225, 520, 280, 280);
        gAudioSelectionCircle.setRotate(90);

円の配置

    int n = 6;
        for (int i = 0; i < n; i++) {
            final int count = i;
            double t = 2 * Math.PI * i / n;
            double x = 60 * Math.cos(t);
            double y = 60 * Math.sin(t);
            audioSelectionCircle[count].setTranslateX(x);
            audioSelectionCircle[count].setTranslateY(y);

            gAudioSelectionCircle.getChildren().add(audioSelectionCircle[count]);
//            audioSelectionCircle[count].resizeRelocate(x, y, 41, 41);
        }

ノブの動作

audioSelectionKnob.valueProperty().addListener(new ChangeListener<Number>() {

            @Override
            public void changed(ObservableValue<? extends Number> ov, Number oldVal, Number newVal) {
//                if (!audioSelectionKnob.isValueChanging()) {
//                }
                Iterator<Map.Entry<Double, Circle>> it = audioSelectionValueToCircle.entrySet().iterator();
                while(it.hasNext()) {
                    Map.Entry<Double, Circle> pairs = it.next();
                        Circle c = pairs.getValue();
                    if(pairs.getKey() >= newVal.doubleValue()) {
                        c.setVisible(true);
                    } else {
                        c.setVisible(false);
                    }
                }
            }
        });

たぶん1つ、ノブの上にグループを追加すると、問題が発生しますか？ノブをルートグループに追加し、サークルグループをノブの上のルートグループに追加します。

サンプル時計の回転方法をサークルに適用する際の問題を部分的に修正しました。しかし、を使用して円のグループを回転させると、まだ問題がありgroup.setRotate(rotation);ます。すべての円が表示されている場合、円の位置は適切ですが、表示プロパティの変更を開始すると、ノブをスライドさせることで、グループは私が行った場合と同じように動作しgroup.setRotation(0);ます。最初に設定した回転値が保持されていないようです。

4

1 に答える 1

0

残りの目に見えるものはその位置にとどまりません

これはおそらく、これを引き起こしている配置アルゴリズムのバグです。診断するには、短く、簡略化された、コンパイル可能なサンプルアプリを提供する必要があります。

ノードの可視性プロパティのみを変更しても、アプリケーションのレイアウトに影響を与えることはありません。

円の周りにノードを配置するために、この時計のサンプルを見ることができます。時計のサンプルでは、​​12個のノードを12時の位置に配置し、ノードに回転を適用して適切な位置に配置します。レイアウトはあなたが説明したものと少し似ているように見えますが、参照画像なしでは確認するのは難しいです。

ノードが正しく配置され、ボリュームノブの「スライダー」が中央にある場合は、スライダーの値に基づいてノードのcssスタイルクラスを調整できます（現在の可視性調整の方法と同様）。それらをオンまたはオフにします。グループにノードを追加したり削除したりする必要はありません。また、レイアウトによって、さまざまなスタイルのノードに適用される可視性や効果だけが変更されることはありません。

スライダーの動作とスキンの置き換えに基づいたノブベースのスライダーを備えたこのオーディオプレーヤーの例を確認することをお勧めします（ただし、説明している種類の効果を得るには、実装を少し調整する必要があります）。

于 2012-06-12T21:48:14.477 に答える