B4J Question MenuBar Background

[Guenter Becker]

Hello,
Sorry I'm no CSS programmer. Need to give the Menubar Bar Background a shaded Color. Tried some CSS from the Web but they don't work.
Anyone helping me with a snipped. Thankyou.

 

[PaulMeuris]

You could do a google search with the words: javafx css gradient
The AI overview gives you all the possible css settings.

Changes in your MyMenu.css file:

{
    -fx-my-menu-color: linear-gradient(from 0% 0% to 100% 100%, #ff0000, #0000ff);    /*#0134fa;*/
}

.menu-bar {
    -fx-background-color: -fx-my-menu-color;
}

In your Main module you can comment the line:

'    b4x.SetColorAndBorder(xui.color_blue,2dip,xui.Color_Black,5dip)

 

[Guenter Becker]

Godd Morning PaulMeuris this is what i want it works thank you.

 

[Guenter Becker]

You could do a google search with the words: javafx css gradient
The AI overview gives you all the possible css settings.
View attachment 167592
Changes in your MyMenu.css file:

{
    -fx-my-menu-color: linear-gradient(from 0% 0% to 100% 100%, #ff0000, #0000ff);    /*#0134fa;*/
}

.menu-bar {
    -fx-background-color: -fx-my-menu-color;
}

In your Main module you can comment the line:

'    b4x.SetColorAndBorder(xui.color_blue,2dip,xui.Color_Black,5dip)

 

[Guenter Becker]

Hello Paul,
looked on your named web page and found this

.linear-grad-to-top{
    -fx-background-color: linear-gradient(to top, #ff7f50, #6a5acd);
}

Sorry I'm no CSS prgrammer and I tried to implement it but get always errors where must I place this?

 

[PaulMeuris]

You can use it in the menu bar css:

.menu-bar {
/*    -fx-background-color: -fx-my-menu-color; */
    -fx-background-color: linear-gradient(to top, #ff7f50, #6a5acd);
}

The gradient goes from bottom to top.

 

[Guenter Becker]

You can use it in the menu bar css:

.menu-bar {
/*    -fx-background-color: -fx-my-menu-color; */
    -fx-background-color: linear-gradient(to top, #ff7f50, #6a5acd);
}

The gradient goes from bottom to top.
View attachment 167605

Great didi now for all other directions and used it for the new MenuBar CustomView. Thank you.