Good day. I am developing a small program for creating embroidery mockups from images. All algorithms have already been worked out. Everything works with the palette of threads, etc. Here is a rough result without setting: enter image description here Now the question arose of putting marks in the cells to distinguish the threads (as is usually done in such layouts). Initially, they were applied by the same Graphics that created the template. But there were two problems:

  1. To fit a character in a cage, you need to increase the image at times - time, performance and memory suffer.
  2. With the minimum image size required for character readability, the layout looks soap. - The seal will be released in poor quality.

Having looked at pdf layouts, I found out that tables with colored cells and marked signs are used there. And here only DataGrid comes to a head (very very big such DataGrid).

What I would like to know:

  1. Is the correct solution to use a datagrid for this purpose? Also a question about performance. And also how to print all this as a vector.
  2. Maybe there are some components for this purpose?

PS: For the second day I have not found anything more or less good for Google.

UPD3: Thanks @VladD for a tip towards the Canvas. Resolved yet. Made from this example .

Now I do not know how to output blocks asynchronously. The code for calculating blocks itself is not a problem to make asynchronous, but I don’t know further. Hangs UI. I tried different methods that we find on stackoverflow, but without results.

Created a new question, because the problem is different: here .

  • Generate html, then convert html to pdf. - Serj-Tm
  • html is not an option. How will I display it in the UI via WebBrowser? it is better through flowdocument. But I don’t like this option either. - Salnik
  • one
    And why not just the squares on the Canvas? - VladD
  • @VladD and for such squares you can determine exactly what clicked on it and write ordinary letters in it? - rdorn
  • @rdorn: square.MouseDown квадратик.MouseDown += OnКвадратикMouseDown ? And to write, put inside TextBlock , this is WPF. - VladD

2 answers 2

The scheme for embroidery can be represented in the form of the same picture with a very low resolution. Given that the thread palette is much smaller than the palette of colors available for display, you can use a simple technique:

  1. Prepare (download or make) a vector font with the necessary icons.
  2. Create a dictionary of matching symbols and colors.
  3. Present a picture as a two-dimensional array of characters.

And that the whole picture will take an average of several kilobytes of memory. Bitmap for this is not needed. With the model finished. I think you yourself have already thought of all this.

Now it's small, show it all in the right form. The grid can be drawn and saved using GraphicsPath . It is easy to scale and draw in one line. But this path will not give you interactivity, i.e. You will have to fence an unknown animal to determine which cell you clicked on. Therefore, it is better to use the advice of VladD , and draw ready-made squares of the desired size, based on the scale, color, which is chosen from the dictionary, enter the characters or color and symbols immediately. In this case, you can specify a certain minimum size of a square, in which only display color without a symbol.

This approach will allow memory and save, and not to lose the quality of the image with a high magnification.


Add autoscrol for Canvas:

 <ScrollViewer VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Auto"> <Canvas Height="2000px" Width="2000px"> //тут рисуем квадратики </Canvas> </ScrollViewer> 

Here you can see about printing from WPF in principle, and then look at the print code for the control (Canvas is also control).

  • 1, 2 and 3 is not a problem and it is solved or there is a solution. The option from VladD does not quite fit, tk: - all that in the Canvas gets out of control / window boundaries. - how then can we print this construction to print? Just imagine the Excel table with square colored cells, inside of which one character each - that's what I'm looking for. - Salnik
  • you need to display the whole picture (with scrolls). The PDF format itself is not needed, you need a print in the vector. Now I will update the post, I found the program analog. - Salnik
  • updated the question, attached an example of what I am looking for. It should scroll at least. Partial render is not suitable. Yes on time without a difference. This is purely a hobby for self-development))) I thought that WPF has a simple way or a ready control for such perverts - Salnik
  • one
    @Salnik: DataGrid is not at all intended for what you want. It is designed to display data from the table. The fact that some of the visual elements in it are similar to what you need is an accident. In particular, you are unlikely to make it so easy to make a DataGrid square its cells. And so the change in the thickness of the lines requires at all aerobatics. So it's easier to draw yourself, believe me. - VladD
  • one
    @Salnik set the template for the content (vertical and horizontal rulers with numbers and the cells between them) and zapinde canvas on the array, what is not MVVM? - rdorn

Try using OpenGL (in this case, SharpGL ).
For such a task, the tool may be too heavy, but since you have such difficulties, I think it will help.
Provides great features at high speed. Perhaps for your problems there is a beautiful solution.

Also there were similar problems before, I was not lazy, I spent time on OpenGL and was pleasantly surprised. You can twist, twist, zoom in / out as much as you like, draw fast dynamic scenes - no brakes at high quality.

UPD
Examples for SharpGL : download Samples on the site (source code here: SharpGL / Samples / ).

For information (see wikipedia ):

OpenGL is a specification that defines platform-independent (language independent) programming interface for writing applications using two-dimensional and three-dimensional computer graphics.

SharpGL just one of the examples of .Net libraries that provide access to OpenGL . There are, for example, OpenTK , Tao Framework .

  • The vehicle wants to get away from hand-drawing to the MVVM area and using standard controls, and you advise him just the opposite: to go down to the level of graphic primitives. - VladD
  • @VladD However, this could solve the problem. The question is just about performance, quality, Graphics, Canvas written? I think the answer is appropriate for the question. - Ildar
  • @Ildar SharpGL has no documentation. There are no even simple examples. I managed to draw a grid, but through a crutch. I would appreciate if you help. I just need to know how to draw: a grid (more precisely an array of lines), an array of rectangles and an array of characters. Lines and rectangles turned out (a few hours later), but with arrays a problem. And without them, performance drops. - Salnik
  • @Salnik Updated the answer. Examples are on the website, source code examples on the git hub. - Ildar
  • @Ildar I saw these examples. Worst dokumenenatsiya that I saw. It will take me half a year to study. I would like to find ready-made implementation of such things. But I can not find anything. I do not have so much time and desire. - Salnik