搭配 Gtk3 的 Pylab（Sgskip）：掌握 Matplotlib 与 GTK3 集成

简介

在本实验中，我们将学习如何使用Matplotlib库来创建和修改图形窗口。我们还将探索如何通过访问底层的GTK小部件来自定义图形用户界面（GUI）。

虚拟机使用提示

虚拟机启动完成后，点击左上角切换到“笔记本”标签，以访问Jupyter Notebook进行练习。

有时，你可能需要等待几秒钟让Jupyter Notebook完成加载。由于Jupyter Notebook的限制，操作的验证无法自动化。

如果你在学习过程中遇到问题，请随时向Labby提问。课程结束后提供反馈，我们将立即为你解决问题。

导入库

首先，我们需要导入必要的库。我们将使用Matplotlib、GTK3以及来自gi.repository的Gtk模块。

import matplotlib
matplotlib.use('GTK3Agg')  ## 或者 'GTK3Cairo'
import gi
import matplotlib.pyplot as plt
gi.require_version('Gtk', '3.0')
from gi.repository import Gtk

创建图形和坐标轴

接下来，我们将使用 subplots() 方法创建一个图形和坐标轴。然后，我们将在坐标轴上绘制两条线，并添加一个图例以区分它们。

fig, ax = plt.subplots()
ax.plot([1, 2, 3], 'ro-', label='easy as 1 2 3')
ax.plot([1, 4, 9], 'gs--', label='easy as 1 2 3 squared')
ax.legend()

访问工具栏和垂直框

我们将分别使用 manager.toolbar 和 manager.vbox 方法来访问图形画布管理器的工具栏和垂直框属性。

manager = fig.canvas.manager
toolbar = manager.toolbar
vbox = manager.vbox

向工具栏添加按钮

我们将使用Gtk模块向工具栏添加一个按钮。首先，我们创建一个带有标签的按钮，并将其连接到一个函数，以便在点击时打印一条消息。然后，我们创建一个工具项，设置其工具提示文本，将按钮添加到其中，并将其插入到工具栏中。

button = Gtk.Button(label='Click me')
button.show()
button.connect('clicked', lambda button: print('hi mom'))

toolitem = Gtk.ToolItem()
toolitem.show()
toolitem.set_tooltip_text('Click me for fun and profit')
toolitem.add(button)

pos = 8  ## 在此处插入工具栏的位置
toolbar.insert(toolitem, pos)

向垂直框添加标签

我们将向垂直框添加一个标签，用于在鼠标在坐标轴上拖动时显示其 x、y 坐标。首先，我们创建一个带有一些文本的标签，并将其添加到垂直框中。

label = Gtk.Label()
label.set_markup('Drag mouse over axes for position')
label.show()
vbox.pack_start(label, False, False, 0)

鼠标移动时更新标签文本

当鼠标在坐标轴上拖动时，我们将更新标签文本以显示鼠标的 x、y 坐标。我们创建一个函数来更新标签文本，并使用 mpl_connect() 方法将其连接到 motion_notify_event。

def update(event):
    if event.xdata is None:
        label.set_markup('Drag mouse over axes for position')
    else:
        label.set_markup(
            f'<span color="#ef0000">x,y=({event.xdata}, {event.ydata})</span>')

fig.canvas.mpl_connect('motion_notify_event', update)

显示绘图

最后，我们使用 show() 方法显示绘图。

plt.show()

总结

在本实验中，我们学习了如何使用Matplotlib来创建和修改图形窗口。我们还探索了如何通过访问底层的GTK小部件来自定义图形用户界面（GUI）。我们向工具栏添加了一个按钮，向垂直框（vbox）添加了一个标签，并在鼠标移动时更新标签文本。我们还在坐标轴上绘制了两条线，并添加了一个图例来区分它们。