Увеличьте внешнюю линию кнопки размером с круг

Question

У меня есть следующий css-файл, который используется для кнопки javafx:

#circle {
-fx-background-color:
        green,
        white;
-fx-background-radius: 100;
-fx-background-insets: 0;
-fx-text-fill: black;
-fx-effect: dropshadow( three-pass-box , rgba(0,0,0,0.6) , 5, 0.0 , 0 , 1 );
}

Так что это в основном круглая белая кнопка с зеленой внешней линией.Моя проблема в том, что зеленая внешняя линия очень тонкая.Есть ли способ увеличить внешнюю линию?

Answer 1

В большинстве случаев, когда вам нужна конкретная внешняя линия, используется свойство border.

#circle {
    -fx-background-color: white;
    -fx-border-color: green;
    -fx-border-radius: 100;
    -fx-border-width: 1;
    -fx-background-radius: 100;
    -fx-background-insets: 0;
    -fx-text-fill: black;
    -fx-effect: dropshadow( three-pass-box , rgba(0,0,0,0.6) , 5, 0.0 , 0 , 1 );
}

Чтобы получить такую ​​же форму фона, вам также нужно установить -fx-border-radius на то же значение, что и -fx-background-radius.

, как видно из названия.Вы можете увеличить границу с помощью свойства -fx-border-width.

Answer 2

Можете ли вы указать зеленую внешнюю линию вместо -fx-stroke?Вот так вот:

#circle {
  -fx-background-color: white;
  -fx-stroke: green;
  -fx-stroke-width: 5;
  ...rest of the CSS
}