Hướng dẫn dùng button tkinter python
Tiện ích nút được sử dụng để thêm các loại nút khác nhau vào ứng dụng Python. Python cho phép chúng tôi định cấu hình giao diện của nút theo yêu cầu của chúng tôi. Các tùy chọn khác nhau có thể được đặt hoặc đặt lại tùy thuộc vào các yêu cầu. The Button widget is used to add buttons in a Python application. These buttons can display text or images that convey the purpose of the buttons. You can attach a function or a method to a button which is called automatically when you click the button. SyntaxHere is the simple syntax to create this widget − w = Button ( master, option=value, ... ) Parameters
activebackground Background color when the button is under the cursor. 2activeforeground Foreground color when the button is under the cursor. 3bd Border width in pixels. Default is 2. 4bg Normal background color. 5command Function or method to be called when the button is clicked. 6fg Normal foreground (text) color. 7font Text font to be used for the button's label. 8height Height of the button in text lines (for textual buttons) or pixels (for images). highlightcolor The color of the focus highlight when the widget has focus. 10image Image to be displayed on the button (instead of text). 11justify How to show multiple text lines: LEFT to left-justify each line; CENTER to center them; or RIGHT to right-justify. 12padx Additional padding left and right of the text. 13pady Additional padding above and below the text. 14relief Relief specifies the type of the border. Some of the values are SUNKEN, RAISED, GROOVE, and RIDGE. 15state Set this option to DISABLED to gray out the button and make it unresponsive. Has the value ACTIVE when the mouse is over it. Default is NORMAL. 16underline Default is -1, meaning that no character of the text on the button will be underlined. If nonnegative, the corresponding text character will be underlined. 17width Width of the button in letters (if displaying text) or pixels (if displaying an image). 18wraplength If this value is set to a positive number, the text lines will be wrapped to fit within this length. MethodsFollowing are commonly used methods for this widget − flash() Causes the button to flash several times between active and normal colors. Leaves the button in the state it was in originally. Ignored if the button is disabled. 2invoke() Calls the button's callback, and returns what that function returns. Has no effect if the button is disabled or there is no callback. Python cung cấp các tùy chọn khác nhau để phát triển giao diện người dùng đồ họa (GUI). Quan trọng nhất được liệt kê dưới đây. Nội dung chính Show
Lập trình Tkinter trong PythonTkinter là thư viện GUI tiêu chuẩn cho Python. Tkinter trong Python cung cấp một cách nhanh chóng và dễ dàng để tạo các ứng dụng GUI. Tkinter cung cấp giao diện hướng đối tượng cho bộ công cụ Tk GUI. Sau đây là các bước để tạo một ứng dụng Tkinter:
Ví dụ: # import Tkinter module from tkinter import * # Tạo cửa sổ chính của ứng dụng GUI top = Tk() # Gọi vòng lặp sự kiện chính để các hành động có thể diễn ra trên màn hình máy tính của người dùng top.mainloop() Kết quả: Các Widget của Tkinter trong PythonCó nhiều widget khác nhau như button, canvas, checkbutton, entry, ... chúng được sử dụng để xây dụng các ứng dụng GUI trong Python. Trong Tkinter có hai loại widget, loại thứ nhất là các widget thường như nút bấm, textbox… loại thứ hai là containter, đây là những widget chứa các widget khác, chúng còn có một cái tên nữa là layout. Trong Tkinter có 3 loại layout là Style().configure("TFrame", background="#333")1, Style().configure("TFrame", background="#333")2và Style().configure("TFrame", background="#333")3 Trong đó Style().configure("TFrame", background="#333")4là kiểu layout tự do, thuật ngữ gọi là Absolute Positioning, tức là bạn sẽ phải tự quy định vị trí cũng như kích thước của các widget. Layout Style().configure("TFrame", background="#333")5sắp xếp các widget của bạn theo chiều ngang và chiều dọc. Còn layout Style().configure("TFrame", background="#333")2sắp xếp widget theo dạng bảng. Thiết kế tự doThường thì khi thiết kế giao diện chúng ta dùng layout nhiều hơn là thiết kế theo kiểu tự do. Khi thiết kế theo kiểu tự do này chúng ta sẽ phải tự quy định vị trí và kích thước cho các widget trên màn hình, nếu kích thước cửa sổ thay đổi thì kích thước và vị trí của các widget không thay đổi. Thiết kế theo kiểu tự do cũng rất bất tiện khi bạn muốn thay đổi, thêm hay bớt các widget thì hầu như bạn sẽ phải sắp xếp lại toàn bộ widget. from PIL import Image, ImageTk from tkinter import Tk, Label, BOTH from tkinter.ttk import Frame, Style class Example(Frame): def __init__(self, parent): Frame.__init__(self, parent) self.parent = parent self.initUI() def initUI(self): self.parent.title("Absolute positioning") self.pack(fill=BOTH, expand=1) Style().configure("TFrame", background="#333") bard = Image.open("C:\\bardejov.jpg") bardejov = ImageTk.PhotoImage(bard) label1 = Label(self, image=bardejov) label1.image = bardejov label1.place(x=20, y=20) rot = Image.open("C:\\rotunda.jpg") rotunda = ImageTk.PhotoImage(rot) label2 = Label(self, image=rotunda) label2.image = rotunda label2.place(x=40, y=160) minc = Image.open("C:\\mincol.jpg") mincol = ImageTk.PhotoImage(minc) label3 = Label(self, image=mincol) label3.image = mincol label3.place(x=170, y=50) root = Tk() root.geometry("300x280+300+300") app = Example(root) root.mainloop() Trong ví dụ trên, chúng ta hiển thị 3 ảnh lên cửa sổ. from PIL import Image, ImageTk Để hiển thị ảnh thì chúng ta có thể dùng module Style().configure("TFrame", background="#333")7 trong gói Style().configure("TFrame", background="#333")8 nhưng module này rất hạn chế nên ở đây mình dùng module Style().configure("TFrame", background="#333")9 và bard = Image.open("C:\\bardejov.jpg") bardejov = ImageTk.PhotoImage(bard)0 trong thư viện Pillow, thư viện này không có sẵn trong Python 3 mà bạn phải tự down về và cài vào. Style().configure("TFrame", background="#333") Dòng trên sẽ tô màu nền cửa sổ là màu xám đen. bard = Image.open("C:\\bardejov.jpg") bardejov = ImageTk.PhotoImage(bard) Hai dòng trên sẽ tạo các đối tượng ảnh và tải chúng vào chương trình. label1 = Label(self, image=bardejov) Chúng ta tạo đối tượng bard = Image.open("C:\\bardejov.jpg") bardejov = ImageTk.PhotoImage(bard)1, đây là một lớp dùng để hiển thị chữ và ảnh. label1.image = bardejov Chúng ta phải lưu lại tham chiếu đến ảnh nếu không sẽ bị xóa. label1.place(x=20, y=20) Chúng ta đặt ảnh tại vị trí x = 20 và y = 20. ButtonTrong ví dụ dưới đây, chúng ta sẽ hiển thị hai button (nút bấm) ở góc trái màn hình sử dụng layout Style().configure("TFrame", background="#333")1. from tkinter import Tk, RIGHT, BOTH, RAISED from tkinter.ttk import Frame, Button, Style class Example(Frame): def __init__(self, parent): Frame.__init__(self, parent) self.parent = parent self.initUI() def initUI(self): self.parent.title("Button") self.style = Style() self.style.theme_use("default") frame = Frame(self, relief=RAISED, borderwidth=1) frame.pack(fill=BOTH, expand=True) self.pack(fill=BOTH, expand=True) closeButton = Button(self, text="Close") closeButton.pack(side=RIGHT, padx=5, pady=5) okButton = Button(self, text="OK") okButton.pack(side=RIGHT) root = Tk() root.geometry("300x200+300+300") app = Example(root) root.mainloop() Chúng ta tạo ra 2 frame, frame đầu tiên là layout chính dùng để chứa toàn bộ widget. Frame thứ hai chúng ta đặt như lên frame đầu tiên và cho kích thước dãn ra theo cả chiều ngang và chiều dọc. Hai button được đặt theo chiều ngang ở góc bên phải của cửa sổ. frame = Frame(self, relief=RAISED, borderwidth=1) frame.pack(fill=BOTH, expand=True) Hai dòng code trên tạo ra bard = Image.open("C:\\bardejov.jpg") bardejov = ImageTk.PhotoImage(bard)3thứ hai, frame này sẽ chiếm phần lớn diện tích bard = Image.open("C:\\bardejov.jpg") bardejov = ImageTk.PhotoImage(bard)4 chính. Tham số bard = Image.open("C:\\bardejov.jpg") bardejov = ImageTk.PhotoImage(bard)5mô phỏng hiệu ứng hiển thị 3D của bard = Image.open("C:\\bardejov.jpg") bardejov = ImageTk.PhotoImage(bard)6ngoài giá trị RAISED bạn có thể thử một số giá trị khác như FLAT, SUNKEN, GROOVE, và RIDGE. Tham số bard = Image.open("C:\\bardejov.jpg") bardejov = ImageTk.PhotoImage(bard)7 hiển thị đường viền của frame, mặc định tham số này là 0 nên bạn ko thể thấy đường viền. closeButton = Button(self, text="Close") closeButton.pack(side=RIGHT, padx=5, pady=5) Ở hai dòng trên chúng ta tạo nút close và tham chiếu đến đối tượng bard = Image.open("C:\\bardejov.jpg") bardejov = ImageTk.PhotoImage(bard)8. Phương thức Style().configure("TFrame", background="#333")1 label1 = Label(self, image=bardejov)0quy định cách hiển thị của button trên cửa sổ, tham số label1 = Label(self, image=bardejov)1 sẽ đưa button vào vị trí bên phải, label1 = Label(self, image=bardejov)2 và label1 = Label(self, image=bardejov)3 duy định khoảng cách giữa button với các widget khác và với đường viền cửa sổ chính, ở đây khoảng cách là 5 pixel. from PIL import Image, ImageTk0 Nút OK cũng được tạo ra tương tự và cũng được đưa sang phía bên phải màn hình, sát bên cạnh nút Close với khoảng cách 5 pixel. Tạo FormTrong ví dụ dưới đây, chúng ta tiếp tục tìm hiểu về layout label1 = Label(self, image=bardejov)4 from PIL import Image, ImageTk1 Chúng ta thiết kế một cửa sổ hiển thị form đánh giá. from PIL import Image, ImageTk2 Đầu tiên chúng ta tạo frame chính để chứa các widget còn lại kể cả các frame khác. from PIL import Image, ImageTk3 Chúng ta tạo một frame và đặt 2 widget vào đó, đó là một label và một entry. bard = Image.open("C:\\bardejov.jpg") bardejov = ImageTk.PhotoImage(bard)1 là widget dùng để hiển thị text, label1 = Label(self, image=bardejov)6 là widget tạo nhập text. Label có độ dài cố định còn entry thì có độ dài tự động thay đổi theo kích thước cửa sổ nhờ vào 2 tham số label1 = Label(self, image=bardejov)7 và label1 = Label(self, image=bardejov)8. Frame thứ hai cũng tương tự. from PIL import Image, ImageTk4 Trong frame thứ ba chúng ta đặt một L label1 = Label(self, image=bardejov)9 và một T label1.image = bardejov0. Label được đặt về phía trên của frame, còn text tự động co dãn theo kích thước cửa sổ. Grid layoutTiếp theo chúng ta sẽ tìm hiểu về layout label1.image = bardejov1. from PIL import Image, ImageTk5 Đoạn code trên thiết kế giao diện của một chiếc máy tính bỏ túi. from PIL import Image, ImageTk6 Chúng ta quy định kiểu phông chữ thông qua tham số label1.image = bardejov2 và khoảng cách của frame với cửa sổ thông qua tham số padding. from PIL import Image, ImageTk7 Hai phương thức label1.image = bardejov3và label1.image = bardejov4quy định khoảng cách giữa các widget. from PIL import Image, ImageTk8 Chúng ta tạo một Entry để hiển thị số cũng như kết quả tính toán. Tham số label1.image = bardejov5 quy định cách thức co dãn theo kích thước cửa sổ, W+E tức là co dãn theo chiều từ trái sang phải. from PIL import Image, ImageTk9 Nút label1.image = bardejov6 được đặt tại vị trí hàng 1 cột 0, chỉ số hàng và cột bắt đầu từ 0. Style().configure("TFrame", background="#333")0 Phương thức label1.image = bardejov7hiển thị các widget lên màn hình và khởi tạo kích thước cho chúng. Nếu chúng ta chỉ gọi label1.image = bardejov8 mà không đưa các tham số vào như trên thì kích thước của các widget luôn luôn là kích thước vừa đủ để bao bọc lấy đoạn text bên trong, ngoài ra không có tham số truyền vào thì phương thức này sẽ đặt layout ở vị trí trên cùng của frame. Bạn có thể kéo dãn cửa sổ để thấy cách nó hoạt động. |