I need to apply multiple effects ( mainly innershadow and dropshadow ) through CSS. But I'm not able to chain these effects.
Is there CSS equivalent for setInput() of javafx.scene.effect.Effect?
So far I found only this link. It indicates something about fixes but no details about how to use chaining.
EDIT: Further explanation if question is not clear:
to apply effect through css, -fx-effect
is used. I need to apply multiple effects to same node. How to "chain" these effects in CSS? This can be easily done through code using setInput() mentioned earlier.
TIA
相关问题
- Adding a timeout to a render function in ReactJS
-
Why does the box-shadow property not apply to a
- Add animation to jQuery function Interval
- jQuery hover to slide?
- Issue with star rating css
As @Lorand mentions, it's not possible to chain effects via CSS.
He also gives the link of a well known example of chaining effects via code.
I'll provide a solution with FXML, using that same example to compare results.
By (updated) code:
Note that the effects are defined in reverse order of application. For the sake of clarity, we could also write this:
Now let's use Scene Builder 2.0 to create an FXML file
circle.fxml
.Once we have the circle, we set the
DropShadow
effect, and then we edit the effect, and selectReplace Effect Input
option from the menu button:Then choose
InnerShadow
, define the effect, and select againReplace Effect Input
, selecting againInnerShadow
:Define the effect, save and exit. This will be the source code:
Finally, loading this file in our scene:
This will be the result:
It's currently not possible in Java 7 nor in Java 8 to chain effects or apply multiple effects via CSS. See the Oracle CSS Documentation.
It's also mentioned in the CSS vs Code article.