B4J Library jCustomWindow

Hi,

I am very happy to share the first version of my jCustomWindow Library with you guys. jCustomWindow allows you to customize completely the window container of your application and have a consistent style cross-platform.

This is a list of what you can do:

• Customize the title's text and style.
• Set a custom icon.
• Add an infinite number of buttons
• Set custom images for each button
• Set a pre-built action (Exit, full screen, maximize, minimize) for each button or call your own events.
• Get notified for each pre-built actions.
• Full screen mode, with no title bar.
• Set the window resizable or not.
• Set a custom style and width for the window's borders.
• Animations when maximizing.
• Adjustable animation speed.
• Uniform style, cross-platform.
• Window is resizable (now only at right and bottom corners).
• Maximizing will maximize on the active screen in the case of multi-monitor setup.

Note:

• You should initialize the jCustomWindow BEFORE calling the Form.Show (as in the example)
• You should set the formStyle of your form to "UNDECORATED" (as in the example)
• You need to copy the jCustomWindow.fxml to your files folder.

Some images:

Additional info:

• Icons in the folder have been created from the Android Icon Pack by Google. (I modified them a bit). I allow you to use the icons I modified freely, just check the Google's policy regarding their icon pack.
• The CSS for the buttons and title have been inspired by this page: http://fxexperience.com/2011/12/styling-fx-buttons-with-css Check it out, some good stuff there.

Enjoy.

Change Log:

2014-02-20: Fixed a few bugs:

• bugFix: Window borders would disappear when the window was scaled down.
• BugFix: Window borders were still visible in fullscreen mode.
• Change: iBorderWidth changed from Int to Double (not script breaking).

2014-02-19: Version 1 released.

2014-02-18: Alpha version.

 

[Erel]

Very nice. I didn't see any animation though... I tried to minimize it and then maximize it.

Consider adding a "minimize to tray" button.

 

[magoandroid]

Hi jmon,
thanks for this share.
You are sharing a lot of your work (I appreciate).

Cheers
MAgo

 

[jmon]

Very nice. I didn't see any animation though... I tried to minimize it and then maximize it.

Strange... By animation I meant a scaling animation. Don't you see the window growing to fit the desktop?

Consider adding a "minimize to tray" button.

Ok, I'll add this button tomorrow. I'll also add a method to set the button images by code (thanks for your reply in the bug forum).

Hi jmon,
thanks for this share.
You are sharing a lot of your work (I appreciate).

Thanks, I really want to support the B4J project. I also want to give as much as I take

 

[Erel]

Don't you see the window growing to fit the desktop?

No. Maybe it is related to the Windows settings. Lets whether it works for others.
I've tried it on Windows 7.

 

[jmon]

It shouldn't be related to windows settings, because I have implemented the animation using timers. Maybe there's a bug. I'll check this out tomorrow. Thanks for your feedback.

edit: btw I have tried it on windows 7 x64
edit: I am using the same animation technique as I used in the jNotification class, using timers.

 

[jmon]

Hi everyone,

I've just heavily updated the library. Please download the new one, there are a lot of script-braking changes:

• Lots of methods have been renamed.
• You can now add an unlimited number of buttons.
• New method: CustomWin.Buttons return a list of all the buttons.
• New way for creating buttons. Now you should create the buttons in your code and get the return value of ButtonAdd.
  btnMinimize = CustomWin.ButtonAdd("Minimize", 0)

• You can decide to set the buttons to text only or with images, or both. For no text, just set "" in the Text field.

• Events (I call them ACTIONS), should now be assigned manually to your buttons.
  CustomWin.ButtonBindToAction(btnMinimize, CustomWin.ACTION_MINIMIZE)

• You can now also add custom images by code this way:
  CustomWin.ButtonSetImage(btnMinimize, File.DirAssets, "btnMinimize.png")

• The method Icon has been modified:
  CustomWin.SetIcon(File.DirAssets, "Icon.png")

• New event for buttons with no ACTION binded:
  CustomWin_MouseClicked (ButtonSender As Button, EventData As MouseEvent)

Please download the updated code and library on the first post. I also have released the source code for those who want to tweak it or learn from it.

 

[Erel]

Looks great! Thank you for all these great contributions!

 

[jmon]

Looks great! Thank you for all these great contributions!

Thanks Erel, thanks to you too for releasing B4J, I really love it!

The library has been updated:

2014-02-20: Fixed a few bugs:

• bugFix: Window borders would disappear when the window was scaled down.
• BugFix: Window borders were still visible in fullscreen mode.
• Change: iBorderWidth changed from Int to Double (not script breaking).

The layout file has been updated too.

 

[JakeBullet70]

WOW!!! Great Lib!

 

[lymey]

I really like this Library, thank you! but I think there is a bug in the appearance of the cursor when you move the form.

Shouldn't the cursor/pointer stay as a pointer instead of changing to a finger when you place it on the button bar at the top of the form? I understand why when you move it over buttons, but not when you want to move the form.
Also is it possible to change the resize cursor/pointer to something instead of a finger?

But the bug I think, is that the 'movement' cross/pointer should only be visible when the mouse button is pressed and revert back to the pointer when it is released. At the moment (on Windows 7) the 'movement' cross/pointer remains after the button is released and only changes back to a pointer when the mouse is moved.

If it isn't a bug I appologise, but can you tell me how I can change the cursor/pointer.

Thanks again!

 

[jmon]

I really like this Library, thank you! but I think there is a bug in the appearance of the cursor when you move the form.

Hi, thanks for your comments.

Well, it's not really a bug, it's just that I haven't set the cursors the way you suggested. I may change it to the way you suggested when I have some time to work on it. I will also change the cursors when resizing from the edges, to show an arrow.

You can change the cursor with css:

-fx-cursor    [ null | crosshair | default | hand | move | e-resize | h-resize | ne-resize | nw-resize | n-resize | se-resize | sw-resize | s-resize | w-resize | v-resize | text | wait ] | <url>    null        inherits

or by using

fx.Cursors.

and modify the cursor appearance when entering the resize or hover events.

Actually I have done it a bit in some events. For instance, you can check the event apWindowTop_MousePressed and apWindowTop_MouseReleased and see how it's done.

'Notice how the cursor is set to move on pressed event:
Private Sub apWindowTop_MousePressed (EventData As MouseEvent)
    If Not(isAtFinalPos) Then Return
    apWindowTop.MouseCursor = fx.Cursors.MOVE '<<< Here
    iMoveOriginPosX = EventData.X
    iMoveOriginPosY = EventData.Y
End Sub

'and changed back to hand on release:
Private Sub apWindowTop_MouseReleased (EventData As MouseEvent)
    apWindowTop.MouseCursor = fx.Cursors.HAND '<<< and Here
End Sub

I'm working at the moment on a modification that would make it possible to resize the window from the top and the left side too.

If you modify the code, please share!

 

[ziomorgan]

Hi,
how can I apply these customizations to a child window?
thanks

 

[ziomorgan]

Hi,
how can I apply these customizations to a child window?
thanks

I found...
CustomWin.Initialize(Me, "enter here the reference to the child window", "CustomWin")
thank you

 

[hookshy]

Maximize the window it does not look good ... it does not do a smooth animation but a treble one

 

[jmon]

Maximize the window it does not look good ... it does not do a smooth animation but a treble one

I have implemented the scale animation with a timer. I guess it's not the best method, but I haven't found another way for animating the window... You can still disable the animation with the provided method and it will scale instantly. If you have any other suggestion on how to improve the scaling animation, please share.

 

[JakeBullet70]

Hi @jmon

I just re-downloaded the lib and example but am running into the error below. Any ideas?

Thanks

 

[jmon]

running into the erro

Strange it looks like you dont have the anchorpane control. Which version of java do you have?

Edit : i just noticed i had the same error once :https://www.b4x.com/android/forum/t...r-anchorpanewrapper-loadlayout-in-3-50.57224/

So just recompile the library it should work. Ill update the jar file in the first post.

 

[walterf25]

Strange it looks like you dont have the anchorpane control. Which version of java do you have?

Edit : i just noticed i had the same error once :https://www.b4x.com/android/forum/t...r-anchorpanewrapper-loadlayout-in-3-50.57224/

So just recompile the library it should work. Ill update the jar file in the first post.

I just tried your library and i get the same error as @JakeBullet70, i take it you did not upload the new jar files yet?

I'am using the latest B4J Version 4.7 with Java jdk1.8.0_91

Thanks,
Regards,
Walter

 

[jmon]

you did not upload the new jar files yet

No, sorry I haven't uploaded yet. I'll do it asap