Javaの為替の矢印ボタン

Anupmpunith：

私は、円の周り（3D矢印キーなど）の三角ボタンを配置しようとしています。私は以下のコードでCSSを経由して実行しようとしました。しかし、うまくいきませんでした。これは、ボタンに設定を適用しません。私はJfxtrasとjfoenixをチェックするが、便利な何かを見つけることができませんでした。すべてのアイデアは、してください？

#triangle-down {
    width: 0;
    height: 0;
    border-left: 50px solid transparent;
    border-right: 50px solid transparent;
    border-top: 100px solid red;
}

JKostikiadis：

あなたは使用することができStackPane、それを達成するために。内部背景（又はImageViewの）として円を追加し、4つのボタンを追加します。あなたが呼び出す必要があり、それらを整列するには：

StackPane.setAlignment(topButton, Pos.TOP_CENTER);
StackPane.setAlignment(rightButton, Pos.CENTER_RIGHT);
StackPane.setAlignment(bottomButton, Pos.BOTTOM_CENTER);
StackPane.setAlignment(leftButton, Pos.CENTER_LEFT);

上記のコードで、あなたは、あなたが使用してCSSを非常に簡単に行うことができ、ボタンの形状を、変更する必要があります（右、下、上、左）正しい場所にボタンを配置します-fx-shape例えば：

#arrow-button{
    -fx-background-color: -fx-mark-highlight-color, -fx-mark-color;
    -fx-background-insets: 0 0 -1 0, 0;
    -fx-padding: 0.25em;
    -fx-shape: "M 0 -3.5 v 7 l 4 -3.5 z"; 
}

あなたが呼び出すことによって、適切なボタンを回転させる必要がありますので、今、上記のCSSは、右向きの矢印を作成します。

topButton.setRotate(270);
bottomButton.setRotate(90);
leftButton.setRotate(180);

最後に、矢印の形状を高めるために、あなただけのボタンの推奨サイズを設定する必要があります。また、ケースには、あなたが呼び出すことで、同様のことを行うことができ、ボタンにマージンを追加する必要があります。

StackPane.setMargin(topButton, new Insets(10, 0, 0, 0));
StackPane.setMargin(rightButton, new Insets(0, 10, 0, 0));
StackPane.setMargin(bottomButton, new Insets(0, 0, 10, 0));
StackPane.setMargin(leftButton, new Insets(0, 0, 0, 10));

編集：

ボタンがいずれかの推移や押されたときに別の効果を適用するためには、あなたはまた、これらのCSSルールを追加する必要があります。

#arrow-button:hover{
    /* Example make the arrow yellow if buttos was hovered  */
    -fx-background-color: -fx-mark-highlight-color, yellow;

}

#arrow-button:pressed{
    /* And red if it was pressed, you can apply different effect 
     * like shadow , padding etc inside this rules.
     */
    -fx-background-color: -fx-mark-highlight-color, red;
}

おすすめ