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

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.

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.

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.

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

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?

Related

c# - changing the appearance of my windows form

I am developing a windows form. I want to change the physical appearance of the form and its controls. I was able to use the Skincrafter demo, however this is making the application substantially heavier. I am not satisfied with how "heavy" it feels when navigating through tabs, moving the window, etc. It's fairly simple program and I do not have this issue when not using skincrafter. When not using it, the GUI is very responsive and I want to keep it that way.
I've tried many different skins and the results are very similar in every case.
So I will not be using skincrafter unless someone points me out to possible reasons for this slower GUI. I followed their tutorial and didn't do anything else. Simple process. Before: fast GUI - after: slow GUI.
Can anyone recommend me another way to change the appearance of my controls/form? Is there way to programatically change the appearance of controls and form, without relying on a third party skinning software?
Note that I do not want my users to change skins. I want to apply one and that's it.
thank you
Steve
Edit:
The project is far from done so I am going to give WPF some real good thoughts so I don't end up doing this when I have a 4x times as large as it is right now.
I've already start converting and it shouldn't be much of problem. Found timer and serialport cannot be front from the toolbox and timer are replaced by dispatchtimer. No big deal so far.
One another thing that makes me want to work with WPF is that I may have the need to make graphs (plotting) to show temperature over time. I use serialport to communicate with an external USB controller (virtual COM port) that reads a bunch of temperature sensors and fan speeds. I suspect graphing to be better with WPF.
One last thing: it's just about colors/fonts but more about looks of the buttons, looks of the actual window (border shapes). What I wanted to do was something similar that is done with html and css. I do want to have custom labels to give them the look of a "digital display" for real time temperatures and fan speed measurements.
again thanks all for the help provided!
In the distant past, I added lightweight skinning to WinForms projects by subclassing the out-of-the-box controls (Label, TextBox, etc), and having that subclass read in appearance configuration (e.g. color, font) from an XML file (one could also use app.config).
That approach was easy to implement, and I saw no visible performance degradation.
If you just want a consistent, new look and don't need to enable the end user to pick from a variety of skins, the subclassing approach is very straightforward. For example, to modify the look of a Label:
public MyLabel : Label
{
MyLabel()
{
this.ForeColor = Colors.Blue;
}
}
Then, everywhere you currently have a Label in your code, use a MyLabel instead.
If you are starting a new project, I would highly recommend using WPF instead. It provides a much more flexible UI framework. One key feature is that it separates the look from the UI implementation.

How to change ListView background image layout?

I've tried to find a way to change the layout of the background image on the ListView control.
I've searched around but haven't got any straight answer.
I can see that there is a ListView property BackgroundImageLayout which is supposed to do the job. But when i change it nothing really happens beside that the BackgroundImageLayoutChanged event is triggered.
How it is possible to change the BackgroundImageLayout on the ListView control? Is there any possible workaround to achive my goal?
PS.: I know about 3rd party controls that 'fix' this problem, but I'm looking for a solution that would do the task without any additional components.
ListView is a native Windows control. Yes, it does support a background image, the LVM_SETBKIMAGE message takes care of it. It however doesn't support the boilerplate Winforms BackgroundImage support, notable lacking is BackgroundImageLayout, the property that Winforms implements for the Control class and implements when the ControlStyles.UserPaint is turned on. It is not for native Windows controls, they paint themselves.
The guy that wrote the Winforms wrapper class for ListView did the next best thing, he added a new property to the ListView class called BackgroundImageTile. A layout option that the native Windows control does implement. Which leaves you with just the two layout options that the native control supports. Tile or don't tile.
That same guy did some pretty heroic things to make the Winforms wrapper class behave reasonably. The code is filled with hacks to work around the native control's quirks. Awesome work. His life would have been a lot easier if the Windows team guy would have the luxury to make the Winforms guy's life easier. But it doesn't work that way, ListView has been around a lot longer than Winforms. And wasn't designed that well from the getgo, Microsoft had pretty significant growing pains around that time.
Fast forward and change the rules so you don't depend on legacy code: WPF, Silverlight, WinRT.
According to the MSDN, 'ListView.BackgroundImageLayout Property':
"The API supports the .NET Framework infrastructure and is not
intended to be used directly from your code."
and
This property has no effect on the layout of the background image of the ListView control, therefore it is not shown in the designer or by IntelliSense.
Use the BackgroundImage property to set the background image. See msdn for more info:
That is unless you have something fancy you are trying to do with it?
EDIT: As per a previous thread HERE: the short answer is that you can't. =(
If you desparately want it, try creating a blank image that is the dimensions of your ListView. Add to this image YOUR image and add at it a position that is in the middle. There may be something similar in nature to this in under Bitmaps or Images.

C# - Recommended SDK/Toolkit(s) For Drawing Tournament Bracket

I would like to develop a UI for creating/displaying single elimination brackets in C#. The only problem is, I am not a UI developer and I don't really know if there is a particular SDK/Toolkit/App/etc. that is the most supported for use. The application will not be web based to start. I am however an experienced developer so the back-end programming will not be an issue nor should it be the focus of this post.
I have looked into Adobe Air, Flex, WPF, and Silverlight as those are just a few different tools that came to mind that could be of use. Are there any particular toolkits or SDKs that are preferred for drawing out the necessary labels and brackets?
Thanks in advance.
The first question is whether there will be any input through this surface, for example if the team/player names will be editable/clickable. In that case you probably want to use controls as well as some custom drawing of the brackets.
If you only want to draw a representation that is not editable, then I would recommend drawing the whole thing yourself on a panel.

Custom look of Textbox

I need to write a complete diffrent looking textbox than the original winforms textbox. In fact I need a different background, how can I achieve this? I tried owner drawing with SetStyle(ControlStyles.UserPaint, true); but this caused a lot of flickers and the text was completly wrong drawn, wrong font, size etc.
Wrtiting a textbox from scratch would be overkill, I think.
This is not possible. The TextBox class is a wrapper around a native Windows control that has been around since Windows version 2. It had to run on some seriously sucky hardware, they had to break a few rules to make this work. One of which is that it draws parts of itself without using the standard Windows paint cycle. Invalidate() and OnPaint() in Winforms terms. Fixing this behavior wasn't possible due to app-compat problems. Way too much code out there that hacked the control in creative but unpredictable ways.
Accordingly, it isn't possible to intercept the drawing to prevent it from erasing parts of your background image. There is no workaround for this, creating your own is a lot of work. Consider WPF.
If you specifically need a different background on a text box, one work-around is offered here.

Is it practical to port code from Flash to C#?

My goal is to gain a better understanding of the characteristics of C#, and become more comfortable creating simple apps. I am fairly competent with Flash (Actionscript 3), and found an old Tic-Tac-Toe game I'd written. I started wondering about porting this code into a C# application. Not knowing much about C#, I'm wondering how difficult the migration would be.
On the one hand, the underlying game logic is syntactically similar, and therefore would be easy to port.
However, as far as the graphics are concerned, I don't even know where to begin. So far, I've only exposed myself to Windows Forms and Console apps in C#.
I'm wondering if these Flash concepts have similar analogs in C#, or if the procedures and syntax are radically different:
Placing graphic elements on a stage
Rendering lines from start/end coordinates
Event listeners on movie clips
Swapping the image inside a graphic element (or, in my Flash version, nextFrame() in a movie clip)
You may want to try developping your little game using Silverlight. Silverlight applications, coded using C# and Xaml, are pretty similar in form with flash applications, and you should find everything you need without trouble.
So I suggest you download the Silverlight SDK (free) and give it a try.
Firstly, Flash is to WPF (close enough) as ActionScript is to C#.
The WPF/Silverlight model is much more similar to Flex that it is to Flash. Everything is added to the UI tree as a object, even lines.
Likewise, adding event handlers to controls (like a button click) can be done in the "code behind" (the code that lives with the view), but the recommendation is to use the MVVM pattern. If you are new to the concepts of separation of concerns and unit testing, feel free to start with the simpler "code behind" method.
While WPF and Silverlight are very similar, I'd recommend starting with Silverlight as the SDK and available samples are richer. You can easily move onto WPF later on (though porting an application from Silverlight to WPF is not automatic).
Swapping images, as you mentioned, would be done via "Visual States" in Silverlight (or possibly changing the image reference, which is more "hacky").
Have a look at the following links to get started:
Learn # Silverlight.net
Silverlight on MSDN
Shapes and Drawing (Silverlight)
If you're looking specifically to do games and the like, you may wish to look into the free XNA framework. However, there will be differences as Flash gives you far more ability to "set up" things beforehand and modify them.
Placing graphic elements on a stage
If you go the XNA route, you will be drawing sprites using the spritebatch, you tell them where and how to draw and that's where they will go
Rendering lines from start/end coordinates
In windows forms you can do this via a simple System.Drawing call, however if you wish to do this in XNA, you will either have to make a 1 pixel square and stretch/rotate it to what you want, or use 3d primitives (Though this will limit you to a 1 pixel line)
Event listeners on movie clips
Look into delegates, but there isn't really an equivalent for movie clips to my knowledge
Swapping the image inside a graphic element (or, in my Flash version, nextFrame() in a movie clip)
This is fairly simple, depending on what you mean. If you want to, say, animate a sprite. You can do this by moving the source rectangle or changing the texture of the spritesheet. If you mean the screen as a whole, this is mostly handled for you provided you use the spritebatch. In windows forms you'll have to do more of it yourself, but the base concepts are the same.
Overall it's not that bad, but if that doesn't sound appealing check out Silverlight. It's basically C# styled flash so you may find the transition easier.
Good luck and hope this helps.

Categories