Hopefully Peter will find a solution based on your input.  But I think a
problem still exists.

The basic problem is how to find the x,y position of a child within its
parent.  I believe Peter is saying that the x and y getters in UIBase are
not reporting correct values in many cases in the browser.  Apparently,
you can ask for the child.x and child.y of a child that is visibly not at
0,0 in its parent and you will get 0.  I think we haven't noticed that
because nobody currently cares, but it kinds of bugs me that something
that "basic" doesn't do the right thing all of the time.

Thoughts?
-Alex


On 8/30/17, 7:53 AM, "Peter Ent" <p...@adobe.com.INVALID> wrote:

>I'm trying to draw a drop indicator above the row in the DataGrid where
>new data would be inserted if the user releases the mouse button at that
>point.
>
>The drop indicator is being drawn in a layer (added by a new bead) that is
>floating above the <div> containing the DataGrid's column lists.
>
>As the mouse is detected over an itemRenderer, I need to know the
>itemRenderer's position within its list so I can translate that into
>global space and then into the space of the layer.
>
>However, what you just wrote gave me another idea that might just work.
>
>Thanks!
>—peter
>
>On 8/30/17, 10:30 AM, "Yishay Weiss" <yishayj...@hotmail.com> wrote:
>
>>Strike that. I don’t see what you’re saying. Why not just use 0,0? Why do
>>you need x,y? Or you could add w/2, h/2 if you want to center the drop
>>target.
>>
>>Looking at PointUtils.localToGlobal() it just calls
>>element.getBoundingClientRect() (as you suggested) and adds the given x,y
>>to the result.
>>
>>From: Yishay Weiss<mailto:yishayj...@hotmail.com>
>>Sent: Wednesday, August 30, 2017 5:11 PM
>>To: dev@flex.apache.org<mailto:dev@flex.apache.org>
>>Subject: RE: [FlexJS] Finding (x,y) position
>>
>>I see what you’re saying. I think we worked around that issue in our app
>>by relying on MouseEvent.clientX, MouseEvent.clientY. But let’s hear
>>other ideas for a more complete solution.
>>
>>From: Peter Ent<mailto:p...@adobe.com.INVALID>
>>Sent: Wednesday, August 30, 2017 4:48 PM
>>To: dev@flex.apache.org<mailto:dev@flex.apache.org>
>>Subject: Re: [FlexJS] Finding (x,y) position
>>
>>PointUtils works when it has the correct data. For example, if you are
>>over an itemRenderer, say the first one, and want to get its global
>>location, you might do:
>>
>>var pt0:Point = new Point(itemRenderer.x, itemRenderer.y)
>>
>>and use pt0 in PointUtils.localToGlobal function. The problem is,
>>itemRenderer.x/y are not correct at all times. Because this itemRenderer
>>is the first itemRenderer and in the upper-left corner of its List, you
>>would expect it to be (0,0) but instead it is (0,30) for example where 30
>>is the height of the ButtonBar used for the header.
>>
>>Further, the itemRenderer's parent, a <div>, also has location (0,30) and
>>its parent, again a <div> is (0,30).
>>
>>This happens because the layout used to place everything is just relying
>>on display:block and none of the <div>s have position set to anything;
>>the
>>only <div> with position is the one representing the DataGrid itself.
>>
>>The .x and .y functions look at the "left" and "top" styles first.
>>Finding
>>these are not set, the functions then return offsetLeft and offsetTop,
>>which are the offsets from the ancestor with position set. That's the
>><div> for the DataGrid. Hence they are at (0,30).
>>
>>I see two choices: use getClientBoundingRect or change the layouts to set
>>position:relative on their contentView but this might break something
>>else
>>at some point.
>>
>>I was wondering if anyone had experience trying to figure out screen
>>positions when using the offset properties.
>>
>>
>>‹peter
>>
>>On 8/30/17, 3:02 AM, "Yishay Weiss" <yishayj...@hotmail.com> wrote:
>>
>>>Peter,
>>>
>>>Is PointUtils.localToGlobal() not working for you? From what I
>>>understand
>>>it takes approach (1).
>>>
>>>From: Peter Ent<mailto:p...@adobe.com.INVALID>
>>>Sent: Tuesday, August 29, 2017 11:29 PM
>>>To: dev@flex.apache.org<mailto:dev@flex.apache.org>
>>>Subject: [FlexJS] Finding (x,y) position
>>>
>>>Hi,
>>>
>>>While working on drag-and-drop, I've made an "interesting" discovery
>>>having to do with the HTML-side's x and y getter functions.
>>>
>>>Let's say you have a nesting of <div>s:
>>>
>>><div style="position:relative" id="outer">
>>>   <div id="header" style="height:30px">Š</div>
>>>    <div id="wrapper">
>>>        <div id="inner">
>>>             <div class="ItemRenderer" id="first">Š</div>
>>>        </div>
>>>    </div>
>>></div>
>>>
>>>(this structure is similar to what is generated for DataGrid).
>>>
>>>If you attempt to get the y location of "first" itemRenderer, you will
>>>get 30 back as the answer. That happens because the y getter first looks
>>>to see if the object has a "top" style value and, finding none, returns
>>>its offsetTop. In this case, offsetTop is 30 and offsetParent is
>>>"outer".
>>>If you get the y value of "inner" you will also get 30 as the answer for
>>>the same reason.
>>>
>>>If each of the <div>s had position:relative (or absolute), then
>>>offsetTop
>>>would be as you would expect with each offsetParent being the <div>
>>>above
>>>it.
>>>
>>>Our layout functions (and x and y setters) do not normally set the
>>>position style on element. I removed this a good while ago. Now I am
>>>trying to place a drop target indicator and to do that I need accurate
>>>(x,y) locations.
>>>
>>>I have a couple of solutions:
>>>
>>>
>>>  1.  For any element, look at its getBoundingClientRect and compare
>>>with
>>>its elementParent.getBoundingClientRect. The difference between then
>>>gives the child's position relative to the parent. This seems reliable.
>>>  2.  Attempt to divine a child's position using the offset information.
>>>I can't make this work.
>>>  3.  Modify the layouts to check the contentView's value of position
>>>and
>>>if not set already, set it to "relative". This makes the x and y getters
>>>return the right thing but may have unintended consequences.
>>>
>>>Any advice from seasoned JavaScript developers is greatly appreciated!
>>>
>>>Thanks,
>>>Peter
>>>
>>
>

Reply via email to