Hey Chris, quick question for you. We’re having issues where the drawing of the
arrow is delayed from the drawing of the line. In the video you can see as I
drag things around, the arrow has a slight, elastic delay with the line:
http://gfycat.com/OpulentBouncyFrillneckedlizard
I hope that makes sense. Basically, you can see that the arrow is slightly
delayed and has to “catch up” to the line even after the dragging of the boxes
has stopped.
Do you have any ideas as to what we should look into so we can fix this?
Before, when we were drawing a polygon rather than using an arrow bitmap and
SmoothLine, this problem didn’t exist. Or perhaps we just didn’t notice.
Thanks again for all the help you’ve provided!
Mike Gallagher
—
Sent from Mailbox
On Mon, Jul 20, 2015 at 1:07 PM, Chris Barker <[email protected]>
wrote:
> On Mon, Jul 20, 2015 at 11:48 AM, Michael Gallagher <
> [email protected]> wrote:
>> Thank you very much for the reply. I wanted to get some clarification on
>> what you meant by your custom draw object suggestion. I think this is what
>> I have done, and I linked to it in my last message. Here's a screenshot of
>> that code snippet:
>>
>> [image: Inline image 1]
>>
>> As you can see, I'm using composition here rather than inheriting from
>> BOTH SmoothLine and BitmapWithRotation. If I bind to a SmoothLineWithArrow
>> object, the HTdc is not set to anything for self.Arrow when I call its draw
>> function. Therefore, the arrow's bindings do not end up working.
>>
> This should work -- it's pretty much what I meant. I think the trick here
> is that when you bind,
> The SmoothLineWithArrow is getting set to be "hitable", which means that it
> will draw itself to the Hit test DC, but self.Arrow is not having it's
> hitable attribute set, so it's not drawing to the hit test bitmap.
> Sorry, no time to dig inot the code to reming myself what those attributes
> are calles, or exatcly when they are set, but hopefully this is enough to
> get you started.
> NOTE: I think the Group object may do this, so you could look there.
> -CHB
>> If I bind to the arrow itself like this though...
>>
>> line = SmoothLineWithArrow(...)
>> line.Arrow.Bind(...)
>>
>> then it works. However, this brings in a lot of issues because these event
>> functions don't receive the whole line object but rather a
>> ScaledBitmapWithRotation object, with no reference to its line. I hope this
>> all makes sense. So, if there is a way to bind to a SmoothLineWithArrow and
>> have it draw with HitPen and HitBrush over the actual Arrow object, that
>> would be ideal.
>>
>> Also, the suggestions to rotate the image and then scale it down sounds
>> like a fantastic idea! Thanks again for that.
>>
>> Mike
>>
>> On Thu, Jul 16, 2015 at 6:02 PM, Chris Barker - NOAA Federal <
>> [email protected]> wrote:
>>
>>> Sounds like you got some cool stuff working!
>>>
>>> But on a phone so can't check it out too carefully.
>>>
>>> As for binding to the line with arrow, I'd probably make a single
>>> DrawObject that had the line and the arrow. In its _draw, you make sure to
>>> draw both the line and a box or circle for the arrowhead to the hit test
>>> buffer.
>>>
>>> Or, similarly, take your SmoothLineWithArrow object and have it call
>>> the scaled bitmap with rotation's _draw_ for the hit test buffer.
>>>
>>> For going out of the Window, Wx has events like EVT_LEAVE_WINDOW, or
>>> something like that. You could bind to that and do something...
>>>
>>> And for rotation quality -- check if Wx.Image has any flags to set the
>>> algorithm -- maybe there is a better quality than the default.
>>>
>>> Or maybe you come do the math to correct the position for the rotated
>>> bitmap in GC -- but what a pain!
>>>
>>> Or you could make the bitmap bigger, then rotate it and then scale down (
>>> with anti-aliasing ) that might mitigate the quality issue a bit.
>>>
>>> Final option -- draw your arrows, rather than using a bitmap -- you can
>>> do pretty well with a couple triangles for an arrow head.
>>>
>>> If you go that route, look at the ArrowLine object ( or something like
>>> that) for rotating the arrowheads.
>>>
>>> HTH,
>>> -Chris
>>>
>>> Sent from my iPhone
>>>
>>> On Jul 16, 2015, at 4:39 PM, Michael Gallagher <[email protected]>
>>> wrote:
>>>
>>> Woops! I meant "I would simply like to be able to bind to the 'line'
>>> object and have it include the *arrow bitmap, *if that's possible"
>>>
>>> On Thu, Jul 16, 2015 at 5:33 PM, Michael Gallagher <
>>> [email protected]> wrote:
>>>
>>>> Hi Chris,
>>>>
>>>> It's been awhile, but we got this working for the most part. The
>>>> rotation issue we ran into was because the dimensions of the image would
>>>> changing as we'd rotate, and I got that all sorted out luckily. In the end,
>>>> I've created three classes:
>>>>
>>>> - SmoothLine (based on yours, but with a midPoint attribute)
>>>> - ScaledBitmapWithRotation
>>>> - SmoothLineWithArrow (inherits from SmoothLine and has a
>>>> ScaledBitmapWithRotation attribute)
>>>>
>>>> All three are highlighted here just in case you're curious:
>>>>
>>>> https://github.com/Castronova/EMIT/blob/64b99c7e969f11834e46c6b1107462065dd73bb1/gui/controller/logicCanvasObjects.py#L242-320
>>>> (fyi my ScaledBitmapWithRotation class probably has some redundant code)
>>>>
>>>> Also, here's a short video of what we have now:
>>>> http://gfycat.com/OpulentBouncyFrillneckedlizard
>>>>
>>>> The issue that I'm having lately is that I need to be able to bind mouse
>>>> events to SmoothLineWithArrow's arrow attribute. Here is where I'm doing
>>>> that:
>>>>
>>>>
>>>> https://github.com/Castronova/EMIT/blob/64b99c7e969f11834e46c6b1107462065dd73bb1/gui/controller/logicCanvas.py#L321-322
>>>>
>>>> So there's a couple things here. First, on line 310 I create the
>>>> SmoothLineWithArrow object as 'line'. Adding 'line' to FloatCanvas works
>>>> just fine visually, but I am unable to bind to line's arrow attribute. This
>>>> only works if I explicitly add 'line.Arrow' to the FloatCanvas. This allows
>>>> bindings to work, but this creates an issue with menu actions because on
>>>> these mouse events, the 'event' is just a ScaledBitmapWithRotation object,
>>>> which is just the arrow bitmap with no reference to the SmoothLineWithArrow
>>>> object that it belongs to. I would simply like to be able to bind to the
>>>> 'line' object and have it include the
>>>>
>>>> Can you think of any good workarounds for this? What I have now feels a
>>>> bit hackish, and unfortunately doesn't work when a user wants to remove
>>>> these lines/links.
>>>>
>>>> A couple other questions I had:
>>>> - Rotating a wxImage doesn't end up looking quite as nice as using a
>>>> GraphicsContext to draw the bitmap. The only thing preventing me from using
>>>> a GraphicsContext is that its Rotate function does not allow you to choose
>>>> a center of rotation. It seems to rotate at the top left of the image. Do
>>>> you have any ideas on how to handle this? Google hasn't been very helpful
>>>> for this.
>>>>
>>>> - You can see in my video that we get some weird issues once a box is
>>>> dragged a bit too far out of the FloatCanvas. We want to prevent a user
>>>> from dragging a box outside of the canvas. Do you have any pointers on how
>>>> I would go about that? I could figure this out by getting the distances
>>>> from the cursor to the edges of the draggable object and going down that
>>>> path, but I was wondering if FloatCanvas has anything worth looking into
>>>> that might be helpful for that.
>>>>
>>>> Thanks again for all your help!
>>>>
>>>> Mike Gallagher
>>>>
>>>> On Wed, Jun 24, 2015 at 5:46 PM, Chris Barker <[email protected]>
>>>> wrote:
>>>>
>>>>> Looks like good progress!
>>>>>
>>>>> A couple notes, having looked at this VERY quickly:
>>>>>
>>>>> https://vid.me/GuFR
>>>>>>
>>>>>>
>>>>> cool! -- but yes, I see your issue.
>>>>>
>>>>>
>>>>>> The angle of the box and the arrow is updated in the OnMove function
>>>>>> in logicCanvas.py. In that same file, here is the section of code where
>>>>>> I'm
>>>>>> grabbing a rotated image from self.Image:
>>>>>>
>>>>>>
>>>>>> https://github.com/Castronova/EMIT/blob/mike-experiment/gui/controller/logicCanvas.py#L52-69
>>>>>>
>>>>>> As you suggested, I tried to make a subclass of ScaledBitmap with a
>>>>>> rotation feature. I'm still fairly new to Python, so I apologize if any
>>>>>> of
>>>>>> this a poor implementation. Perhaps there is something I'm doing wrong
>>>>>> there, because it does not appear to rotate around the CENTER of the
>>>>>> image,
>>>>>> as you can see in those videos.
>>>>>>
>>>>>
>>>>> I see this:
>>>>>
>>>>> # Using ImageMidPoint seems to do the same thing as (0,0)
>>>>> Img = self.Image.Rotate(self.RotationAngle, (0,0))
>>>>>
>>>>> so maybe some sort of bug in wx.Image. I"d try some test code ans use
>>>>> wx.Image.SaveFile() to save it out and see if produces what you expect
>>>>> when
>>>>> you change the centre_of_rotation parameter.
>>>>>
>>>>> But another issue is that when you rotate a rectangular image, the
>>>>> resulting image may not be the same size (or it would cut off the corners.
>>>>> So when you rotate the image, you may have to re-set something in
>>>>> ScaledBitmap, so it can place the new one in the right place. note that wx
>>>>> naturally draws images placed on a location on the corner, so to place it
>>>>> relative to the center point, it needs to know what size it is -- if the
>>>>> size is wrong, the shift to the center point will be wrong.
>>>>>
>>>>> re-setting self.self.Height and self.Width should do it.
>>>>>
>>>>> Also, you may want to derive from FloatCanvas.Bitmap, rather than from
>>>>> ScaledBitmap, though it may make no difference since you are overriding
>>>>> the
>>>>> differences, anyway...
>>>>>
>>>>> If you'd like to run this yourself, feel free to pull down the latest
>>>>>> commit of my branch called 'mike-experiment':
>>>>>> https://github.com/Castronova/EMIT/tree/mike-experiment
>>>>>>
>>>>>
>>>>> no time for that now -- but it looks good.
>>>>>
>>>>>
>>>>>> One more issue that we're having that you might be able to help with
>>>>>> is bindings. For some reason, the bindings are not being added. There is
>>>>>> no
>>>>>> warning or error - they simply don't work. Here is where we add them:
>>>>>>
>>>>>>
>>>>>> https://github.com/Castronova/EMIT/blob/mike-experiment/gui/controller/logicCanvas.py#L368-369
>>>>>>
>>>>>> When our arrow was a simple Polygon object, it worked just fine. You
>>>>>> can see the code for that old function in createArrowOld. If you have any
>>>>>> ideas what might be causing either of those issues, it would be greatly
>>>>>> helpful for us!
>>>>>>
>>>>>
>>>>> I think so -- Floatcanvas does hit detection by drawing each object in
>>>>> a unique color on an offscreen bitmap -- then it can check the color of a
>>>>> pixel to know what got hit. For an object to be hit-able, it must
>>>>> impoliment drawing to teh Hit Test bitmap in its _Draw method. Somethign
>>>>> like:
>>>>>
>>>>> if HTdc and self.HitAble:
>>>>> HTdc.SetPen(self.HitPen)
>>>>> HTdc.SetBrush(self.HitBrush)
>>>>> HTdc.DrawRectanglePointSize(XY, (W, H) )
>>>>>
>>>>> See the ScaledBitmap example.
>>>>>
>>>>> That should do it
>>>>>
>>>>> -CHB
>>>>>
>>>>>
>>>>>> On Tue, Jun 23, 2015 at 9:17 AM, Chris Barker <[email protected]>
>>>>>> wrote:
>>>>>>
>>>>>>> On Tue, Jun 23, 2015 at 7:33 AM, Michael Gallagher <
>>>>>>> [email protected]> wrote:
>>>>>>>
>>>>>>>> Thank you very much for getting back to me. I had a quick glance
>>>>>>>> over the ScaledBitmap class, and I think I have a grasp on what might
>>>>>>>> need
>>>>>>>> to happen. I'll be able to dig back into this next week most likely,
>>>>>>>> and
>>>>>>>> I'm sure I'll have more questions.
>>>>>>>>
>>>>>>>
>>>>>>> Sounds good -- feel free to send question, and also be sure to let us
>>>>>>> know once you get it all figured out!
>>>>>>>
>>>>>>> -Chris
>>>>>>>
>>>>>>>
>>>>>>>
>>>>>>>> Mike
>>>>>>>>
>>>>>>>> On Mon, Jun 22, 2015 at 2:11 PM, Chris Barker <[email protected]
>>>>>>>> > wrote:
>>>>>>>>
>>>>>>>>> By the way,
>>>>>>>>>
>>>>>>>>> If you do add rotation to bitmaps, I'll probably want to add it to
>>>>>>>>> FC as a regular feature. So let me know how it works out.
>>>>>>>>>
>>>>>>>>> -CHB
>>>>>>>>>
>>>>>>>>>
>>>>>>>>> On Mon, Jun 22, 2015 at 12:03 PM, Chris Barker <
>>>>>>>>> [email protected]> wrote:
>>>>>>>>>
>>>>>>>>>> Note: I've cc-d this to the floatcanvas mailing list:
>>>>>>>>>>
>>>>>>>>>> http://mail.paulmcnett.com/cgi-bin/mailman/listinfo/floatcanvas
>>>>>>>>>>
>>>>>>>>>> please keep the conversation there, so it will get archived.
>>>>>>>>>>
>>>>>>>>>> It is a VERY low traffic list!
>>>>>>>>>>
>>>>>>>>>>
>>>>>>>>>> Hi Michael,
>>>>>>>>>>
>>>>>>>>>> Glad you're finding FC useful!
>>>>>>>>>>
>>>>>>>>>> I'm currently a CS student for Utah State University and I'm
>>>>>>>>>>> working with the Utah Water Research Lab on this project
>>>>>>>>>>> <https://github.com/Castronova/EMIT>, where we're using wxPython
>>>>>>>>>>> and your wonderful project, FloatCanvas. I'm not a hydrologist, and
>>>>>>>>>>> I'm
>>>>>>>>>>> fairly new on this project so I'm not quite sure what our project is
>>>>>>>>>>> entirely for. Needless to say though, it's going to help the
>>>>>>>>>>> University's
>>>>>>>>>>> research.
>>>>>>>>>>>
>>>>>>>>>>
>>>>>>>>>> at a glance it does look pretty cool.
>>>>>>>>>>
>>>>>>>>>>
>>>>>>>>>>> One of the things I've been assigned is to improve the UI a bit.
>>>>>>>>>>> Here's our FloatCanvas part of the application:
>>>>>>>>>>>
>>>>>>>>>>> <image.png>
>>>>>>>>>>>
>>>>>>>>>>> Unfortunately the way this spline is being drawn (the folks who
>>>>>>>>>>> wrote this didn't realize that there was an existing spline object
>>>>>>>>>>> in
>>>>>>>>>>> floatcanvas) is very inefficient.
>>>>>>>>>>>
>>>>>>>>>>
>>>>>>>>>> at a glance, I saw a bunch of code for drawing the arrow -- did
>>>>>>>>>> you look at the code for the Arrow and ArrowLIne objects?
>>>>>>>>>>
>>>>>>>>>> but it looks like you may want to use a bitmap for the arrow
>>>>>>>>>> anyway -- it does let you make it prettier.
>>>>>>>>>>
>>>>>>>>>>
>>>>>>>>>>
>>>>>>>>>>> When these boxes are dragged around, we get major frame-rate
>>>>>>>>>>> drops. Luckily I've been able to begin the work on sorting this out
>>>>>>>>>>> to
>>>>>>>>>>> improve dragging-and-dropping, and one of the things I'm struggling
>>>>>>>>>>> with is
>>>>>>>>>>> knowing what to do about rotating a bitmap. I have this icon here:
>>>>>>>>>>>
>>>>>>>>>>> [image: Inline image 2]
>>>>>>>>>>>
>>>>>>>>>>> I would like this PNG to replace the arrow you see above in the
>>>>>>>>>>> main screenshot. However, this requires us to rotate the bitmap as
>>>>>>>>>>> these
>>>>>>>>>>> boxes are dragged around.
>>>>>>>>>>>
>>>>>>>>>> Currently I don't think there's a way to do this in FloatCanvas.
>>>>>>>>>>>
>>>>>>>>>>
>>>>>>>>>> nope -- I only supported axis-aligned bitmaps so far.
>>>>>>>>>>
>>>>>>>>>> The best solution I can come up with for now is to remove, and
>>>>>>>>>>> rotate the icon as a wxImage, and then re-add it on each frame
>>>>>>>>>>> draw. I'm
>>>>>>>>>>> not sure this is the best way of doing it though, and I thought I'd
>>>>>>>>>>> reach
>>>>>>>>>>> out to you and get your opinion on the matter.
>>>>>>>>>>>
>>>>>>>>>>
>>>>>>>>>> yeah, you should be able to do better.
>>>>>>>>>>
>>>>>>>>>> You probably don't want the arrow to change size as you zoom, so
>>>>>>>>>> you are likely using a Bitmap object.
>>>>>>>>>>
>>>>>>>>>> But take a look at the ScaledBitmap object code to get an idea:
>>>>>>>>>>
>>>>>>>>>> it stores a wx.Image object.
>>>>>>>>>>
>>>>>>>>>> In the _Draw method, it scales the Image, then draws it.
>>>>>>>>>>
>>>>>>>>>> Note that it caches the scaled version, so that it doesn't need to
>>>>>>>>>> re-scale unless the size changes.
>>>>>>>>>>
>>>>>>>>>> So: I'd subclass, or simply copy the Bitmap object, and add an
>>>>>>>>>> attribute for rotation angle, then write a _Draw method that does the
>>>>>>>>>> rotation on the fly, similarly to how the ScaledImage object does the
>>>>>>>>>> re-scaling.
>>>>>>>>>>
>>>>>>>>>> That should be pretty fast, and if you cache the rotated bitmap,
>>>>>>>>>> then it will be blazingly fast when the angle hasn't changed.
>>>>>>>>>>
>>>>>>>>>> Also -- once you'
>>>>>>>>>> ve got that working, I'd either:
>>>>>>>>>>
>>>>>>>>>> Make a Group object that puts teh line and the arrow together.
>>>>>>>>>>
>>>>>>>>>> or
>>>>>>>>>>
>>>>>>>>>> make Custom DrawObject that draws both the line and the arrow.
>>>>>>>>>>
>>>>>>>>>> I always intended it to be easy to write your own DrawObjects --
>>>>>>>>>> but never documented it very well...
>>>>>>>>>>
>>>>>>>>>> Do take a look at:
>>>>>>>>>>
>>>>>>>>>> http://trac.paulmcnett.com/floatcanvas
>>>>>>>>>>
>>>>>>>>>> if you haven't already -- there are a few examples there.
>>>>>>>>>>
>>>>>>>>>> And I hope you've found the examples in the demos dir in teh
>>>>>>>>>> source:
>>>>>>>>>>
>>>>>>>>>>
>>>>>>>>>> http://svn.wxwidgets.org/viewvc/wx/wxPython/3rdParty/FloatCanvas/Demos/
>>>>>>>>>>
>>>>>>>>>> There is a lot there!
>>>>>>>>>>
>>>>>>>>>> -Chris
>>>>>>>>>>
>>>>>>>>>>
>>>>>>>>>>
>>>>>>>>>>
>>>>>>>>>>
>>>>>>>>>>
>>>>>>>>>> --
>>>>>>>>>>
>>>>>>>>>> Christopher Barker, Ph.D.
>>>>>>>>>> Oceanographer
>>>>>>>>>>
>>>>>>>>>> Emergency Response Division
>>>>>>>>>> NOAA/NOS/OR&R (206) 526-6959 voice
>>>>>>>>>> 7600 Sand Point Way NE (206) 526-6329 fax
>>>>>>>>>> Seattle, WA 98115 (206) 526-6317 main reception
>>>>>>>>>>
>>>>>>>>>> [email protected]
>>>>>>>>>>
>>>>>>>>>
>>>>>>>>>
>>>>>>>>>
>>>>>>>>> --
>>>>>>>>>
>>>>>>>>> Christopher Barker, Ph.D.
>>>>>>>>> Oceanographer
>>>>>>>>>
>>>>>>>>> Emergency Response Division
>>>>>>>>> NOAA/NOS/OR&R (206) 526-6959 voice
>>>>>>>>> 7600 Sand Point Way NE (206) 526-6329 fax
>>>>>>>>> Seattle, WA 98115 (206) 526-6317 main reception
>>>>>>>>>
>>>>>>>>> [email protected]
>>>>>>>>>
>>>>>>>>
>>>>>>>>
>>>>>>>
>>>>>>>
>>>>>>> --
>>>>>>>
>>>>>>> Christopher Barker, Ph.D.
>>>>>>> Oceanographer
>>>>>>>
>>>>>>> Emergency Response Division
>>>>>>> NOAA/NOS/OR&R (206) 526-6959 voice
>>>>>>> 7600 Sand Point Way NE (206) 526-6329 fax
>>>>>>> Seattle, WA 98115 (206) 526-6317 main reception
>>>>>>>
>>>>>>> [email protected]
>>>>>>>
>>>>>>
>>>>>>
>>>>>
>>>>>
>>>>> --
>>>>>
>>>>> Christopher Barker, Ph.D.
>>>>> Oceanographer
>>>>>
>>>>> Emergency Response Division
>>>>> NOAA/NOS/OR&R (206) 526-6959 voice
>>>>> 7600 Sand Point Way NE (206) 526-6329 fax
>>>>> Seattle, WA 98115 (206) 526-6317 main reception
>>>>>
>>>>> [email protected]
>>>>>
>>>>
>>>>
>>>
>>
> --
> Christopher Barker, Ph.D.
> Oceanographer
> Emergency Response Division
> NOAA/NOS/OR&R (206) 526-6959 voice
> 7600 Sand Point Way NE (206) 526-6329 fax
> Seattle, WA 98115 (206) 526-6317 main reception
> [email protected]
_______________________________________________
FloatCanvas mailing list
[email protected]
http://mailman.paulmcnett.com/cgi-bin/mailman/listinfo/floatcanvas
