在我们开始之前,来解释一下为什么人们不想用tkinter来构建Markdown编辑器。这是因为没有默认的简单方法来显示markdown输入的html数据。甚至没有一个默认的tkinter组件来显示html数据。您可以简单地编写/编辑markdown,但是没有简单的方法在应用程序中显示输出。
但是,现在有了tk_html_widgets,它可以帮助我们显示html输出。
但它当然也有一些问题:字体太小,不支持附加远程照片。
现在让我们能开始构建吧。
开始构建:
首先,请确保您已安装Python 3和Tkinter。 如果没有,您可以从这里下载:
python.org/downloads(Tkinter已包含Python中)。
我们需要的其他东西是tkhtmlview和markdown2。 您可以通过运行pip install tkhtmlview markdown2或pip3 install tkhtmlview markdown2来安装它们(如果您有多个Python版本)。
现在启动您喜欢的编辑器或IDE并创建一个新文件(例如(我将其命名为linuxidc.com编辑器))。
我们将从导入必要的库开始。
from tkinter import *
from tkinter import font , filedialog
from markdown2 import Markdown
from tkhtmlview import HTMLLabel
在第一行中,我们从tkinter包中导入(几乎)所有内容。
在第二行中,我们导入字体和文件对话框。 需要使用font来设置输入字段的样式(例如Font,Font Size),并导入filedialog以打开markdown文件以进行编辑(和/或保存我们的markdown文件)。
在第三行中,导入了Markdown,以帮助我们将Markdown源转换为html,并使用HTMLLabel(在第四行中导入)将其显示在输出字段中。
之后,我们将创建一个名为Window的框架类,该框架类将从tkinters的Frame类继承。 它将保存我们的输入和输出字段。
class Window(Frame):
def __init__(self, master=None):
Frame.__init__(self, master)
self.master = master
self.myfont = font.Font(family="Helvetica", size=14)
self.init_window()
def init_window(self):
self.master.title("linuxidc.com编辑器")
self.pack(fill=BOTH, expand=1)
在此代码块中,我们首先定义一个称为Window的类,该类继承tkinter的Frame小部件类。
现在,在初始化函数中,我们将master作为参数,用作框架的父级。在下一行中,我们初始化一个Frame。
接下来,我们声明一个名为self.myfont的自定义字体对象,其字体家族为Helvetica(您可以选择任何字体家族),大小为15,将在我们的markdown输入字段中使用。
最后,我们调用init_window函数,将我们的应用程序置于核心位置。
在init_window函数中,我们首先将窗口的标题设置为linuxidc.com编辑器。在下一行self.pack(fill=BOTH, expand=1)中,我们告诉Frame占用窗口的全部空间。
我们将fill关键字参数设置为BOTH,这实际上是从tkinter库导入的。它告诉框架在水平和垂直方向上都填充窗口,并且expand关键字参数设置为1(表示True),这告诉我们框架是可扩展的。简而言之,无论我们如何拉伸窗口大小或最大化窗口大小,框架都将填充窗口。
现在,如果您运行脚本,您将看不到任何内容,因为我们仅定义了该类,但从未调用过它。
为了解决这个问题,我们将以下代码放在脚本的末尾:
root = Tk()
root.geometry("800x600")
app = Window(root)
app.mainloop()
接下来,将窗口的几何形状设置为800x600的长方体,800是窗口的高度,600是窗口的宽度。 在下一行中,您可以看到我们正在创建一个Window对象。 我们将root变量推入框架的root,并将其存储在名为app的变量中。
接下来要做的就是调用mainloop函数,该函数告诉我们的应用程序运行!
现在运行脚本。 如果正确完成所有操作,您将看到一个空白窗口,如下所示:
但这只是一个空白窗口。 要在窗口中写入内容,我们需要添加一个文本字段,在其中写入我们的markdown。 为此,我们将使用tkinter中的Text小部件。
...
def init_window(self):
self.master.title("linuxidc.com编辑器")
self.pack(fill=BOTH, expand=1)
self.inputeditor = Text(self,)
self.inputeditor.pack(fill=BOTH, expand=1, side=LEFT)
不要与...混淆(三个点),我把它们放在那里只是为了表示在此代码块之前有多行代码。