Undecorator: A New Theme

Hi folks!

It’s been a while since my last post, but I didn’t give up JavaFX coding!

Here is a little update on this Stage decoration library, this time focused on a new theme named “Touch” with large icons, and with some minor bug fixes.

A new skin for Undecorator stages

Here is a video version:

 

Last but not least:

The executable jar to test: here!

The source code: here!

For those of you who would like to stay with the classic theme, you have to call this method before the create the UndecoratorScene:

// Override default Touch theme:

UndecoratorScene.setClassicDecoration();

UndecoratorScene undecoratorScene = new UndecoratorScene(primaryStage, root);

Here is the result in the demo:

How to switch to old decoration mode

Last comment, there’s still an issue on Mac OSX in JavaFX with the fullscreen mode with Undecorated windows…

 

Enjoy, feel free to comment!

Thanks

MagniFiX

MagniFiX is a (very) small example illustrating the JavaFX transparent stage (Undecorator).

I wrote this sample just for fun, so hope you’ll enjoy it! This is basic desktop magnifier:

If you’re interested, here are the Sources and, of course, the executable DemoJar to play with it!

Have fun with JavaFX

See you next year!

-in-sideFX-

 

Undecorator Bis

Transparent and rounded!

A new version of my JavaFX window decoration API. This time focused on the transparency and non-rectangular window.

Jar is here and sources are available on GitHub.

You can directly execute the jar if your security settings allow you or type:

java -jar UndecoratorBis.jar

By default, your transparent stage will look like this:

Look at demoapp/UndecoratorSceneDemo.java for this sample.

 

 

If you want to customize the stage background, you can play with these CSS settings:

/*
 The Stage background.
*/
.decoration-background{
-fx-fill: radial-gradient(focus-angle 45deg, focus-distance 20%, center 25% 25%, radius 50%, reflect, #eeeeee88, #aaaaaa88 75%, gray);
-fx-stroke-width: 0;
-fx-arc-width:20px;
-fx-arc-height:20px;
}
/*
Defines the rectangle responsible for the shadow
*/
.decoration-shadow{
-fx-fill: black;
-fx-stroke-width: 0;
-fx-arc-width:20px;
-fx-arc-height:20px;
}

And apply them on the scene:

undecoratorScene.addStylesheet("mySettings.css");

You can get something like this:

Video:

 

Have fun with it! and…

That’s all for 2014!

ThreeDOM is dead, long live to ThreeDOM in ScenicView!

In my previous post I presented a new kind of 3D visualization for 2D GUI called ThreeDOM.

The bad news is that I’ll stop working on it 😦  Ooooohhhh…as a standalone jar!

The good news is that it’s now part of the great ScenicView tool !

Announced last JavaOne by Jonathan Giles, ScenicView is now open sourced and so, this is my humble contribution to this project.

Have fun with it, and send me your feedbacks and enhancements requests or directly contribute here: https://bitbucket.org/scenicview/scenic-view !

Thanks.

ThreeDOM in ScenicView

 

ThreeDOM: SceneBuilder in liberty and in 3D!

My summer Experiment!

As a first project to learn JavaFX 3D APIs, I’ve chosen to implement this fancy feature, inspired from FireFox.

So, please welcome, ThreeDOM, the 3D viewer of flat 2D user interfaces!

Use 3D when 2D reaches its limits!

ThreeDOM creates a 3D representation of a 2D Node hierarchy, using textured Box nodes. It supports 3D rotation, translation and throws mouse events that can be handled by the host application.

Why 3D?

We can distinguish 2 use cases:

Static visualization

For that, I created a sample using the excellent SceneBuilder Kit, and it helps to:

• Understand Complex layering
• Investigate bad performance,
• Facilitate nodes arrangements,
• Easily grab “hidden” components to edit them.

Dynamic for application analysis

• Like ScenicView displays all nodes details, ThreeDOM displays your applications in a 3D space. With this new capability you’re able to analysis the “depth” of your UI, and so optimize it…

What’s next?

I’ll post the code soon, so you will be able to play with it.

For a better integration with SB-Kit, it would require API extensions like graphical model listeners, snapshot capabilities, editing notifications… Or even better: a native integration into SceneBuilder! Hey fabulous SB team, are you there? 🙂

Have a great Summer FX!

 

Undecorator for Java 8

Hi,

Little update to make Undecorator running on Java 8.

Lesson learnt: Panes are now opaque (Modena?).

Jar is here and works for both Java7 and Java8. Sources have been updated on GitHub.

Have fun!

aLive is alive!

aLive is a free playlist manager software written in JavaFX.

It’s an application I wrote (in my free time :)) to help music bands to organize rehearsals. As musicians, we often need to know, “Who’s playing on what?”, ”Where are the tabs, the lyrics…?”,“What is the total length of the playlist” etc… The basic aim is to simplify the presentation of classical playlists that are usually described in an Excel file. In addition, I took the opportunity to include fancy features provided by the Java/JavaFX platforms. I also reuse my two previous project Undecorator and iBreed.   Current version is delivered as native installers for Mac and Windows (I don’t have Linux distrib on my computer). Now, Feel free to test it even if you’re not familiar with musical activities :-).

For Mac                                                     For Windows

The principle

3 main screens:

The playlists:

The data source of a playlist is currently an Excel file (xls or xlsx). A built-in playlist is provided for demo purpose. Once your playlist opened, you access to all songs of the playlist and you can modify them. This file could be local or downloaded from an URL (read only mode).

The songs:

This screen displays all songs with their respective order, length and color syntax from original excel file. You can filter the songs list by keywords (title, key, who plays on it…). You also can add and remove songs.

The song

Here the “main” screen which displays all details of the Song. Basically, each column of a song row in the original Excel file is bound to a field of this screen. This is a bidirectional binding, if you modify the text of a field in this screen, it will later be saved in the Excel file. If you have custom column in your playlist file you want to display, e.g. “Style”, you also can display this custom column in the 2 remaining fields by simply typing “Style” in the editable part. The media panel supports all audio files supported by JavaFX. It also supports URL, in this case a WebView will be used to render the media.  

I want to manage my own playlist file!

As a starter kit, in the first screen click on “save” button of the demo playlist, then a “save as” dialog will appear. Select a target location, and aLive will write all the data used for the demo (xls, mp3, tabs, custom screen sample). Now, feel free to edit you own based on these files. The demo file is also editable, and if you modify its content and come back to first screen or quit, the same “save as” dialog will be shown.

Customize the song screen

This feature is not user friendly (yet), since you have to use an external tool to edit it. The principle is simple; all dynamic fields in the screen are linked to a column in the Excel file. This is done using the “JavaFX CSS Id” that points to a column name. Ok, let’s try… When saving the demo playlist folder from first screen, a “custom_Song_Screen” folder is created. Use this folder as an example of custom song screen. You will find the song.fxml file in it and you will need SceneBuilder 1.1 tool to edit it correctly. Once done, you can specify your own song screen through the Preferences dialog.

 

 

In future version, I’ll include part of the Scene Builder Kit API in order to directly edit the song screen in the aLive application without editing it with an external Developer tool.

Next steps

Enhance the User Experience! Add some great controls such as ControlFX ones…

Customize Native installers.

Upload aLive to the Apple AppStore.

I would like this app to run on iOS/Android devices, so there’s still some work to do there…

 

My near future

I’ll do a little break on that project, waiting for your feedbacks!

Now, I will adapt all my other sub projects to Java8.

Once done, I’m excited to begin my brand new project based on 3D capabilities of JavaFX.

  Stay tuned!

aLive: App for Musicians

Hi all,

I’m proud to present you my very last app, named:

aLive

Here is the (very fast!) teaser of this incoming JavaFX application for musicians. This tool is designed to make it easier for all musicians to manage their playlists for rehearsals and/or live concerts.

The details of this free application will be posted soon.

Technically, this app is fully based on Java platform (7u51) with a JavaFX front-end.

Feel free to comment and stay tuned for the first release!

Thanks.

Undecorator – Automn enhancements

Hi Folks!

For my next application development I needed a refresh of the Undecorator helper, so here are the details of the enhancements:

Title bar

Title bar label

 

How to display the title set on the stage:

public void start(final Stage primaryStage) throws Exception {
primaryStage = stage;
// Set the title before to create the Undecorator class
primaryStage.setTitle("Undecorator Scene Demo");
UndecoratorScene undecoratorScene = new UndecoratorScene(primaryStage, root);

New dock feedback

And many issues fixed… and found :-):

      JavaFX bugs  (Mac only):

• Set stage as fullscreen using Keyboard accelerator (Ctrl+Cmd+F) crashes JVM
• KeyCombination does not respect keyboard’s locale (i.e. always QWERTY key code)
• Multi screen: On second screen JFX returns wrong values, e.g. MinY ==300 (?!)

Check this out!

Executable jar file is still here:  

and to access to the code, project and binaries it’s still there:

That’s all for today and stay tuned for my next JavaFX App announcement :-)!

Undecorator – update

Back to Undecorator, with little code cleaning, bug fixing and comments added.
As mini feature, a direct access to fullscreen mode via a button in the window “title” bar:

Fullscreen button on title bar

The UndecoratorSceneDemo and UndecoratorStageDemo now includes an example for the UTILITY stage mode.

As a reminder the difference between those 2 demos are:

• UndecoratorStageDemo: Use directly the Undecorator class as an helper to enhance your existing apps
• UndecoratorSceneDemo: Use the UndecoratorScene class which replace your Scene, code is more simpler.

To see the Utility stage mode, just press the “Show Utility stage” button and…

Show utility stage button

An undecorated utility stage appears with its capabilities.

Utility window

Try!

Executable jar file is still here:  

and to access to the code, project and binaries it’s still there:

Still to investigate:

• Behavior with Java8 (visual artifacts)
• Menus are not displayed on fullscreen mode on MacOS: They are displayed “under” the main window.

Stay tuned ’till next update 🙂
Have a nice summerFX to you all.

A.