cltom

Hello, this is a topic over which I have been turning in circles sinces years. Which graphics library to choose for which task. What functionality is there, how hard is it to accomplish the given task. This may sound generic but I feel with graphics libraries it is the desperately hard. For my applications I often have some drawing functionality. For some applications I found reasonable approaches: for some GDI+, for other cases GR32. For one specific project/idea I am stuck however, meanwhile to a pretty extensive degree. I guess the fundamental problem is that all libraries would do the trick it is just my lack of skill (despite the years of trying) prevents progress. So I have been looking into all sorts of libraries, packages, demos, examples, recommendations and threads which of course does not accomplish the actual goal. What the application should do: from a library of images the user should be able to drag and drop elements to the main image. Those elements can then be moved, deleted, rotated, single or in groups. I was pretty far with that approach with Graphics32, not quite there yet, though. The functionality to mark multiple elements was missing. More accuarely, the functionality to find/mark objects was rubbish too. Later I found the TRubberband which could help but there I guess for my skill-level graphics32 might not be the right tool. I was lucky enough that some approaches worked but the documentation, the examples, I spend hours and hours trying to understand it with little success. Other than that I found the learning curve of GR32 brutally steep given that the documentation and demos are not easy to understand and there are pretty much no introduction like tutorials. One of the examples that was actually really helpful was the "Reflect it baby" application that was posted on the german DP site. Purely drawing-based tasks I have tackled with a GDI+ component with decent results, I do not quite see it being ideal in this case. I gave it another go with an SVG component (because ideally the graphics library would come from svg-files). However, I dropped that SVG goal again since dissecting the svg elements would create another level of complexity. Even though the approach to have the library elements editable would stil be amazing. I looked briefly into Skia, also there I feel the demos are impressive (just as the graphics32 demos) but I'd need to spend way more time and again, I barely understand the demos. Again, my own limitations. So, there I am, somewhere between desperately wanting to get this done and losing endless amounts of time with very little progress. Finally, the question then is: which library to display, arrange, select images (png or svg) would you recommend? Either because the built-in functionality is there or the documentation allows enough progress.

Hej, since some other projects took over, there is quite some delay now. However, I still should make some progress on this, so I put it on github as promised: tomonsight/PMDraw: Symbolic Drawing App (github.com) Needless to say this is not a ready application and it surely reflects all sorts of incompetencies ... Anyway, some issues that I am facing: - the constraint to the grid is "jumpy" - I cannot select text - the functionality to select multiple objects is missing But still, the idea is probably visible of what I am trying to do. Thanks for attention/help, maybe you can spot some easy fixes.

Hej Anders, thank you again for the dedicated help! As I had some to do some clean-up in another project, this one received a little less attention. But some progress is there: - the save I could just use from the Layers-example 😉 - the OnConstraint works (I was using OldLocation instead of new - along the lines of NewLocation := OldLocation div x etc. So I have quite a bit of work left to do but the project is alive! 😄

Despite the help even in the form of source code that I could just paste, I am struggling with some fundamentals: How to do that? Do I just write a new OnConstrain event that I assign to the TRubberband-Layer? Here, I guess I am lacking the fundamentals on how this should work. I can't get this to run. on this one, field definition not allowed after methods or properties, no matter where I put it. Here it says incompatible types IObjectLayerNotification and TObjectLayernotification. should this be a separate class of its own? TSelectionLayer? And another one: in order to save all objects including the background, do I need to flatten all layers? Essentially I guess I have to make a copy of the bitmap and all layers flatten the copies and continue to work with the original one? I was thinking about sharing the project as I think this generic functionality could be a useful template, at this point I it is still rather a fragment though.

Would this ObjectLayer class also be the right place to add a TAffineTransformation for rotating or flipping an element? Should then the transformation take place in the Paint event?

A massive thank you for your support and work! I will dive into it and try to get it implemented! As a quick reaction, again: thank you!!

Again, a huge thank you! As an update: I got this to run with the TIndirectBitmapLayer class which - both to my shame but also to my joy - works well with very little code. Also, I had some inspirational from the ImgView_Layers-Demo. In general: I have now a main class which handles the Objectlist for all elements (which is then used to save the drawing, etc.) and another class that does the drawing. Consequently, some conceptual questions: - When using the TLayerCollection, the whole movement/scaling of objects is handled (great!). What is a good method of getting information on the movement of the layer back to my main class where I need to keep track of the objects and their coordinates? I could access the TLayerCollection and the position of the layers. I can only rely though on an ID in either structure to get the same object. Alternatively I could follow track the selected object and the mouse move in the main class. - also, when trying to restrict the movement of layers, how can I access the coordinates of a layer while moving it to mimic a SnapToGrid function? - coming back to the rubberband-question: how to implement this? Should I create a TRubberband layer via the MouseDown/MouseMove events?

Sorry, the TImage32Access and Stretchtransfer come from which unit?

Hej Anders, as a quick reaction: thank you for the support! I will dive into the layer concept a little more as (until now) the only way I did was to draw everyting onto one bitmap. Thanks for the patience! 😉 best regards thomas

Thank you for the insight! I guess with every growing project you can come to a point where the continuous addition of complexity and the widening of the scope over the years results in the feeling that the only way forward is to start all over with better structures to begin with (at least in this aspect I think I know what I am talking about ;-)). I clearly cannot comment on the specifics of GR32, I just used it in some applications. However, after browsing graphics libraries for some time now and finding a myriad of them in all sorts of flavours, degrees of completion, target auditorium, documentation quality, accessibility, future proofness and of course commercial approaches I had the impression that many of the projects seem to rely on the effort of individuals. As impressive as it is, this left me with the question, if the "market" for components/libraries in the Delphi space is big enough for so many solutions and if a common effort would lead to a more sustainable, more accessible, better documented, better supported solution. Also this is more a question than a statement. Personally, my biggest struggle is to get into these components. There are often demos, which is an excellent showcase, an ad if you will. However, to me it sometimes feels like advertising a set of workshop tools with an art nouveau dresser. It is impressive that such a piece of furniture was built with those tools. If you want to build a table of your own, it is however, still a long journey. By no means I am not complaining about the availability of components (many of them even free of charge) where individuals have spent months of their time to create something that enables others to build something. I am deeply impressed and grateful for these components. Also, of course, I am nowhere close to judge about how many libraries are the "right amount" let alone "which is the best". Again, I was just asking, given the fact that there are only so many of those experts/hacks/experts 😉 and the target auditorium is not exactly a million of JS developers, if the balance is right between the number of packages vs. the broad acceptance/documentation/future proofness/... of them.

thank you! Just as a sidenote, seeing another package, I guess if all the brilliant people that have created these libraries aligned their efforts and focuses on fewer but more consistently supported libraries, it would be a huge leap.

I will look into it, thank you!!

Hello Anders, thanks a lot for your input and the offer to help ;-) Having used GR32 for some projects, I have a bias to continue to use it. Also the more successfull applications and prototypes and are based on GR32. Two of the main conceptual topics are already answered (single image vs. multiple layers and doublebuffering). Regarding single image vs. layers: does the number of layers make a difference in the choice? I expect around 50-300 elements. Simplicity is a strong argument though ;-) Drawing the elements that way already works pretty straightforward. I have all the images in a Bitmap32List and copy them over to the main Image32. By the way: is there a recommendation difference for this task between GR32.Image32 and ImageView32? Regarding DoubleBuffering: so it should work to have the procedure that draws everyting in the MouseMove event of the Image32? Something like: procedure Tfrm_Draw.img_MainMouseMove(Sender: TObject; Shift: TShiftState; X, Y: Integer; Layer: TCustomLayer); begin case SelectedTool of pmSelect : if ssLeft in Shift then Drawing.ObjectMove(X, Y); end; Drawing.Draw(Library); end; and procedure TDrawing.Draw(ElementLibrary: TLibrary); begin Destination.SetupBitmap(true, Config.BackGroundColor); Destination.BeginUpdate; if Config.BackGroundImageShow then DrawBackgroundImage; if Config.GridShow then DrawGrid; DrawAllElements(ElementLibrary); Destination.EndUpdate; end; Destination being a TImage32. I guess with larger images this might give performance issues? Or does this approach still allow to only repaint a section? In case of drawing all elements onto a single GR32.Image32 the idea is then to use the TRubberBand for the visual representation of the frame but do the selection of the elements within that range manually? Finding the objects is not difficult given their coordinates and dimensions. Thank you!!

True, forgot this one. I tried that too, for some reason I dismissed those a while ago .. should check the demos again probably.

Thank you for your input. Probably yes, I am trying to compensate my skill level by searching for components that do most of what I want to achieve. When I started, I found the layers-example in the GR32 demos and with the functionality there (importing images), selecting them, scaling them, etc. it seemed this is already very close. But then again that's the downside, if a solution covers 50% of what you need, the remaining 50% can be a long way if you did not do the first half yourself. To the process: I think the idea is clear. In my prototypes I already had built a simple XML-syntax to describe the objects, so I would essentially just edit text and for the graphical representation interpret it. Where I was struggling the most I guess is conceptual decisions: - do I draw on an offline bitmap and copy that bitmap to screen when needed - with GDI+ I do it like that. Should I be doing it like that with GR32? - how to implement the marching an/rubberband controls to select multiple objects - see above: do I draw the rubberband offline? I guess this has all been solved a million times - the library: do I draw all elements of the library onto one single image and arrange the single images on the big parent image? or do I rather create a series of Images (TImage or TImage32) and arrange those? I went as far as reading through some OpenSource vector drawing programs to understand concepts. But then again, how much do you understand (with a certain skill level) from such projects ...

True, I also read that. Also, Skia seems to be getting some attention currently. Apart from the demos and some Webinars (like the Starship-UI) it is also a bumpy learning road.