Pygubu-Designer 使用指南

news2024/12/21 11:44:59

Pygubu-Designer 使用指南

一、简介

Pygubu-Designer 是一个用于创建 Tkinter GUI 界面的可视化设计工具，让 Python 开发者能够通过拖拽方式设计界面，大大提高开发效率。

二、安装配置

1. 安装

# 使用 pip 安装
pip install pygubu-designer

# 或者使用 pip3
pip3 install pygubu-designer

2. 启动与配置

# 命令行启动
pygubu-designer

基础配置步骤：

打开 Edit -> Preferences
设置 Python 解释器路径
选择界面主题
配置项目默认保存路径

三、基础示例

示例1：创建简单窗口

import tkinter as tk
import pygubu

class SimpleWindow:
    def __init__(self):
        self.builder = pygubu.Builder()
        
        # 加载ui文件
        self.builder.add_from_file('simple_window.ui')
        
        # 获取主窗口
        self.mainwindow = self.builder.get_object('main_window')
        
        # 连接回调函数
        self.builder.connect_callbacks(self)
    
    def run(self):
        self.mainwindow.mainloop()

if __name__ == '__main__':
    app = SimpleWindow()
    app.run()

示例2：计算器界面

import tkinter as tk
import pygubu

class Calculator:
    def __init__(self):
        self.builder = pygubu.Builder()
        self.builder.add_from_file('calculator.ui')
        self.mainwindow = self.builder.get_object('calculator_window')
        
        # 获取输入框和按钮
        self.display = self.builder.get_object('display_entry')
        self.builder.connect_callbacks(self)
    
    def button_click(self):
        # 按钮点击回调
        number = self.builder.get_variable('number').get()
        current = self.display.get()
        self.display.delete(0, tk.END)
        self.display.insert(0, current + number)

    def run(self):
        self.mainwindow.mainloop()

示例3：登录界面

import tkinter as tk
import pygubu
from tkinter import messagebox

class LoginWindow:
    def __init__(self):
        self.builder = pygubu.Builder()
        self.builder.add_from_file('login.ui')
        self.mainwindow = self.builder.get_object('login_window')
        
        # 获取用户名和密码输入框
        self.username_entry = self.builder.get_object('username_entry')
        self.password_entry = self.builder.get_object('password_entry')
        
        # 连接回调
        self.builder.connect_callbacks(self)
    
    def login(self):
        username = self.username_entry.get()
        password = self.password_entry.get()
        
        # 简单的验证逻辑
        if username == "admin" and password == "123456":
            messagebox.showinfo("成功", "登录成功！")
        else:
            messagebox.showerror("错误", "用户名或密码错误！")
    
    def clear_fields(self):
        self.username_entry.delete(0, tk.END)
        self.password_entry.delete(0, tk.END)
    
    def run(self):
        self.mainwindow.mainloop()

if __name__ == '__main__':
    app = LoginWindow()
    app.run()

四、登录界面UI文件示例

<?xml version='1.0' encoding='utf-8'?>
<interface version="1.2">
  <object class="tk.Toplevel" id="login_window">
    <property name="title">登录</property>
    <child>
      <object class="ttk.Frame" id="main_frame">
        <property name="padding">20</property>
        <layout manager="pack">
          <property name="expand">true</property>
          <property name="fill">both</property>
        </layout>
        <child>
          <object class="ttk.Label" id="username_label">
            <property name="text">用户名：</property>
            <layout manager="grid">
              <property name="column">0</property>
              <property name="row">0</property>
              <property name="padx">5</property>
              <property name="pady">5</property>
            </layout>
          </object>
        </child>
        <child>
          <object class="ttk.Entry" id="username_entry">
            <layout manager="grid">
              <property name="column">1</property>
              <property name="row">0</property>
              <property name="padx">5</property>
              <property name="pady">5</property>
            </layout>
          </object>
        </child>
        <child>
          <object class="ttk.Label" id="password_label">
            <property name="text">密码：</property>
            <layout manager="grid">
              <property name="column">0</property>
              <property name="row">1</property>
              <property name="padx">5</property>
              <property name="pady">5</property>
            </layout>
          </object>
        </child>
        <child>
          <object class="ttk.Entry" id="password_entry">
            <property name="show">*</property>
            <layout manager="grid">
              <property name="column">1</property>
              <property name="row">1</property>
              <property name="padx">5</property>
              <property name="pady">5</property>
            </layout>
          </object>
        </child>
        <child>
          <object class="ttk.Button" id="login_button">
            <property name="text">登录</property>
            <property name="command">login</property>
            <layout manager="grid">
              <property name="column">0</property>
              <property name="row">2</property>
              <property name="columnspan">2</property>
              <property name="pady">10</property>
            </layout>
          </object>
        </child>
      </object>
    </child>
  </object>
</interface>