Hi,
Here was I thinking I was doing fine using Batik with just one
question so far yesterday, now I ran into a different issue again
already.
What I'm basically trying to achieve is the following:
---------------------------------------------------------------------------------------
<rect x="20" y="20" width="250" height="250"
style="opacity:0;fill:blue" id="rect_highlight">
<animate attributeType="CSS" attributeName="opacity" from="0"
to="1" begin="0s;fade_out.end" dur="3s" id="fade_in"/>
<animate attributeType="CSS" attributeName="opacity" from="1"
to="0" begin="fade_in.end" dur="3s" id="fade_out"/>
</rect>
---------------------------------------------------------------------------------------
Where the rect constantly fades in and out. Loading the document like
this in Batik results in no problems, it works as expected.
There are, however, two things that need to be done different:
1. The animation need to start at on an event
2. The animation elements need to be added by means of Java.
Removing the '0s' from the fade_in element's begin attribute and using
the following takes case of the first thing (as in: it works):
---------------------------------------------------------------------------------------
SVGAnimateElement fadeInAnimation = (SVGAnimateElement)
svgDoc.getElementById("fade_in");
fadeInAnimation.beginElement();
---------------------------------------------------------------------------------------
Settings the values of both begin attributes is what's causing
problems. Setting the value (the id of the second element) in the
first element's attribute while the second one isn't added yet results
in a NullPointerException.
Trying to deal with this issue in the following way:
---------------------------------------------------------------------------------------
Element rectHighlight = svgDoc.getElementById("rect_highlight");
SVGAnimateElement fadeInAnimation = (SVGAnimateElement)
svgDoc.createElementNS(svgNS, "animate");
fadeInAnimation.setAttributeNS(null, "attributeType", "CSS");
fadeInAnimation.setAttributeNS(null, "attributeName", "opacity");
fadeInAnimation.setAttributeNS(null, "from", "0");
fadeInAnimation.setAttributeNS(null, "to", "1");
fadeInAnimation.setAttributeNS(null, "dur", "3s");
fadeInAnimation.setAttributeNS(null, "id", "fade_in");
rectHighlight.appendChild(fadeInAnimation);
Element fadeOutAnimation = svgDoc.createElementNS(svgNS, "animate");
fadeOutAnimation.setAttributeNS(null, "attributeType", "CSS");
fadeOutAnimation.setAttributeNS(null, "attributeName", "opacity");
fadeOutAnimation.setAttributeNS(null, "from", "0");
fadeOutAnimation.setAttributeNS(null, "to", "1");
fadeOutAnimation.setAttributeNS(null, "begin", "fade_in.end");
fadeOutAnimation.setAttributeNS(null, "dur", "3s");
fadeOutAnimation.setAttributeNS(null, "id", "fade_out");
rectHighlight.appendChild(fadeOutAnimation);
fadeInAnimation.setAttributeNS(null, "begin", "fade_out.end");
fadeInAnimation.beginElement();
---------------------------------------------------------------------------------------
This results in the rect fading in and out only once.
Settings both begin attributes after both elements have been appended
results in the animation to fade in once with the rect disappearing as
soon as the fade in animation finishes.
Retrieving the animation elements over again
(getElementById("fade_in"), etc.), just in case, just before settings
the begin attribute makes no difference.
What is the proper way to deal with the NullPointerException when
you're trying to add an element referencing another element which
isn't present yet? Or is there a way without depening on the addition
order as much as above?
Why does the animation only run once when using the above example? I
get the feeling that the begin attributes aren't properly set (or at
all) but why?
Yours,
Age Bosma
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
