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:
UndecoratorBis
Video:

 

Have fun with it! and…

That’s all for 2014!

Advertisements

  1. #1 by test on 22/07/2015 - 15:11

    Great work! I would like to suggest checking if the stage has already had a style set at line 93 in UndecoratorScene.java so it doesn’t fail if the user is using the same stage and changing the shown scene.

  2. #4 by Aldrin on 30/07/2015 - 10:23

    Thanks for this man..i’m also working for this but yours look perfect.. i’ll use this for my next project..

  3. #6 by Ofentse jabari on 30/10/2015 - 11:01

    This is awesome my brother… Thanx a lot

  4. #8 by Tuete on 13/11/2015 - 11:47

    Great Work! 🙂

  5. #10 by egranlund on 21/01/2016 - 02:42

    Hey Arnaud, I have to definitely commend you on your work. I’ve actually been building my own undecorated frame to house all of my applications. I wanted to make it easy to transfer and customize between each application. Unfortunately, I ran in to issues with resizing the primary pane and stage which led me to researching and happening upon your project.

    There are two issues I’m noticing. The first is that in Centos07 it looks like when the stage edge gets to the edge of the screen it stops even if you keep dragging the mouse. It looks like it works in windows 8+. Just like most windows the pane should keep moving off screen until the mouse hits the edge. Again, both of ours work in windows but in linux they stop at the edge. Any ideas? I’m guessing it’s a javafx core issue.

    The second is when it comes to resizing the main pane and stage from the west or north. Both of our projects studder in both windows and linux. I’ve even had the studdering move the window from its location. I was curious if you had noticed this with yours. Maybe something broke in a recent update of java? I’m looking in to it now but was curious if you’re experiencing the same!

    • #11 by arnaud nouard on 21/01/2016 - 18:54

      Hi,
      First thanks for commenting my work :).
      Then, on which exact JRE version do you run your apps?
      I do not have issues on Mac 8u60.
      Thanks.

      • #12 by egranlund on 21/01/2016 - 19:00

        Windows 8.1, 10, and Centos 7 (Gnome 3.14)
        JDK 8u60 on all 3

  6. #13 by Akki on 27/01/2016 - 20:49

    Hey Arnaud, spectacular work out there mate. Loved it.
    Actually em beginner to JavaFX, can u tell me how to implement this in our NetBeans project.?

  7. #17 by Jeremy Zang on 27/06/2016 - 22:44

    Hey Arnaud, great work. I am amazed. I hope some day I can be as good at coding as you are. I am trying to implement your code in my app I’m making. I’m using eclipse. I was able to use your code if I import your jar file and use it as a library, however the problem with this is I want to customize it a little more to change the picture of the buttons to match the theme of my app and also change the code for the close button so it closes the background process of the app on close. Which is the entire purpose of me implementing a custom window and title bar. But, when I import the Jar file I cannot edit it in any way (at least that I know of). I was wondering if you could offer some insight on how to use your code in a way i can make changes to it in my eclipse project. Thanks in advance!

    • #18 by arnaud nouard on 28/06/2016 - 11:06

      Hi and thank you for the kind words!
      Regarding the customization, the right way to do it is to duplicate the built-in stagedecoration.fxml (from the jar or https://github.com/in-sideFX/UndecoratorBis/blob/master/src/insidefx/undecorator/stagedecoration.fxml).
      Then edit it in SceneBuilder where you’re be able to apply your own pictures.
      Then, in the code, specify your own decoration fxml file, when creating the Scene. To do so, you have to call the entire contructor -> UndecoratorScene(Stage stage, StageStyle stageStyle, Region root, String stageDecorationFxml).
      Hope this helps.
      Thanks.

      • #19 by Jeremy Zang on 28/06/2016 - 22:17

        That helped. I understand what you’re saying. So right now I am using the jar file as a library in eclipse. I basically moved the jar file into my project and through the properties I added the jar file as a library. Is that what you mean? I then took and copied the stagedecoration.fxml and pasted that into my project as well. which if I am understanding you correctly this is then where i then apply the pictures. right? But my thought was i could use css to apply the images like you do in your css file. If I am understanding things correctly. However I cant get the images to be applied via css. Perhaps I don’t know enough about css. I’ve been trying to pick it up as I go.

      • #20 by arnaud nouard on 29/06/2016 - 12:28

        Ok. You simply need to change the images. In that case you simply have to attach YOUR Css to the stagedecoration.fxml (in SceneBuilder), and load the fxml as mentioned above.

        Other simple alternative is to add your CSS on top of other to the Scene to override mine.

        UndecoratorScene.STYLESHEET = “path/yourCSS.css”;
        or
        undecorator.getStylesheets().add(“path/yourCSS.css”);

        Good luck.

      • #21 by Jeremy Zang on 29/06/2016 - 22:51

        Awesome! Thanks Arnaud. I got it all figured out. It works great. I just have to figure out the right size image to use I think. I don’t know much about that.

      • #22 by arnaud nouard on 30/06/2016 - 13:58

        Usually the pictures are 34×30. But take a look at https://github.com/in-sideFX/UndecoratorBis/tree/master/src/skin and set your own pictures with the same sizes.

  8. #23 by Jeremy Zang on 27/07/2016 - 16:50

    Hey Arnaud I’ve Been using your Undecorator for one of my recent projects and I’ve Noticed a few issues. The windows + arrowkeys shortcut in windows doesn’t work, and also when you click the icon on the windows task back to minimize it that does not work either. These are probably known to you and I’m not complaining by any means. I just was curious if we could discuss solutions or workarounds I could implement to fix this? I would appreciate your input, and again, great work!

    • #24 by arnaud nouard on 27/07/2016 - 20:25

      Hey Jeremy, thank you for the feedback and for taking care of my ego :).
      I think you refer to this issue: https://github.com/in-sideFX/UndecoratorBis/issues/7.
      Could you tell me if you have same behavior with Ensemble demo?
      http://www.oracle.com/technetwork/java/javase/overview/javafx-samples-2158687.html

      Thanks.

      • #25 by Jeremy Zang on 27/07/2016 - 23:10

        Yeah that is the same issue I’m not sure if its a real issue or it works how you designed it. It has the same behavior as the Ensemble demo. That is, when clicking on the taskbar icon it does not minimize like other operating system windows do.

        Have you dealt with this issue already? My thought is that when you undecorate any window in javafx this happens and maybe is a simple fix for you to add to your code. I’m not 100% sure. I was hoping to work with you on this issue if you so wish.

        One other issue I just noticed using my other computer which has multiple screens of different sizes and pixels Undecorator has all sorts of resizing issues when moving from screen to screen. You may be aware of this already as well. I will post more details about this if you need me to. Basically my program breaks when moving it between multiple screens of different sizes. I don’t see this problem being wide spread because who buys three different size screens. But my computer at work does have that.

  9. #26 by Saul Henríquez (@otakuhqz) on 30/08/2016 - 20:52

    Excelent job. I just have tree questions:
    1 – how can I hide the full screen button?
    2 – It looks like the Windows+M doesn’t work.
    3 – how can I removethe button on the upper left corner and use context menu instead of it?

  1. MagniFiX | In-SideFX
  2. Java desktop links of the week, January 12 « Jonathan Giles
  3. Undecorator – “Add a better look to your JavaFX stages” – Part I | In-SideFX
  4. Undecorator Bis | Dinesh Ram Kali.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: