Graphical User Interface, GUI Tkinter-Python标准GUI Graphics-基于Tkinter扩展 Turtle-python内置的图形库
graphics库
原点在左上角,x轴从坐到右是递增,y轴从上到下是递增
Copy from graphics import *
circ = Circle(Point(100, 100), 30)
# 在(100,100)坐标处建立圆
win = GraphWin()
circ.draw(win)
两个不同的变量可能表示同一个对象
编写卡通脸的程序,两个眼睛间隔40像素长度
Copy win = GraphWin()
leftEye = Circle(Point(80, 80), 5)
leftEye.setFill("yellow")
leftEye.setOutline("red")
rightEye = leftEye
rightEye.move(40, 0)
leftEye.draw(win)
rightEye.draw(win)
解决方法
为左右眼分别创建两个不同的圆对象
Copy from graphics import *
win = GraphWin()
face = Circle(Point(100, 95), 50)
leftEye = Circle(Point(80, 80), 5)
leftEye.setFill("yellow")
leftEye.setOutline("red")
rightEye = Circle(Point(120, 80), 5)
rightEye.setFill("yellow")
rightEye.setOutline("red")
mouth = Line(Point(80, 110), Point(120, 110))
face.draw(win)
mouth.draw(win)
leftEye.draw(win)
rightEye.draw(win)
交互式图形用户接口
连续点击10次鼠标,返回其坐标值
Copy from graphics import *
def main():
win = GraphWin("Click Me!")
for i in range(10):
p = win.getMouse()
print("You clicked at:", p.getX(), p.getY())
if __name__ == '__main__':
main()
在窗口中点击5个点来画一个五边形
Copy from graphics import *
win = GraphWin("Draw a polygon",300,300)
win.setCoords(0.0, 0.0, 300.0, 300.0)
message = Text(Point(150, 20), "Click on five points")
message.draw(win)
#获得多边形的5个点
p1 = win.getMouse()
p1.draw(win)
p2 = win.getMouse()
p2.draw(win)
p3 = win.getMouse()
p3.draw(win)
p4 = win.getMouse()
p4.draw(win)
p5 = win.getMouse()
p5.draw(win)
# 使用Polygon对象绘制多边形
polygon = Polygon(p1, p2, p3, p4, p5)
polygon.setFill("peachpuff")
polygon.setOutline("black")
polygon.draw(win)
# 等待响应鼠标事件,退出程序
message.setText("Click anywhere to quit.")
win.getMouse()
Text对象:setText()和getText()
Entry对象:setText()和getText()
内容可以被用户修改
Copy from graphics import *
def main():
win = GraphWin("Click Me!")
for i in range(10):
p = win.getMouse()
print("You clicked at:", p.getX(), p.getY())
if __name__ == '__main__':
main()
在窗口中点击5个点来画一个五边形
Copy from graphics import *
win = GraphWin("Celsius Temperature",400,300)
win.setCoords(0.0, 0.0, 3.0, 4.0)
# 绘制接口
Text(Point(1,3), " Celsius Temperature:").draw(win)
Text(Point(1,1), "Fahrenheit Temperature:").draw(win)
input = Entry(Point(2,3), 5)
input.setText("0.0")
input.draw(win)
output = Text(Point(2,1), "")
output.draw(win)
button = Text(Point(1.5,2.0), "Convert It")
button.draw(win)
Rectangle(Point(1,1.5), Point(2,2.5)).draw(win)
# 等待鼠标点击
win.getMouse()
# 转换输入
celsius = eval(input.getText())
fahrenheit = 9.0/5.0 * celsius + 32.0
# 显示输出,改变按钮
output.setText(fahrenheit)
button.setText("Quit")
# 等待响应鼠标点击,退出程序
win.getMouse()
win.close()
GraphWin对象
一个程序可以定义任意数量的窗体
GraphWin()
默认标题是"Graphics Window"
默认大小为200*200
GraphWin对象常用方法
plot(x, y, color) 在窗口中(x,y)位置绘制像素。颜色参数可选,默认值为黑色。
plotPixel(x, y, Color) 在“原始”位置(x,y)处绘制像素,忽略* setCoords()方法设置的坐标变换。
setBackground(color) 将窗口背景颜色设为指定颜色,默认值为灰色。
getMouse() 程序等待用户在窗口内点击鼠标,返回值为点击处的位置,并以Point对象返回。
setCoords(xll, yll, xur, yur) 设置窗口的坐标系。左下角是(xll,yll),右上角是(xur,yur)。所有后面的绘制都以这个坐标系做参照(plotPexil除外)
图形对象:点、线段、圆、椭圆、矩形、多边形以及文本
图形对象通用方法
setFill(color) 设置对象内部填充颜色。
setOutline(color) 设置对象边框颜色。
setWidth(pixels) 设置对象的宽度(对Point类不起作用)。
draw(aGraphWin) 在指定的窗口中绘制对象。
undraw() 从窗口中删除该对象。如该对象没有在窗口中画出将会报错。
move(dx,dy) 将对象沿x轴和y轴分别移动dx和dy单位长度。
Point对象方法
Point(x,y) 以指定坐标的值(x, y)构造一点
Line对象方法
Line(point1, point2) 构造一个从点point1到点point2的线段
setArrow(string) 设置线段的箭头样式。箭头可以绘制在左端,右端,或者两端都有。string参数值为’first’, ’last’, ’both’,或 ’none’,默认值为’none’。
getP1(), getP2() 返回线段相应端点的坐标值。
Circle对象方法
Circle(centerPoint, radius) 根据给定圆心和半径构建圆
getP1(), getP2() 返回值为该圆边框对应点,对应点指的是该圆外接正方形的对角点。
Rectangle对象方法
Rectangle(point1, point2) 以point1和point2为对角点创建一个矩形。
getCenter() 返回矩形的中心点的克隆值。
getP1(), getP2() 返回构造矩形的对角点的克隆值
Oval对象方法
Oval(point1, point2) 在点point1和point2指定的边界框中创建一个椭圆。
getP1(), getP2() 返回构造椭圆的对角点的坐标值
Polygon 对象方法
Polygon (point1, point2, point3, ...) 根据给定的顶点构造一个多边形。也可以只用一个顶点列表作为参数
getPoints() 返回构造多边形的顶点值的列表
Text 对象方法
Text(anchorPoint, string) 以anchorPoint点的位置为中心,构建了一个内容为string的文本对象。
setText(string) 设置文本对象的内容
getAnchor() 返回文本显示中间位置点anchor的坐标值。
setFace(family) 设置文本字体。family可选值为:’helvetica’,’courier’, ’times roman’, 以及 ’arial’.
setSize(point) 设置字体大小为给定点point的大小。合法数值为5-36。
setStyle(style) 设置字体的风格。可选值为’normal’, ’bold’, ’italic’,以及 ’bold italic’。
setTextColor(color) 设置文本颜色。与setFill效果相同。
图形颜色
很多颜色具有不同深浅
‘red1’‘red2’‘red3’ ‘red4’
color_rgb(red,green,blue)函数
返回一个字符串
color_rgb(130,0,130) 中度洋红色。
温度转换程度示例
Copy from graphics import *
win = GraphWin("Celsius Converter", 400, 300)
win.setCoords(0.0, 0.0, 3.0, 4.0)
# 绘制接口
Text(Point(1,3), " Celsius Temperature:").draw(win)
Text(Point(1,1), "Fahrenheit Temperature:").draw(win)
input = Entry(Point(2,3), 5)
input.setText("0.0")
input.draw(win)
output = Text(Point(2,1),"")
output.draw(win)
button = Text(Point(1.5,2.0),"Convert It")
button.draw(win)
Rectangle(Point(1,1.5), Point(2,2.5)).draw(win)
# 等待鼠标点击
win.getMouse()
# 转换输入
celsius = eval(input.getText())
fahrenheit = 9.0/5.0 * celsius + 32.0
# 显示输出,改变按钮
output.setText(fahrenheit)
button.setText("Quit")
# 等待响应鼠标点击,退出程序
win.getMouse()
win.close()
计算温度值设定窗口颜色:
温度越高,颜色越偏红
温度越低,颜色越偏蓝
setBackground(Newcolor)设置窗口背景颜色。
假定输入温度范围为0-100,
颜色权重weight=输入温度/100
newcolor的rgb计算:
红色分量=255weight
绿色分量=66+150(1-weight)
蓝色分量=255 (1-weight)
Copy from graphics import *
def convert(input):
celsius = eval(input.getText()) # 输入转换
fahrenheit = 9.0/5.0 * celsius + 32
return fahrenheit
def colorChange(win,input):
cnum = eval(input.getText())
weight = cnum / 100.0
newcolor =color_rgb(255*weight,66+150*(1-weight),255*(1-weight))
win.setBackground(newcolor)
def main():
win = GraphWin("Celsius Converter", 400, 300)
win.setCoords(0.0, 0.0, 3.0, 4.0)
# 绘制输入接口
Text(Point(1,3),
" Celsius Temperature:").draw(win)
Text(Point(2,2.7),
" (Please input 0.0-100.0 )").draw(win)
Text(Point(1,1),
"Fahrenheit Temperature:").draw(win)
input = Entry(Point(2,3), 5)
input.setText("0.0")
input.draw(win)
output = Text(Point(2,1),"")
output.draw(win)
button = Text(Point(1.5,2.0),"Convert It")
button.draw(win)
rect = Rectangle(Point(1,1.5), Point(2,2.5))
rect.draw(win)
# 等待鼠标点击
win.getMouse()
result = convert(input) # 转换输入
output.setText(result) # 显示输出
# 改变颜色
colorChange(win,input)
# 改变按钮字体
button.setText("Quit")
# 等待点击事件,退出程序
win.getMouse()
win.close()
if __name__ == '__main__':
main()
Tkinter库
创建GUI程序的基本步骤为:
导入Tk模块.
创建GUI应用程序的主窗口.
添加控件或GUI应用程序.
进入主事件循环,等待响应用户触发事件.
15中常见的Tk控件
Button, Canvas, Checkbutton, Entry, Frame, Label, Listbox, Menubutton, Menu, Message, Radiobutton, Scale Scrollbar, Text, Toplevel, Spinbox PanedWindow, LabelFrame, tkMessageBox
共同属性
界面布局
Tkinter三种几何管理方法
pack() grid() place()
简单GUI示例
Copy from tkinter import *
tk = Tk()
label = Label(tk, text="Welcome to Python Tkinter")
button = Button(tk, text="Click Me")
label.pack()
button.pack()
tk.mainloop()
响应用户事件示例
Copy from tkinter import *
def processOK():
print("OK button is clicked")
def processCancel():
print("Cancel button is clicked")
def main():
tk = Tk()
btnOK = Button(tk, text="OK", fg = "red", command = processOK)
btnCancel = Button(tk, text = "Cancel", bg = "yellow", command = processCancel)
btnOK.pack()
btnCancel.pack()
tk.mainloop()
显示文字、图片、绘制图形
Copy from tkinter import *
tk = Tk()
canvas = Canvas(tk, width = 200, height = 200)
canvas.pack()
canvas.create_text(100, 40, text = "Welcome to Tkinter", fill = "blue", font = ("Times", 16))
myImage = PhotoImage(file = "python_logo.gif")
canvas.create_image(10, 70, anchor = NW, image = myImage)
canvas.create_rectangle(10, 70, 190, 130)
tk.mainloop()
控制图形移动的示例
Copy from tkinter import *
tk = Tk()
canvas = Canvas(tk, width = 400, height = 400)
canvas.pack()
def moverectangle(event):
if event.keysym == "Up":
canvas.move(1, 0, -5)
elif event.keysym == "Down":
canvas.move(1, 0, 5)
elif event.keysym == "Left":
canvas.move(1, -5, 0)
elif event.keysym == "Right":
canvas.move(1, 5, 0)
canvas.create_rectangle(10,10,50,50,fill="red")
canvas.bind_all("<KeyPress-Up>",moverectangle)
canvas.bind_all("<KeyPress-Down>",moverectangle)
canvas.bind_all("<KeyPress-Left>",moverectangle)
canvas.bind_all("<KeyPress-Right>",moverectangle)
基于tkinter库完成聊天窗口GUI
见ChatWin.py