怎么折腾都不好看 ---- 开发编辑器之布局

作为资深的搬砖码农最近突然忙起来了,寻新东家,见丈母娘之类的,导致这篇本该在半个月之前就该完成的文章一直拖到现在.

Be honestly, 不管是GUI还是Web page,在界面和页面这种急需用户视觉体验的地方我一直不擅长,怎么讲呢,就是一个简单的table我也能让其丑的宁人发指,嗯嗯,这也算个天赋技能吧.

言归正传,在之前完成了Menu部分后,接下来就是主体了.用任何语言或者任何GUI模块(框架)来画界面,除去Menu这个常备项,剩下的部分都需要自己来定义.作为一个编辑器除了编辑部分,一般还有状态栏.

以常见的Notepad++为例,整个编辑器的主体只有2部分,编辑窗口和状态栏.

image

玩过HTML的小伙伴来画这么一个类似的界面似乎在难度上几乎为负数,但是在GUI里这里就涉及到了布局.和Java的Layout类似,Tkinter也提供了几种布局方案:Pack,Grid,Place.

从字面意思上就能很好的理解这三种布局方案的特点:

Pack:相对定位,以简单的左右上下来定位元素.

Grid:将整个界面看做一个Big Table,每一个元素按行列定位.

Place: 绝对定位,通过给定相应的XY坐标来定位元素.

具体的例子baidu,google都能找到很多.

需要注意的是,象这样3个元素使不同的布局会导致程序死循环.

from Tkinter import *   
  
root = Tk()
root.geometry("500x400")
frame = Frame(root)
frame.grid()
lab1=Label(root,text='Label1',bg='yellow')
lab1.grid(row=1)
lab2=Label(root,text='Label2',bg='red')
lab2.pack(fill=X)
root.mainloop()

稍作修改,NoteSlate的大体样子就是这样了.

image

接下来就是作为一个文本编辑器最重要的部分.

你可能感兴趣的:(怎么折腾都不好看 ---- 开发编辑器之布局)