JavaFX-自定义按钮形状

Question

I want a Button to look like below shape in JavaFX ,

with, -fx-background-radius: 20; i am able to achieve the corner radius .

How should i proceed further to get the above shaped Button .

Answer 1

You need to use the -fx-shape property.

You can find it in Oracle's reference guide: https://docs.oracle.com/javafx/2/api/javafx/scene/doc-files/cssref.html#references

This is is also useful to understand how to draw the "path" associated with your shape: https://www.w3.org/TR/SVG/paths.html

You may want to use an SVG editor for your shape's path; for example: https://github.com/SVG-Edit/svgedit

something like this should do the trick; you should need to add the curves -fx-shape: "M50 100 L150 100 L180 250 L20 250 Z";