about javafx webview and javafx animation, svg

Question

1. Question about webview node in javafx. I've make svg animation and then call it into webview node in javafx. It seem's like work well but, because of webview has oriental background color, it covering other node. So make webview's opacity to 0.2 . as a result, it give transparency not only background but also animation on webview. It make's me crazy. Help.

2. About javafx rotateAnimation. this is not complex. But can't solve my self T.T. makes ImageView node into Scene and play rotate imageView indifinitly. it works very well, but one thing so ridiculous. When it rotate finish 360, it look's like stop momently. And then rotate start again, and at finish it stop again, start again, stop again at finish... how can I prevent, "stop rotate momently" at finish of rotate. Save me.. T.T

3. About right way about java graphics. I want to make java animation and graphic as much as I likes. But it looks like difficult.. at first, I was wanted make my custom loading progressBar. so I try to make animation using swing paint, paintComponent.. etc.. but in progressing.. I notice javafx is java graphics future. And.. wow, javafx co-operate with css, javascript, scene builder, svg .. so try to one by one.. but fx - css it's not oriental css syntax so find some reference guide and use it. But that oracle guide is not all of fx-css contents. So when I need to some style, I have to find in google. Occasionaly, it failed.. so I think, "it's not good way to graphics.." so try to svg, and success to make animation. But failed to import svg to javafx.. so find..find..find.. .. finally I've find solution. It was svg into webview. But it return to question 1.

Want to know what is right way to custom java graphic and animation.

Answer 1

WebView Background Opacity

So make webview's opacity to 0.2 . as a result, it give transparency not only background but also animation on webview

There is a feature request (JDK-8090547) to allow the opacity of the WebView background to vary independently of the content of the WebView. As of Java 8 the feature request has not been implemented. You can vote for the feature or comment on it. It is one of the most highly voted feature requests for JavaFX. It is currently not scheduled for implementation in an upcoming release.

As a partial workaround, you can use MiPa's suggestion from an Oracle forum thread (though it does have disadvantages and is not a complete solution):

• You can achieve a kind of transparency effect by playing with the blend modes of the web view. If you have a web page with a white background and black letters, you can achieve a transparency effect by setting the blend mode to MULTIPLY.

  webView.setBlendMode(BlendMode.MULTIPLY);
  

Animation Interpolation

When it rotate finish 360, it look's like stop momently. And then rotate start again, and at finish it stop again, start again, stop again at finish... how can I prevent, "stop rotate momently" at finish of rotate.

The behaviour you describe, speeding up when starting an animation cycle and slowing down when stopping an animation cycle, is known as "easing in" and "easing out", which is a kind of tweening. The amount of rotation is varying with time by an interpolated easing function. You can find examples of such easing functions (those examples are for JavaScript, but the concept is generic to animation frameworks and applies to JavaFX).

The default interpolation behaviour for a Transition is a EASE_BOTH interpolation, as described in the setInterpolator javadoc.

So, to get a smooth cycle for your RotateTransition, you should explicitly set the interpolator on the transition to LINEAR.

Rectangle rectangle = new Rectangle(100, 100, 50, 50, Color.CRIMSON);
RotateTransition rotator = new RotateTransition(Duration.seconds(2), rectangle);
rotator.setInterpolator(Interpolator.LINEAR);
rotator.setCycleCount(Animation.INDEFINITE);
rotator.play();

Control Customization

custom loading progressBar

JavaFX already has a ProgressBar which is pretty customizable. It's probably best to start from that and customize it then try to build your own.

Want to know what is right way to custom java graphic and animation.

There is no one right way, as you have found, there are different approaches which are more or less suited for different tasks. There is not enough information in your question for anybody to really advise you on this.

I do think that using WebView to host animated SVGs in JavaFX, just for animation purposes, is a kind of strange solution - but that doesn't mean its "wrong".

Advice for future questions

If you have further questions, ask them as a follow up (new) question and include in it, images, videos, animated gifs, descriptions of the required animation, your sample code attempting to implement it, etc.

I know your questions are kind of linked in what you are doing, but, for your next questions, if you can split things like this out into separate questions and just provide links in the questions to related topics, that makes it easier for you to get good answers.

Save me.. T.T

Saved . . . ;-)