如何在 tkinter 中用箭头连接两个状态圈？

Question

我目前正在使用 tkinter 编写 fsm 编辑器。但是，我坚持连接两个州。我有两个问题：

1）如何使过渡箭头根据鼠标移动而增长？

2）如何将箭头的起点粘贴在一个状态上，将箭头的终点粘贴在另一个状态上？

附言。您认为 tkinter 的文档足够好吗？

Answer 1

这是一个展示这个概念的例子。简而言之，使用标签将线条与框关联起来，只需在用户移动鼠标时适当调整坐标即可。

运行该示例，然后在米色框中单击并拖动。

当然，对于生产代码，您需要制定一个更通用的解决方案，但希望这可以向您展示创建一个带有箭头的框是多么容易，该箭头会随着您移动框而调整。

from Tkinter import *

class CanvasDemo(Frame):
    def __init__(self, width=200, height=200):
        Frame.__init__(self, root)
        self.canvas = Canvas(self)
        self.canvas.pack(fill="both", expand="1")
        self.canvas.create_rectangle(50, 25, 150, 75, fill="bisque", tags="r1")
        self.canvas.create_line(0,0, 50, 25, arrow="last", tags="to_r1")
        self.canvas.bind("<B1-Motion>", self.move_box)
        self.canvas.bind("<ButtonPress-1>", self.start_move)

    def move_box(self, event):
        deltax = event.x - self.x
        deltay = event.y - self.y
        self.canvas.move("r1", deltax, deltay)
        coords = self.canvas.coords("to_r1")
        coords[2] += deltax
        coords[3] += deltay
        self.canvas.coords("to_r1", *coords)
        self.x = event.x
        self.y = event.y

    def start_move(self, event):
        self.x = event.x
        self.y = event.y

root = Tk()
canvas = CanvasDemo(root)
canvas.pack()
mainloop()

Answer 2

Tkinter 非常适合此类应用程序。过去，我开发过一些工具，这些工具是用箭头连接的盒子，当您移动盒子时，箭头会保持连接（我认为这就是您要问的问题）。不要让不太了解 Tkinter 的人影响您——它是一个完美的工具包，而且画布非常灵活。

您的问题的解决方案是简单的数学。您只需要计算框的边缘或角的坐标即可知道将箭头锚定在哪里。要使其像您所说的那样“增长”，只需对鼠标移动进行绑定并适当更新坐标即可。

要使线条可增长，您所要做的就是每次鼠标移动时调整线条的坐标。最简单的事情就是充分利用画布标签。通过标签，您可以知道哪些箭头连接到哪些框，以便在移动框时可以调整指向或来自该框的任何箭头的坐标。