Как сделать кнопку javafx с формой круга диаметром 3xp?

обновление: при ближайшем рассмотрении результирующей кнопки установка формы, как в ответе Хосе, кажется, работает лучше на очень маленьких кнопках, чем установка -fx-background-radius как используется в этом ответе, (результирующая кнопка выглядит немного более круглой, когда форма установлена). Поэтому решение здесь, вероятно, лучше всего подходит для больших кнопок (например, 10px или более), в то время как установка формы, вероятно, лучше всего подходит для очень маленькой кнопки 3px (это довольно тонкая разница хотя.)

3 пиксела-это очень небольшой. Я не уверен, как вы ожидаете, что люди нажмут на него.

вы можете сделать это с помощью CSS.

вот круглая кнопка 30px размер:

и ваша запрошенная кнопка размера 3px:

округление достигается путем установки большого значения -fx-background-radius.

скриншоты были сделаны на сетчатке mac, поэтому они в два раза больше оригинала.

import javafx.application.Application;
import javafx.geometry.Insets;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.StackPane;
import javafx.stage.Stage;

public class Rounding extends Application {

    @Override 
    public void start(Stage stage) throws Exception {
        Button roundButton = new Button();

        roundButton.setStyle(
                "-fx-background-radius: 5em; " +
                "-fx-min-width: 3px; " +
                "-fx-min-height: 3px; " +
                "-fx-max-width: 3px; " +
                "-fx-max-height: 3px;"
        );

        StackPane layout = new StackPane(
                roundButton
        );
        layout.setPadding(new Insets(10));
        stage.setScene(new Scene(layout));

        stage.show();
    }

    public static void main(String[] args) {
        launch(args);
    }
}

обратите внимание, что кнопка отображается со слоями фона. Внутренний слой является фактической кнопкой, а снаружи есть кольцо фокусировки и небольшое свечение. Таким образом, вместе это может быть немного больше, чем 3 пиксела. Если вы хотите получить 3px точно, вам нужно будет избавиться от фоновых вставок фокуса. Что-то вроде ниже:

roundButton.setStyle(
        "-fx-background-radius: 5em; " +
        "-fx-min-width: 3px; " +
        "-fx-min-height: 3px; " +
        "-fx-max-width: 3px; " +
        "-fx-max-height: 3px; " +
        "-fx-background-color: -fx-body-color;" +
        "-fx-background-insets: 0px; " +
        "-fx-padding: 0px;"
);

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

идея использования -fx-background-radius для округления кнопки пришли от реализации округленных переключателей в Модене JavaFX по умолчанию.таблица стилей css. Вы можете найти таблицу стилей, заглянув внутрь jfxrt.файл jar, который включает код JavaFX и ресурсы.

для сравнения, вот изображение кнопки, созданной с помощью решения формы круга, как в Хосе ответ:

почему все еще нужно настроить minSize ().....

потому что JavaFX пытается предоставить разумные значения по умолчанию. Если бы не было минимального размера по умолчанию для пустой кнопки, когда вы изменили размер сцены меньше, некоторые из кнопок просто исчезли бы, и пользователь не смог бы нажать на них - что было бы очень плохим пользовательским опытом. Таким образом, минимальный размер по умолчанию составляет около 1em, плюс некоторое заполнение (например просто больше символа), хотя на кнопке не установлен текст. Однако это просто набор по умолчанию системой Java, поскольку он не может точно знать, чего хочет ваше приложение. Если значения по умолчанию не работают для вашей ситуации, переопределите их или предоставьте дополнительные подсказки, такие как явное задание минимального размера элемента управления.

что означает "5em"?

посмотреть ссылка на css JavaFX 8 руководство:

em: "размер шрифта" соответствующего шрифта

так 5em означает 5 раз размер шрифта. Большинство размеров элементов управления в таблице стилей JavaFX по умолчанию задаются с помощью единиц em. Таким образом, при изменении шрифта или размера шрифта пользовательский интерфейс изящно масштабируется для размещения большего или меньшего шрифта. В этом конкретном случае выбор 5em был довольно произвольным, я просто хотел большое значение, чтобы кнопка была полностью круглый, иначе -fx-background-radius создать прямоугольник с закругленными углами, а не полный круг. Гарантируя, что радиусные размеры перешли в -fx-background-radius больше половины размера элемента управления, затем элемент управления принимает вид круглого круга.

Я знаю, что это несколько запутанно и не интуитивно. Я просто скопировал концепцию из таблицы стилей JavaFX по умолчанию с идеей, что, независимо от того, насколько запутанным это может быть, это, вероятно, лучшее практика для достижения этих видов эффектов или он не будет использоваться в таблице стилей по умолчанию.

в основном преимущество такого подхода заключается в том, что код не требуется, все стили могут быть выполнены непосредственно в CSS (так что вы можете изменить внешний вид без изменения кода Java), и если вы хотите, вы можете указать координаты в единицах em, так что управление масштабируется с вашим размером шрифта. Так что за кажущимся безумием кроется какая-то причина.