Google+ Badge

Thursday, January 19, 2012

The land of JXLayer

I am deeper into the MigCalendar to JIDE conversion process. I am still working on the prototype for the scheduler control and have a good hunk of the rendering working. That means I get to play with drag to size and drag to move. I am using a JXLayer to handle this as the main JIDE grid needs to do its own row height and column width sizing that I don't want to screw up. JXLayer is really nice in that your can paint anything on a glass pain after all the stuff under the glass has already rendered. I have appointments so I keep their rounded rectangle associated to them. If the cursor is over / near the top or bottom edge of the rounded rectangle I paint a thicker border for the rectangle in the JXLayer. The JXLayer also watches for mouse press / release actions for the thick border rectangle so I can start dragging operations allowing the user to resize the appointment to a new time frame.

Next up was the auto scrolling of the JideScrollPane as they near the edges of the screen. I have to monitor the viewport rectangle for changes while I am in my dragging code to adjust my rectangles. Lots and lots of point and rectangle processing going on in this code along with clipping and offset calculations. At this point it is all working rather nicely although I can get it to screw up a bit from time to time. I need to figure out snapping to time slots. I don't want to increment by the minute but maybe 15 minutes is too much. They can always popup a true time editor dialog to get exact numbers. The drag to size needs to be reasonable but not so crappy you will never use it. Dragging the appointment to another cell in the grid also needs to happen. For that I am thinking of a simple drag to let you move it anywhere, a CTRL + drag to only move the appointment vertically (i.e. change start time) and a SHIFT + drag to only move horizontally (i.e. under another provider, facility, room or category depending on the current column configuration). There are a lot of time you only want to change one axis and I know a lot of paint programs use CTRL, ALT and SHIFT to lock the mouse movement.

With that in mind I am considering a "status bar" custom control to show the tool tip text, row (time slot) and column (provider, etc.) information as multiple level row / column headers can be off screen meaning you don't know exactly where you are in the grid always without this special status information.

 Writing a scheduler has been a unique experience for sure. You see various 3rd party .NET controls that emulate Outlook in one fashion or another. There is almost nothing other than MigLayout on the Java side. We need to be cross platform so .NET is out even though I know how to code in C#. The other choice would be a web based product but we a lot of support data that needs to be cached leaving that out too.

Sometimes writing your own control is the only option. I have used JXLayer in the past to draw spinning busy cursors. I had not used it for mouse interaction. It has been pretty easy so far once you figure out your painting offsets based on the scrollpane and other JComponents you are dealing with. Not sure what I would do if I need to port this to a touch interface for iOS or Android. My boss got Ice Cream Sandwich on this Xoom this morning. My updates always seem to be a day or so later in the staggered refresh cycle but I am excited to give it a shot when it magically appears. He tried our mobile app out under it and it appeared to work fine. Not a big surprise as the same code base works on phones and tablets. I am using 2.1 as minimum required API so I am not using any cool fragments or other tablet features that appeared in the 3.x series. I just want to see the bad boy running and to play with the new OS stuff.