C#/.NET: Creating Dynamic Visuals in C#

Question

NOTE: I am not exactly sure how to title or tag this question, so if you have any ideas, PLEASE help!

I'm currently envisioning a few possible projects that involve dynamically rendering something (whether it is a point, a line, text, or music notes on a staff, for hypothetical example), but, if I were to undertake these projects, I'm not really sure how to approach this design. What I'm curious about is sort of how programs like Word, or Geometer's Sketchpad, or Finale, create a blank "canvas" and render text, geometry, or music on it, respectively - how can this be done in C#, or in .NET, in general?

First of all, what is the best framework/platform to use: WinForms, WPF, something else? I'm open to many options, as I'm just trying to understand the different ways this can be done.

Next, how can I create such a "canvas" (if we go back to that metaphor) using the different frameworks you answered for part 1? And also, how can I render stuff onto it?

I hope my question isn't too confusing or n00bie. I just don't know how to approach such a prospect. Thanks!

UPDATE: I have now posted a follow-up question which is less broad. I have provided an hypothetical example of what I would like to accomplish. However, I will still accept an answer here, even though my question isn't fully answered.

Answer 1

WPF would probably suit your project well. I like the book Pro WPF in C# 2008: Windows Presentation Foundation with .NET 3.5, it covers most of the topics you're asking about.

You'll probably get better answers with a more focused question. The scope of your question is too large to be answered easily or concisely.

Answer 2

WPF makes it easier to refactor designs for such a project by easily moving shape drawing code between just drawing simple shapes and contents of controls. If you need the richness of custom controls, WPF allows a fairly smooth transition.

Most of the graphics can be defined in XAML which means you can export them from programs like Illustrator or anything that generates the standard SVG vector graphics, via an SVG-XAML converter.

I like WPF Unleashed and it has a nice discussion of 2D graphics and how to use the DrawingContext class for such a visual editor.

Answer 3

There is no universal answer to your question - it is too generic.

Are you talking about dynamicly created controls, standard UI components (dropdowns, buttons)?

Is it vector graphics - like in drawings, or may be it is 2D image processing - or is it 3D?

Answer 4

Hi, Do you know that there's an event called Paint? Everytime Windows OS needs to displays or repaint something on your form, this event is triggered. So, you create a Paint event handler, and everything is possible in that. For eg:

• Word: you have a WordDocument data structure with the formatted tags and stuffs, you paint each character/ each word or each block of words one-by-one using a desired brush/paint and font. You might also wanna paint your background and stuff... If, for example the user change the font of 1 particular block, your WordDocument must change something to reflect that font change. And then you do an myForm.Invalidate() to repaint your form (and thus update your font). => Dynamically update your GUI.

• Sketchpad: you need datastructures such as Line, Point, Triangle, etc. And then, each time OnPaint is triggered, you paint it dynamically. E.g: myGraphics.DrawLine(..), myGraphics.DrawCircle(..)

• Similarly to Finale.

One thing you should do is to handle your data structure and drawing classes carefully, and instead of drawing everything in your OnPaint() method, you create several DrawMe(..) methods in your entity classes, and ask them to draw themselves. E.g: myCircle.DrawMe(..), myScore.DrawMe(..)

Hope that'll help, Ben