如何实现类似于将单元格添加到画布中的Excel [英] How to implement an "Excel like" "add cell" into a canvas

问题描述

很抱歉这个标题，可能不能很好地描述我想要实现的目标。我正在开始开发一个新的软件，它应该向用户呈现一个网格，用户可以在这个网格的任何点添加行或列来操纵它。问题是，我不确定真正的网格是不是合适的解决方案，因为有一些图形需求，比如更改个人单元格大小、嵌套、缩放/拉伸等。所以我开始分析WPF中使用DrawingVisualElements的解决方案(出于性能原因)。 我能够以所需的方式绘制网格。我还可以在绘图的边缘添加行或列。但我想不出任何解决方案来在中间修改它(除了重新绘制整个内容)。我会用一张图片更好地解释我。左侧是第一次绘制后的网格。右侧有一个应在用户执行操作后绘制的新网格。

下面是一个更复杂的示例，其中将"；行添加到现有单元格中，导致所有单元格"；增长。

正如我所说的，我知道我可以重新绘制整个过程，但我担心性能。请记住，在真实场景中，可能有数千个块和许多嵌套级别。

我们非常感谢您的任何建议。WPF的使用不是强制性的，但它将是.NET 5.0中的一个桌面应用程序。DrawingVisual的使用既不是强制的。我可以评估任何解决方案。谢谢。

推荐答案

一种简单的方法是在第一次绘制表格时将列相对于画布左侧的位置保留在变量中。当您要添加新列时，可以从该点裁剪图像，并在较大的画布中复制左右两部分，然后从开头只绘制中间的列。

当然，可以使用图像处理技术计算每列的坐标，但这会降低性能。

我用Python编写了这段代码，但我认为将其转换为C#并不困难。

import cv2
import numpy as np

# copy image over another
def imdraw(im, over, x, y):
    y1, y2 = y, y + over.shape[0]
    x1, x2 = x, x + over.shape[1]
    for c in range(0, 3):
        im[y1:y2, x1:x2, c] = over[:, :, c]
    return im


pt = 220
col = 300
off = 15

im = cv2.imread("grid.png", 1)
h, w = im.shape[:2]

crop_left = im[0 : 0 + h, 0:pt]
crop_right = im[0 : 0 + h, pt:w]

cv2.imwrite("left.jpg", crop_left)
cv2.imwrite("right.jpg", crop_right)

# Create an Empty image with white background
out = 255 * np.ones(shape=[h, w + col, 3], dtype=np.uint8)

out = imdraw(out, crop_left, 0, 0)
out = imdraw(out, crop_right, pt + col, 0)

out = cv2.rectangle(
    out,
    pt1=(pt + off, off),
    pt2=(pt + col - off, h - off),
    color=(128, 0, 200),
    thickness=5,
    lineType=cv2.LINE_AA,
)

cv2.imwrite("out.jpg", out)

---

输出：

这篇关于如何实现类似于将单元格添加到画布中的Excel的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！