This CSS code changes the text color of the whole text of a MenuItem:
.context-menu .label {
-fx-text-fill: blue;
}
The thing is that I only want to change the Accelerator display text.
The CSS reference of JavaFX was not very helpful: https://docs.oracle.com/javase/8/javafx/api/javafx/scene/doc-files/cssref.html#contextmenu
So how can you set the style of the Accelerator display text in a ContextMenu using CSS?
I inspected the skin and found out the accelerator-text class is assigned to the Label that displays the accelerator, which means you can use
.context-menu .accelerator-text {
-fx-text-fill: blue;
}
to style the Label displaying the accelerator.
I just gave a menuItem an id
fxml:
<MenuItem id="menuItem" mnemonicParsing="false" text="Close" accelerator="Shortcut+C"/>
and tried:
css:
#menuItem>Label {
-fx-background-color: #0093ff;
-fx-text-fill: #ffff00;
}
and it worked.
Related
I have a button in JavaFx stylized with CSS, but without "button:hover" clause. The text alignment in css is set to right, but sometimes apears aligned to left. When I put mouse over button, the text alignment change from left to right and I don't have nothing in CSS about onMouseOver (or that I think ). I don't know if is a bug.
CSS:
.button{
-fx-font-size: 1em;
-fx-padding: 0 0 -30 0;
}
.menu, .label{
-fx-font-size: 0.8em;
}
...
#btPlusLargo{
-fx-background-color: transparent;
-fx-background-image: url('../resources/plus.png');
-fx-text-alignment: right;
-fx-background-repeat: no-repeat;
-fx-background-position: left center;
-fx-padding: 0 0 0 0;
}
...
In FXML
<Button id="btPlusLargo" fx:id="btEntregaTodo" layoutX="773.0" layoutY="532.0"
mnemonicParsing="false" onAction="#onClickAgregaTodo" prefHeight="25.0"
prefWidth="150.0" stylesheets="#botones.css" text="%bt.AgregaTodo"
textAlignment="RIGHT" AnchorPane.bottomAnchor="104.0"
AnchorPane.rightAnchor="9.0" />
Without mouse over
With mouse over (It would always have to be like that.)
Edit:
Ok, I see that it depends on the TableView above the button. If I select the Table View, I have the problem, but when I click out of TableView, it's show ok.
Edit2: It shows badly when I click on any other FXML field
I just want to change the color of the fill circle on a RadioButton. Surprisingly I couldn't find this in documentation. Is it possible?
I found this similar thread with a solution that is not working for me: CSS Change radio button color in JFXRadioButton
Here is how I have tried it (also tried other variations to no avail):
.radio-button .radio {
-fx-selected-color: yellow;
-fx-unselected-color: blue;
}
-jfx-selected-color and -jfx-unselected-color are not defined in JavaFX. They are attributes from JFoenix (docs). Also -fx-selected-color and -fx-unselected-color are not available in JavaFX.
To change the color of the dot in the RadioButton you can use the :selected pseudoclass like this (docs):
.radio-button:selected .radio .dot {
-fx-background-color: red;
-fx-background-insets: 0;
}
Additionally to the -fx-background-color you should set -fx-background-insets: 0;, because otherwise the dot is not exactly in the center anymore.
The result will look like this:
In my Eclipse RAP application I have a theme with declared CSS styles for controls Button, Combo ...
I have the following problem, creating controls (e.g. Button) with a FormToolkit the background and foreground color is ignored.
Normal Button:
new Button(parent, SWT.PUSH);
FormToolkit Button:
managedForm.getToolkit().createButton(parent, "search", SWT.PUSH);
This is the CSS that I use:
Button[PUSH] {
border: 1px solid #C5C5C5;
/* fancy test colors */
background-color: #0000ff;
color: #00ff00;
}
Normal Button
FormToolkit Button
This is especially bad because the hover effect is ignored as well. Is there a way to enforce the FormToolkit to also use the CSS styles?
I figured out a workaround, not the desired solution but works for now:
// hack to ensure CSS styles are used
toolkit.getColors().setBackground(null);
toolkit.getColors().setForeground(null);
If the colors are set to null, CSS style is used.
I can not set transparent background in scrollpane. Probably because it contains anchorpane, and that anchorpane contains buttons? White background from scrollpane and red from anchorpane:
You have to use css and like this:
.scroll-pane{
-fx-background-color:transparent;
}
and(cause ScrollPane has a Viewport)
.scroll-pane > .viewport { //not .scrollpane but .scroll-pane
-fx-background-color: transparent;
}
or
.scroll-pane .viewport {
-fx-background-color: transparent;
}
If it doesn't work,either you have not defined externall css file well,or you have added some kind of container into the ScrollPane which has also a default background color.
Set an id to your AnchorPane in the fxml and then in your css assign the id to -fx-background-color : transparent.
Hope this works.
if not Please Refer to this question
JavaFX ScrollPane border and background
i try to build a Calculator in JavaFX and i want to dynamicly change the Font size when a certain amount of numbers are on the display,so that it will fit.
This works as i want it to when i set the Text Alignment to the Left.
But this does infact not work when i use any Text Alignment on the right side,it buggs out.
To be more specific, look at the following pictures:
This is the size default at startup:
http://www7.pic-upload.de/19.02.14/8xjsfv1awtl1.jpg
Then i change the font size:
http://www7.pic-upload.de/19.02.14/9518liqv4ebw.jpg
You can see the alignment is broken....
But the funny part is when you click into the Textfield it will fix itself and will look like this:(no Link because of reputation limitation crap)
www7.pic-upload.de/19.02.14/5e3ddqyt575o.jpg
Is there a workaround? Here are some examples of my code:
GUI.fxml
<TextField fx:id="display" alignment="BASELINE_RIGHT" cache="false" editable="false" layoutX="18.0" layoutY="17.0" maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" onKeyPressed="#keylistener" prefHeight="54.0" prefWidth="206.0" promptText="" styleClass="textcustom, rand, backgroundfield" text="" />
Application.css
.background {
-fx-background-color: #4682B4;
}
.backgroundfield {
-fx-background-color: #F5F5F5;
}
.button {
-fx-background-color: #FFF5EE;
}
.textcustom{
-fx-font: 26px "Serif";
}
.rand{
-fx-border-style: solid;
-fx-border-color: black ;
-fx-border-width: 1px;
}
The Java Code to change the Font:
display.setStyle("-fx-font: 18px Serif;");
It seems to be a bug. The workaround can be to use javafx.scene.control.Label instead of TextField.