BootstrapFX

BootstrapFX is a partial port of Twitter Bootstrap for JavaFX. It mainly provides a CSS stylesheet that closely resembles the original while being custom tailored for JavaFX’s unique CSS flavor.

It’s worth mentioning that Twitter Bootstrap delivers more than just a standardized look for common widgets. It also provides new widgets, behavior and a grid system. Some of these features may be ported at a later stage to BootstrapFX.

There is an online-version available at jpro.one.

Installing

You can get the latest version of BootstrapFX directly from Bintray’s JCenter repository or Maven Central.

gradle

repositories {
    jcenter()
}

dependencies {
    compile 'org.kordamp.bootstrapfx:bootstrapfx-core:0.2.4'
}

maven

<dependencies>
    <dependency>
        <groupId>org.kordamp.bootstrapfx</groupId>
        <artifactId>bootstrapfx-core</artifactId>
        <version>0.2.4</version>
    </dependency>
</dependencies>

<repositories>
    <repository>
        <id>central</id>
        <name>jcenter</name>
        <url>https://jcenter.bintray.com</url>
    </repository>
</repositories>

Once the bootstrapfx-core dependency is in your classpath you just need to apply the boostrapfx.css stylesheet to an scene, for example

import javafx.application.Application;
import javafx.geometry.Insets;
import javafx.scene.Node;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.BorderPane;
import javafx.stage.Stage;
import org.kordamp.bootstrapfx.scene.layout.Panel;

public class Sampler extends Application {
    @Override
    public void start(Stage primaryStage) throws Exception {                   //(1)
        Panel panel = new Panel("This is the title");
        panel.getStyleClass().add("panel-primary");                            //(2)
        BorderPane content = new BorderPane();
        content.setPadding(new Insets(20));
        Button button = new Button("Hello BootstrapFX");
        button.getStyleClass().setAll("btn","btn-danger");                     //(2)
        content.setCenter(button);
        panel.setBody(content);

        Scene scene = new Scene(panel);
        scene.getStylesheets().add("org/kordamp/bootstrapfx/bootstrapfx.css"); //(3)

        primaryStage.setTitle("BootstrapFX");
        primaryStage.setScene(scene);
        primaryStage.sizeToScene();
        primaryStage.show();
    }
}

Custom widget from BootstrapFX
Apply CSS class to widgets
Apply BootstrapFX stylesheet to scene

Java 9+

BootstrapFX can be used in a modular fashion when running in Java9+. It’s module name is org.kordamp.bootstrapfx.core.

Building

You must meet the following requirements:

JDK8u60 as a minimum
Gradle 4.10

You may used the included gradle wrapper script if you don’t have gradle installed.

Installing Gradle

Manual

Download Gradle from http://gradle.org/downloads
Unzip the file into a directory without spaces (recommended).
Create a GRADLE_HOME environment variable that points to this directory.
Adjust your PATH environment variable to include $GRADLE_HOME/bin (%GRADLE_HOME%\bin on Windows).
Test your setup by invoking gradle --version.

SDKMAN

Follow the instructions found at http://sdkman.io/ to install SDKMAN.
You need a POSIX environment if running Windows. We recommend using Babun Shell (http://babun.github.io/)
Once SDKMAN is installed invoke sdk install gradle 4.10.
Test your setup by invoking gradle --version.

Gdub

GDub is a wrapper script that facilitates invoking gradle tasks anywhere within a Gradle project. It’s smart enough to use the gradle wrapper if available or your global gradle command. This is an optional download.

Follow the instructions found at https://github.com/dougborg/gdub to install gdub

Next Steps

Make a full build by invoking the following command

$ ./gradlew build

Run the sampler application by invoking the following command

$ ./gradlew :sampler:run

Run the sampler application with JPro by invoking the following command

$ ./gradlew :sampler-jpro:jproRun

Supported CSS Classes

Text

b, strong
i, em, italic, dfn
small
code, kbd, pre, samp
h1, h2, h3, h4, h5, h6
lead
p
text-mute
text-primary, text-success, text-info, text-warning, text-danger
bg-primary, bg-success, bg-info, bg-warning, bg-danger

Buttons

btn
btn-default, btn-primary, btn-success, btn-info, btn-warning, btn-danger
btn-lg, btn-sm, btn-xs

SplitMenu Buttons

split-menu-btn
split-menu-btn-default, split-menu-btn-primary, split-menu-btn-success, split-menu-btn-info, split-menu-btn-warning, split-menu-btn-danger
split-menu-btn-lg, split-menu-btn-sm, split-menu-btn-xs

Labels

lbl
lbl-default, lbl-primary, lbl-success, lbl-info, lbl-warning, lbl-danger

Panels

panel
panel-default, panel-primary, panel-success, panel-info, panel-warning, panel-danger
panel-heading
panel-title
panel-body
panel-footer

Alerts

alert
alert-success, alert-info, alert-warning, alert-danger

Groups

btn-group-horizontal
btn-group-vertical

NOTE: all elements inside the vertical button group must have the same width.

Progress Bars

progress-bar-primary
progress-bar-success
progress-bar-info
progress-bar-warning
progress-bar-danger

Tooltips

tooltip-primary
tooltip-success
tooltip-info
tooltip-warning
tooltip-danger

Miscellaneous

badge

Screenshots

Changelog

0.2.4

The bootstrapfx.css file has been moved to org/kordamp/bootstrapfx/bootstrapfx.css.

0.2.3

Added progress-bar variants
Added tooltip variants
Tweaked menu items and menus

0.2.2

Add Automatic-Module-Name to JAR manifest

0.2.1

POM updates

0.2.0

SplitMenu Button support
Button group support
lead on Text

0.1.0

First release

Name	Latest commit message	Commit time
Failed to load latest commit information.
.github	Create FUNDING.yml	Dec 23, 2019
.lazybones	Initial commit	Sep 8, 2015
config/checkstyle	Mixed updates	Feb 12, 2019
gradle	Update build settings	Dec 2, 2019
images	Add sampler screenshots	Jul 18, 2016
subprojects	Update build settings	Dec 2, 2019
.gitignore	Init repository	Sep 8, 2015
.travis.yml	Update build settings	Dec 2, 2019
LICENSE	Update dependencies	Jan 1, 2016
README.adoc	Update README.adoc	Mar 28, 2020
build.gradle	Update build settings	Dec 2, 2019
gradle.properties	Update project setup	Jan 15, 2019
gradlew	Update project setup	Jan 15, 2019
gradlew.bat	Update project setup	Jan 15, 2019
settings.gradle	Update build settings	Dec 2, 2019

kordamp / bootstrapfx

Sponsor kordamp/bootstrapfx

Join GitHub today

Clone with HTTPS

Downloading

Launching GitHub Desktop