I am trying to create a simple drawing utility as .net desktop application(i.e Windows Form using C#). What i am planing to develop is:
There should be a canvas area (This is the area where the actual drawing is performed).
The canvas should be zoomable (Zoom in and zoom out)
The canvas areas should have grid lines (the ideal size of grid is 100X100pixel, but it can be changed with zooming)
There is a single character written inside each cell (here by the term "cell" i am refering to the box that is formed by the intersection of grid lines)
Now until this step all the thing are automatic (i.e user don't have to do anything until now all is done by my application)
User is only allowed to draw rectangles in canvas area(my application will also need to keep the track of those rectangles in such a way that user is allowed to resize those rectangles later)
Since i am beginner to C# so i need only guidance. Till now i just look at System.Drawing library (only look at it don't go deep :P) but not sure should it cater all my requirements or not (but i guess it will cater my req) and if it will then from where do i start with and what resource do i need to study in order to create this application.
Related
In my WinRT app I need to draw about 3000 objects on a canvas, where I can translate and zoom the view. Unfortunatley, after adding about 1500 lines to my canvas my Windows 8 App always crashes. What could be the best practice to achieve this?
One solution could be rendering everything on an image (how do I do this?). But then I loose comfort of easy access and editing of every element.
Also my scale and translate is very slow. But since I also need a big overview, it makes no sense to put only the objects of the visible area in the canvas, since on minimum zoom it's still everything and zoomed it's still very laggy cause of add and remove operations.
There are a couple of different things you should employ to have a smooth UX:
Use a Quadtree, whenever you add a shape to your canvas you also put it on your Quadtree. This will be helpful when you will zoom on a portion of the image: you will know what objects are in this portion of the image; you will render them again (against using a cached/pixellated version).
To overcome the potentially lengthy drawing process you could do the following:
display the portion of the cached image overview at the right scale
use a progress indicator to let know the user that the program is working render this portion
when the faint rendering is done, blit it on the screen
A concrete example: Google Maps does that.
I need to find, or create an editor that will handle text and images as objects. For instance I have a 3 line string of text, to be able to move it around and position it within a canvas, also the ability to add an image, and possibly resize it within that canvas. and take the result, and save it, whether I get the the offsets and positions manually, of each of the objects (preferable) , or get the entire canvas as an image, to be able to save and print.
Rulers would be great... Im not trying to re-create Photoshop, but the idea is similar.
I will be doing this in a C# WinForms application, it does seem however that a WPF solution might be better suited, and I think I can have a WPF control within winforms...
Any direction or advice would be greatly appreciated.
Forget winforms. It doesn't support anything. Your best bet is to do it in WPF and if you need, you can integrate it into an existing winforms application via the ElementHost.
Please see my similar answers/samples about this:
https://stackoverflow.com/a/15580293/643085
https://stackoverflow.com/a/15469477/643085
https://stackoverflow.com/a/15821573/643085
Also, see this example with support for zoom, panning and resizing functionality:
https://stackoverflow.com/a/16947081/643085
They're all MVVM based and have some interesting features.
You can easily customize these samples and add ANY type of elements:
images,
geometries,
usable interactive UI elements with functionality (TextBoxes, ComboBoxes, whatever),
text,
videos,
FlowDocuments,
or whatever that's visible on screen)
by adding additional data items and their corresponding DataTemplates.
I have a couple of images that I would like to create an interactive map of in Silverlight and WPF. The pictures are of States and counties. I tried doing some search on how this is done but have not been able to find a good example on how to go about accomplishing this. So I would appreciate your help. Thanks in advance.
I was involved in creating a Xaml World map from scratch (below) and that alone took nearly a day for a stylised polygon version (no fine detail)....
I have since purchased a Wacom Bamboo tablet & stylus and found that to be about 5 times faster to work with compared with a mouse.
Quoting myself: "You import a map as a background image and use the pen tool to dot-to-dot trace around the country. Combine all those path segments into a single path. Then create a separate poly-path for each state (close them to allow for a fill)."
Once you create them you can name the individual country polygons and connect up mouse logic to make them all glow on mouse over or change colour on press etc.
Basically all the other stuff on that screen are user controls and custom controls. Work out the behaviour you want and create controls to suit your own needs.
In your instance you can use less accurate polygons as they will only be for hit-testing and highlighting and you will want to retain the actual map images under the polygons.
I need to visually show a line from one image to one or more images to represent a server connected to one or more servers. I'm assuming WPF is the best tool for this and am using this project to learn and evaluate WPF and determine if we should start migrating from WinForms.
I'm trying to keep the layout simple for purposes of re-sizing and managing the layout. So the image representing the source server is in the upper left and all connected servers are listed down the right side. I'm new to WPF and Expression Blend and have been struggling with how to draw the connectors. Right now I have the images in a grid. After some frustrating attempts to draw lines using tiled images I started to use a line with a GradientBrush which looks like a 2D pipe. This seemed like a decent approach. But I'm hoping there is an adequate method to draw a path similar to my mock up.
Thoughts...
Put the lines in the grid and span multiple rows and columns
Put the line on a canvas which spans all rows and columns
I assume the line paths will need to be determined in the code behind, But I've been impressed with everything XAML is capable of.
I'm just a WPF noob and a little overwhelmed by everything that WPF can do. This seems like something that's been done many times before but I cannot find any related WPF examples and would prefer to minimize my frustrating attempts :-)
I would use Canvas instead of Grid because you can use absolute positioning with Canvas.
Take a look at this 4 part series on CodeProject to get some ideas.
You can try using Seperator in between the images. Put seperator in a stackpanel so you can control its orientation to horizontal or vertical and you can also change its color and thickness. If you place seperator in a canvas you can also control its placement.
I am having trouble understanding the proper way to create a scrollable area within a custom control using C#, .NET 3.5 and GDI+.
Is there any documentation from Microsoft about the correct way to go about doing so? Is there a decent primer anywhere on the web?
My concerns are mainly: if I create a large graphical canvas in memory, what are the specific details about how large the canvas can (and should be)? What are the performance considerations? How much of the scrollable area should I render in advance?
For example, if I were rendering a very large graphical plot from pre-existing data, should I just render the ENTIRE plot to graphic memory and then blit it into the "scrollable" area? Or, would that exhaust available graphic related memory and start writing into the paging file?
Clarification:
For example, your web-broser isn't "redrawing" the client area everytime you scroll by re-rendering all of the elements. Static elements of the page are rendered once to a large surface, and when you move the scroll bar, the starting offset of the pre-render is simply modified.
That is the sort of behavior I'm going for. I don't want to "draw the content that would be between the start and end values for my scroll range" on paint events.
If you are talking WinForms - derive your control from ScrollableControl. Define the Client Size and just paint the appropriate portion in OnPaint.
The control handles all scrolling details for you