You are viewing a plain text version of this content. The canonical link for it is here.
Posted to batik-users@xmlgraphics.apache.org by Phillip Ganir <ph...@yahoo.com> on 2006/06/10 14:54:43 UTC
On Changing the Mouse Cursor Appearance
Hi,
I'm having problems on changing the appearance of the mouse cursor when
an event happens. I have an svg element on a JSVG Canvas, rect to be exact,
and I want to change the cursor whenever I click on the parts of the
rectange. I want crosshair if I hover the mouse in the middle, and w-resize
and e-resize when the mouse is hovered in the edges. I already have my event
listeners on the rectangle and i want it to go with the mouseover event.
I tried including a cursor attribute in the rect element, such as:
<rect id="BaseRectangle" x="0" y="0" height="300" width="515" fill="red"
cursor="default"/>
and I change the attribute's value to a type I want in the event handler:
( (Element) evt.getTarget() ).setAttribut("cursor", "w-resize" );
Is there anything I'm doing wrong or anything I'm lacking to do?
I also tried including cursor and pointer-events (with value "fill")
attribute at the svg (root) element and also the latter to the rect element,
but nothing changes.
I would really appreciate answers from you. Thank you very much in
advance.
Phillip
---------------------------------------------------------------------
To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org
Re: On Changing the Mouse Cursor Appearance
Posted by Andreas Neumann <ne...@karto.baug.ethz.ch>.
Hi Phillip,
I believe Thomas answered your question in his last email.
>>>
>>>
>>>
>>>
>>no need to set the pointer-events attribute. The default value is "fill"
>>anyway.
>>
>>
>
> But, is this attribute needed to be in every element and in the root or
>just either? Although I tried both. :)
>
>
no, as I said, it is not needed. I was slightly wrong with the default
value. It is actually "visiblePainted" which includes "fill" and
"stroke" if the element is visible. See
http://www.w3.org/TR/SVG11/interact.html#PointerEventsProperty for the
exact definition.
If the default value works for you, you don't need to specify it.
Andreas
--
----------------------------------------------
Andreas Neumann
Institute of Cartography
ETH Zurich
Wolfgang-Paulistrasse 15
CH-8093 Zurich, Switzerland
Phone: ++41-44-633 3031, Fax: ++41-44-633 1153
e-mail: neumann@karto.baug.ethz.ch
www: http://www.carto.net/neumann/
SVG.Open: http://www.svgopen.org/
Carto.net: http://www.carto.net/
---------------------------------------------------------------------
To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org
Re: On Changing the Mouse Cursor Appearance
Posted by Phillip Ganir <ph...@yahoo.com>.
Andreas Neumann <neumann <at> karto.baug.ethz.ch> writes:
>
>
> > I tried including a cursor attribute in the rect element, such as:
> >
> > <rect id="BaseRectangle" x="0" y="0" height="300" width="515"
fill="red"
> >cursor="default"/>
> >
> >
> >
> yes, that cursor attribute is correct. But it is not clear from your
> example whether you have an event listener attached or not. You could
> either do it by using the "on..." event handler attributes or by using
> elt.addEventListener(listenertype,functionOrObject,bubblingOrCapturephase);
>
Actually, I've already added event listeners by calling this function
we made whenever a rectangle is added in the svg so every rectangle has an
event listener. We tested this already with other events concerning changing
attributes of the rect element and it's successful:
addListener( Element elt)
{
Element element = elt;
EventTarget event = (EventTarget) element;
event.addEventListener( "mousedown", downPt, false );
}
Where downPt is an instance of a class that with an event hanling
function that changes the value of the cursor attribute with the following
excerpt:
if(xDown >= rectLeftPart && xDown <= rectRightPart)
{
( (Element) evt.getTarget() ).setAttributeN(null,
"cursor", "crosshair");
}
if(xDown > rectRightPart)
{
( (Element) evt.getTarget() ).setAttributeNS( null, "cursor", "e-resize");
}
if(xDown < rectLeftPart)
{
( (Element) evt.getTarget() ).setAttributeNS( null, "cursor", "w-resize");
}
where xDown is the point where the mouse is clicked and rectLeftPart and
rectRightPart are respectively the area < 0.1* rectangle's width and >0.9*
rectangle's width (i.e., the leftmost 10% and rightmost 10% of the rectangle's
width). So I think there should be no problem meanwhile I haven't created
invisible rectangles encapsulating the rect element (although it's a good idea
that we were also planning before).
> > and I change the attribute's value to a type I want in the event
handler:
> >
> > ( (Element) evt.getTarget() ).setAttribut("cursor", "w-resize" );
> >
> >
> >
> the correct syntax would be:
>
> evt.target.setAttributeNS(null,"cursor","w-resize");
The dropdown menu don't have this exact syntax. Actually we tried the
syntax i mentioned above with other attributes and they were successully
changed. I'm also printing the changes in the cursor attribute and it's being
chnaged successfully. But, the changes doesn't manifest visibly. What could be
lacking?
>
> depending on what you want to do it might also make sense to have the
> event listener not on the rectangle but on the document or a parent
> group or an invisible element that is slightly bigger than your
> rectangle, because you probably want to set the cursor also on the edge
> or slightly outside the rectangle within a sensitive edge around the
> rectangle.
>
> > Is there anything I'm doing wrong or anything I'm lacking to do?
> >
> > I also tried including cursor and pointer-events (with value "fill")
> >attribute at the svg (root) element and also the latter to the rect
element,
> >but nothing changes.
> >
> >
> no need to set the pointer-events attribute. The default value is "fill"
> anyway.
But, is this attribute needed to be in every element and in the root or
just either? Although I tried both. :)
>
> Andreas
>
Thanks a lot for your initial reply! I hope there's next. :)
Phillip
---------------------------------------------------------------------
To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org
Re: On Changing the Mouse Cursor Appearance
Posted by Andreas Neumann <ne...@karto.baug.ethz.ch>.
> I tried including a cursor attribute in the rect element, such as:
>
> <rect id="BaseRectangle" x="0" y="0" height="300" width="515" fill="red"
>cursor="default"/>
>
>
>
yes, that cursor attribute is correct. But it is not clear from your
example whether you have an event listener attached or not. You could
either do it by using the "on..." event handler attributes or by using
elt.addEventListener(listenertype,functionOrObject,bubblingOrCapturephase);
> and I change the attribute's value to a type I want in the event handler:
>
> ( (Element) evt.getTarget() ).setAttribut("cursor", "w-resize" );
>
>
>
the correct syntax would be:
evt.target.setAttributeNS(null,"cursor","w-resize");
depending on what you want to do it might also make sense to have the
event listener not on the rectangle but on the document or a parent
group or an invisible element that is slightly bigger than your
rectangle, because you probably want to set the cursor also on the edge
or slightly outside the rectangle within a sensitive edge around the
rectangle.
> Is there anything I'm doing wrong or anything I'm lacking to do?
>
> I also tried including cursor and pointer-events (with value "fill")
>attribute at the svg (root) element and also the latter to the rect element,
>but nothing changes.
>
>
no need to set the pointer-events attribute. The default value is "fill"
anyway.
Andreas
--
----------------------------------------------
Andreas Neumann
Institute of Cartography
ETH Zurich
Wolfgang-Paulistrasse 15
CH-8093 Zurich, Switzerland
Phone: ++41-44-633 3031, Fax: ++41-44-633 1153
e-mail: neumann@karto.baug.ethz.ch
www: http://www.carto.net/neumann/
SVG.Open: http://www.svgopen.org/
Carto.net: http://www.carto.net/
---------------------------------------------------------------------
To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org
Re: On Changing the Mouse Cursor Appearance
Posted by th...@kodak.com.
Hi Phillip,
news <ne...@sea.gmane.org> wrote on 06/10/2006 08:54:43 AM:
> I'm having problems on changing the appearance of the mouse cursor
when
> an event happens. I have an svg element on a JSVG Canvas, rect to be
exact,
> and I want to change the cursor whenever I click on the parts of the
> rectange.
There is a good chance that this is a bug in Batik. I think we only
check the cursor property when the mouse enters/exits an element. So
a change of the cursor without the cursor leaving or entering an element
may not update the cursor.
If you could provide a test case in a bugzilla bug it would help us
check and ensure that we don't forget about this problem (if it is one).
> I want crosshair if I hover the mouse in the middle, and w-resize
> and e-resize when the mouse is hovered in the edges. I already have my
event
> listeners on the rectangle and i want it to go with the mouseover event.
You might consider creating 'hidden' elements over the areas you want
the cursor to change (thin rects on the edges of the base rect, that have
the cursor attribute already set).
> I tried including a cursor attribute in the rect element, such as:
>
> <rect id="BaseRectangle" x="0" y="0" height="300" width="515"
fill="red"
> cursor="default"/>
>
> and I change the attribute's value to a type I want in the event
handler:
>
> ( (Element) evt.getTarget() ).setAttribut("cursor", "w-resize" );
>
> Is there anything I'm doing wrong or anything I'm lacking to do?
>
> I also tried including cursor and pointer-events (with value
"fill")
> attribute at the svg (root) element and also the latter to the rect
element,
> but nothing changes.
>
> I would really appreciate answers from you. Thank you very much in
> advance.
Probably not the answer you wanted to hear, but there it is...
---------------------------------------------------------------------
To unsubscribe, e-mail: batik-users-unsubscribe@xmlgraphics.apache.org
For additional commands, e-mail: batik-users-help@xmlgraphics.apache.org