Discussions
Categories
- 385.5K All Categories
- 5.1K Data
- 2.5K Big Data Appliance
- 2.5K Data Science
- 453.4K Databases
- 223.2K General Database Discussions
- 3.8K Java and JavaScript in the Database
- 47 Multilingual Engine
- 606 MySQL Community Space
- 486 NoSQL Database
- 7.9K Oracle Database Express Edition (XE)
- 3.2K ORDS, SODA & JSON in the Database
- 585 SQLcl
- 4K SQL Developer Data Modeler
- 188K SQL & PL/SQL
- 21.5K SQL Developer
- 46 Data Integration
- 46 GoldenGate
- 298.4K Development
- 4 Application Development
- 20 Developer Projects
- 166 Programming Languages
- 295K Development Tools
- 150 DevOps
- 3.1K QA/Testing
- 646.7K Java
- 37 Java Learning Subscription
- 37.1K Database Connectivity
- 201 Java Community Process
- 108 Java 25
- 22.2K Java APIs
- 138.3K Java Development Tools
- 165.4K Java EE (Java Enterprise Edition)
- 22 Java Essentials
- 176 Java 8 Questions
- 86K Java Programming
- 82 Java Puzzle Ball
- 65.1K New To Java
- 1.7K Training / Learning / Certification
- 13.8K Java HotSpot Virtual Machine
- 94.3K Java SE
- 13.8K Java Security
- 208 Java User Groups
- 25 JavaScript - Nashorn
- Programs
- 667 LiveLabs
- 41 Workshops
- 10.3K Software
- 6.7K Berkeley DB Family
- 3.6K JHeadstart
- 6K Other Languages
- 2.3K Chinese
- 207 Deutsche Oracle Community
- 1.1K Español
- 1.9K Japanese
- 474 Portuguese
put rotate only in icon from css

it is possible to place rotation icon in css from "Button" ?
Thank's
.my-button { -fx-skin: "com.sun.javafx.scene.control.skin.ButtonSkin"; -fx-background-color: -fx-shadow-highlight-color, -fx-outer-border, -fx-inner-border, -fx-body-color; -fx-background-insets: 0 0 -1 0, 0, 1, 2; -fx-background-radius: 5, 5, 4, 3; -fx-padding: 0.166667em 0.833333em 0.25em 0.833333em; -fx-text-fill: -fx-text-base-color; -fx-alignment: CENTER; -fx-content-display: LEFT; -fx-graphic: url('images/vector-combine.png'); /* <--- put rotate only icon into Button ??? */ }
Answers
-
No, you cannot rotate a button graphic defined by -fx-graphic using CSS.
You could perform the rotation via FXML or in Java Code, but not via CSS.
*Update* -> I was wrong, see bouye's answer below for a solution of how to rotate the graphic using CSS.
-
You can get the graphics node from the button via the graphicProperty(), set a style-class on it, and use css as you wish. Add a listener to the graphicProperty and set the style-class there.
-
Dear David, thank you for sharing your knowledge and your precious time.
I will test your solution.
Thank you -
Actually you can simply do this:
.my-button { -fx-graphic: url('images/vector-combine.png'); /* <--- put rotate only icon into Button ??? */ } .my-button .image-view { -fx-rotate: 45; }
-
Thank's bouye-JavaNet, is possible put width and height into image-view ?
bouye-JavaNet wrote: Actually you can simply do this:
- .my-button .image-view {
- -fx-rotate: 45; /* <---- yes work correct */
- -fx-pref-width : 16px; /* no work */
- -fx-pref-height : 16px; /* no work */
- }
.my-button { -fx-graphic: url('images/vector-combine.png'); /* <--- put rotate only icon into Button ??? */ } .my-button .image-view { -fx-rotate: 45; }
other question :
into caspian.css no have ".image-view", where you found ".image-view" ?
Thank's
-
> into caspian.css no have ".image-view", where you found ".image-view" ?
Not everything is in caspian.css. You can determine the actual CSS used in a SceneGraph, using ScenicView:
Scenic View // JavaFX News, Demos and Insight // FX Experience
You should probably be using Java 8+ anyway, that uses modena.css, not caspian.css.
> is possible put width and height into image-view ?
I don't know the answer to this one either, ImageView has fitWidth/fitHeight properties and an image itself can have it's size specified in it's constructor, but I don't think any of that information is exposed through css attributes (although, maybe bouye or somebody else knows how to accomplish this).
https://docs.oracle.com/javase/8/javafx/api/javafx/scene/image/ImageView.html#fitWidthProperty
-
Unfortunately css documentation javafx is poor, lacks examples the level of internal engineering, but the idea is great.
-
Yes, as pointed by jsmith, by using ScenicView you would have been able to notice that, when using JavaFX 8, the ImageView created by the CSS' -fx-graphic selector sports the "image-view" style class. It's basically just what I did before coming up with the CSS I gave you.
Now I agree that:
- It's poorly described both in the CSS guide for -fx-graphic and in the javadoc for Labelled.
- When setting a graphic on a Labelled that node should receive the "graphic" (or something similar) style class for better styling.
-
Also no, you cannot set fit-width and fit-height in CSS currently, see: https://bugs.openjdk.java.net/browse/JDK-8152187