Skip to content

onexip/FlexBoxFX

Repository files navigation

FlexBoxFX

FlexBoxFX is a JavaFX implementation of CSS3 flexbox layout manager (https://css-tricks.com/snippets/css/a-guide-to-flexbox/).

Official Website: http://flexboxfx.io

Youtube trailer: https://www.youtube.com/watch?v=nuJ0s5imAdo

Kickstarter: https://www.kickstarter.com/projects/ultramixer/flexboxfx-javafx-port-of-css3-flexbox-layout-manag https://www.kickstarter.com/projects/ultramixer/flexboxfx-javafx-port-of-css3-flexbox-layout-manag/widget/video.html

Why FlexBoxFX?

Modern user interface design means Responsive Design to match the needs of all platforms like Desktop, Web and Mobile and different target devices like Laptops, Tablets and Smartphones.

Since CSS3 there is the flexbox layout manager to create complex responsive layouts with less code. Currently there is no such powerful layout manager available in JavaFX – that is the reason why it’s nearly impossible to write modern responsive applications with JavaFX.

Our goal is to write a complete JavaFX port of CSS3 flexbox layout manager to hand over the JavaFX developer a modern and powerful layout manager.

Help us to reach the funding goal on kickerstarter and become one of the FlexBoxFX sponsors on flexboxfxio. Depending on donation, your company logo, a description and the link to your homepage will be placed in one of the sponsor sections (diamond, gold, silver, bronze).

When the funding goal is reached we start to implement FlexBoxFX as an open source project on GitHub. So FlexBoxFX will be open source and free to use for commercial use.

Example

<FlexBoxPane fx:id="flexBoxPane" horizontalSpace="20" verticalSpace="20" styleClass="flex-pane" direction="ROW"> 
  <Button text="Item 5" styleClass="item,item1" FlexBox.order="5" FlexBox.grow="1"></Button>
  <Button text="Item 1" styleClass="item,item2" FlexBox.order="1" FlexBox.grow="2"></Button> 
  <Button text="Item 10" styleClass="item,item3" FlexBox.order="10" FlexBox.grow="1"></Button> 
</FlexBoxPane>

Build FlexBoxFX

gradle build

You'll find the binary jar file here: /build/libs

Maven

<!-- https://oss.sonatype.org/content/repositories/snapshots //-->
<dependency>
    <groupId>com.onexip</groupId>
    <artifactId>FlexBoxFX</artifactId>
    <version>0.1.5.3-SNAPSHOT</version>
</dependency>

Gradle

compile('com.onexip:FlexBoxFX:0.1.5.3-SNAPSHOT')

License

(c) 2016 - 2017 onexip GmbH

FlexBoxFX is open source and released under Apache License 2.0 – so it is free to use for non-commercial and commercial use and

Team

  • Project Lead: Tobias Bley
  • Developer: Matthias Hänel

Tests

TestButtons (com.onexip.flexboxfx.test)

test-buttons-1

test-buttons-2

test-buttons-3