优化UI
This commit is contained in:
473
v1/main.py
473
v1/main.py
@@ -1,335 +1,157 @@
|
||||
import sys
|
||||
from PyQt5.QtWidgets import QApplication, QMainWindow, QStackedWidget, QHBoxLayout, QWidget, QMessageBox
|
||||
from PyQt5.QtCore import Qt
|
||||
from PyQt5.QtWidgets import QApplication, QMainWindow, QStackedWidget, QHBoxLayout, QWidget, QMessageBox, QPushButton, \
|
||||
QLabel, QVBoxLayout, QFrame, QSizePolicy
|
||||
from PyQt5.QtCore import Qt, QPoint
|
||||
from views.login import LoginPage
|
||||
from views.nav import NavBar
|
||||
from views.home import Home
|
||||
from views.word_to_pdf import WordToPDFPage
|
||||
from views.pdf_tools_page import PDFToolsPage
|
||||
from views.app_center import AppCenter
|
||||
from views.history import HistoryPage
|
||||
from PyQt5.QtGui import QPalette, QColor
|
||||
from PyQt5.QtGui import QPalette, QColor, QFont
|
||||
|
||||
# 优化的暗色主题样式表
|
||||
STYLES_TXT = """
|
||||
/* ===== 全局样式 ===== */
|
||||
QWidget {
|
||||
font-family: 'Segoe UI', 'Microsoft YaHei', sans-serif;
|
||||
font-size: 14px;
|
||||
color: #e2e8f0;
|
||||
border: none;
|
||||
}
|
||||
from styles.styles import STYLES_TXT
|
||||
|
||||
/* 输入框 */
|
||||
QLineEdit {
|
||||
background-color: #2d3748;
|
||||
border: 1px solid #4a5568;
|
||||
border-radius: 6px;
|
||||
padding: 10px;
|
||||
color: #e2e8f0;
|
||||
min-height: 40px;
|
||||
}
|
||||
|
||||
QLineEdit:focus {
|
||||
border-color: #818cf8;
|
||||
outline: none;
|
||||
}
|
||||
class CustomTitleBar(QWidget):
|
||||
"""自定义标题栏控件"""
|
||||
|
||||
/* ===== 按钮全局样式 ===== */
|
||||
QPushButton {
|
||||
background-color: #4f46e5;
|
||||
color: white;
|
||||
border-radius: 8px; /* 增加圆角程度 */
|
||||
padding: 10px 16px;
|
||||
min-height: 40px; /* 增加高度 */
|
||||
font-weight: 500;
|
||||
transition: all 0.2s ease;
|
||||
border: none;
|
||||
outline: none; /* 防止点击时出现虚线边框 */
|
||||
}
|
||||
def __init__(self, parent=None):
|
||||
super().__init__(parent)
|
||||
self.parent = parent
|
||||
self.setMouseTracking(True)
|
||||
self.drag_position = QPoint()
|
||||
self.setObjectName("customTitleBar")
|
||||
self.init_ui()
|
||||
|
||||
QPushButton:hover {
|
||||
background-color: #4338ca;
|
||||
transform: translateY(-2px);
|
||||
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
def init_ui(self):
|
||||
"""初始化标题栏UI"""
|
||||
layout = QHBoxLayout(self)
|
||||
layout.setContentsMargins(15, 8, 15, 8)
|
||||
layout.setSpacing(12)
|
||||
|
||||
QPushButton:pressed {
|
||||
background-color: #3730a3;
|
||||
transform: translateY(0);
|
||||
box-shadow: none;
|
||||
}
|
||||
# 添加应用图标和标题
|
||||
self.title_label = QLabel("奶酪云工具箱")
|
||||
self.title_label.setObjectName("titleLabel")
|
||||
self.title_label.setFont(QFont("Microsoft YaHei UI", 12, QFont.Bold))
|
||||
self.title_label.setAlignment(Qt.AlignCenter)
|
||||
|
||||
QPushButton:disabled {
|
||||
background-color: #4a5568;
|
||||
color: #a0aec0;
|
||||
}
|
||||
# 添加拖拽区域（占位区域）
|
||||
self.drag_area = QWidget()
|
||||
self.drag_area.setObjectName("dragArea")
|
||||
self.drag_area.setSizePolicy(QSizePolicy.Expanding, QSizePolicy.Preferred)
|
||||
|
||||
/* 特殊按钮样式 */
|
||||
QPushButton#navBtn {
|
||||
text-align: left;
|
||||
padding: 12px 25px;
|
||||
color: #a0aec0;
|
||||
border-radius: 8px;
|
||||
margin: 5px 15px;
|
||||
font-size: 14px;
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
min-height: auto; /* 覆盖全局最小高度 */
|
||||
}
|
||||
# 添加窗口控制按钮
|
||||
self.minimize_btn = QPushButton("—")
|
||||
self.minimize_btn.setObjectName("minimizeBtn")
|
||||
self.minimize_btn.setFixedSize(30, 30)
|
||||
self.minimize_btn.clicked.connect(lambda: self.parent.showMinimized())
|
||||
|
||||
QPushButton#navBtn:hover {
|
||||
background-color: rgba(79, 70, 229, 0.1);
|
||||
color: #cbd5e0;
|
||||
}
|
||||
self.maximize_btn = QPushButton("□")
|
||||
self.maximize_btn.setObjectName("maximizeBtn")
|
||||
self.maximize_btn.setFixedSize(30, 30)
|
||||
self.maximize_btn.clicked.connect(self.toggle_maximize)
|
||||
|
||||
QPushButton#navBtn.active {
|
||||
background-color: rgba(79, 70, 229, 0.15);
|
||||
color: #818cf8;
|
||||
font-weight: 500;
|
||||
}
|
||||
self.close_btn = QPushButton("×")
|
||||
self.close_btn.setObjectName("closeBtn")
|
||||
self.close_btn.setFixedSize(30, 30)
|
||||
self.close_btn.clicked.connect(self.parent.close)
|
||||
|
||||
QPushButton#logoutBtn {
|
||||
text-align: left;
|
||||
padding: 12px 25px;
|
||||
border-radius: 8px;
|
||||
margin: 5px 15px;
|
||||
font-size: 14px;
|
||||
color: #feb2b2;
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
min-height: auto; /* 覆盖全局最小高度 */
|
||||
}
|
||||
# 将控件添加到布局中
|
||||
layout.addWidget(self.title_label)
|
||||
layout.addWidget(self.drag_area)
|
||||
layout.addWidget(self.minimize_btn)
|
||||
layout.addWidget(self.maximize_btn)
|
||||
layout.addWidget(self.close_btn)
|
||||
|
||||
QPushButton#logoutBtn:hover {
|
||||
color: #f56565;
|
||||
}
|
||||
def toggle_maximize(self):
|
||||
"""切换窗口最大化/正常状态"""
|
||||
if self.parent.isMaximized():
|
||||
self.parent.showNormal()
|
||||
self.maximize_btn.setText("□")
|
||||
else:
|
||||
self.parent.showMaximized()
|
||||
self.maximize_btn.setText("⬜")
|
||||
|
||||
/* 操作按钮样式 */
|
||||
QPushButton#actionBtn {
|
||||
background-color: rgba(129, 140, 248, 0.1);
|
||||
color: #818cf8;
|
||||
border: 1px solid rgba(129, 140, 248, 0.2);
|
||||
min-height: auto; /* 覆盖全局最小高度 */
|
||||
}
|
||||
def mousePressEvent(self, event):
|
||||
"""鼠标按下事件处理"""
|
||||
if event.button() == Qt.LeftButton:
|
||||
self.drag_position = event.globalPos() - self.parent.frameGeometry().topLeft()
|
||||
event.accept()
|
||||
|
||||
QPushButton#actionBtn:hover {
|
||||
background-color: rgba(129, 140, 248, 0.2);
|
||||
}
|
||||
def mouseMoveEvent(self, event):
|
||||
"""鼠标移动事件处理"""
|
||||
if event.buttons() == Qt.LeftButton:
|
||||
self.parent.move(event.globalPos() - self.drag_position)
|
||||
event.accept()
|
||||
|
||||
QPushButton#retryBtn {
|
||||
background-color: rgba(251, 113, 133, 0.1);
|
||||
color: #fb7185;
|
||||
border: 1px solid rgba(251, 113, 133, 0.2);
|
||||
min-height: auto; /* 覆盖全局最小高度 */
|
||||
}
|
||||
|
||||
QPushButton#retryBtn:hover {
|
||||
background-color: rgba(251, 113, 133, 0.2);
|
||||
}
|
||||
|
||||
QPushButton#deleteBtn {
|
||||
background-color: rgba(120, 113, 108, 0.1);
|
||||
color: #a8a29e;
|
||||
border: 1px solid rgba(120, 113, 108, 0.2);
|
||||
min-height: auto; /* 覆盖全局最小高度 */
|
||||
}
|
||||
|
||||
QPushButton#deleteBtn:hover {
|
||||
background-color: rgba(120, 113, 108, 0.2);
|
||||
}
|
||||
|
||||
/* 卡片按钮样式 */
|
||||
QPushButton#appCardBtn {
|
||||
min-height: auto; /* 覆盖全局最小高度 */
|
||||
min-width: 120px;
|
||||
}
|
||||
|
||||
/* 登录页面按钮 */
|
||||
QPushButton#loginBtn {
|
||||
min-height: auto; /* 覆盖全局最小高度 */
|
||||
min-width: 240px;
|
||||
padding: 14px 30px;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
/* 列表控件 */
|
||||
QListWidget {
|
||||
background-color: #2d3748;
|
||||
border: 1px solid #4a5568;
|
||||
border-radius: 8px;
|
||||
padding: 4px;
|
||||
color: #e2e8f0;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
QListWidget::item {
|
||||
padding: 8px 12px;
|
||||
border-bottom: 1px solid #4a5568;
|
||||
}
|
||||
|
||||
QListWidget::item:selected {
|
||||
background-color: rgba(129, 140, 248, 0.15);
|
||||
color: #e2e8f0;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
/* 滚动条 */
|
||||
QScrollBar:vertical {
|
||||
background: #2d3748;
|
||||
width: 10px;
|
||||
border: none;
|
||||
}
|
||||
|
||||
QScrollBar::handle:vertical {
|
||||
background: #4a5568;
|
||||
min-height: 20px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
QScrollBar::handle:vertical:hover {
|
||||
background: #718096;
|
||||
}
|
||||
|
||||
QScrollBar::add-line:vertical,
|
||||
QScrollBar::sub-line:vertical {
|
||||
height: 0;
|
||||
}
|
||||
|
||||
QScrollBar::add-page:vertical,
|
||||
QScrollBar::sub-page:vertical {
|
||||
background: none;
|
||||
}
|
||||
|
||||
/* 标签 */
|
||||
QLabel {
|
||||
color: #e2e8f0;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
/* 菜单栏 */
|
||||
/* 导航栏 */
|
||||
#navBar {
|
||||
background-color: #1a202c;
|
||||
border-right: 1px solid #2d3748;
|
||||
}
|
||||
|
||||
/* 用户卡片 */
|
||||
#userCard {
|
||||
background-color: #2d3748;
|
||||
border-radius: 8px;
|
||||
margin: 15px;
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
/* 导航按钮 */
|
||||
#navBtn {
|
||||
text-align: left;
|
||||
padding: 12px 25px;
|
||||
color: #a0aec0;
|
||||
border-radius: 8px;
|
||||
margin: 5px 15px;
|
||||
font-size: 14px;
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
}
|
||||
|
||||
#navBtn:hover {
|
||||
background-color: rgba(79, 70, 229, 0.1);
|
||||
color: #cbd5e0;
|
||||
}
|
||||
|
||||
#navBtn.active {
|
||||
background-color: rgba(79, 70, 229, 0.15);
|
||||
color: #818cf8;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
/* 退出按钮 */
|
||||
#logoutBtn {
|
||||
text-align: left;
|
||||
padding: 12px 25px;
|
||||
border-radius: 8px;
|
||||
margin: 5px 15px;
|
||||
font-size: 14px;
|
||||
color: #feb2b2;
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
}
|
||||
|
||||
#logoutBtn:hover {
|
||||
color: #f56565;
|
||||
}
|
||||
|
||||
/* 分割线 */
|
||||
QFrame[frameShape="4"] { /* HLine */
|
||||
background-color: #2d3748;
|
||||
margin: 10px 15px;
|
||||
max-height: 1px;
|
||||
}
|
||||
|
||||
/* 进度条 */
|
||||
QProgressBar {
|
||||
border-radius: 4px;
|
||||
height: 8px;
|
||||
background-color: #2d3748;
|
||||
border: 1px solid #4a5568;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
QProgressBar::chunk {
|
||||
background-color: #4f46e5;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
/* 复选框 */
|
||||
QCheckBox {
|
||||
color: #e2e8f0;
|
||||
spacing: 8px;
|
||||
}
|
||||
|
||||
QCheckBox::indicator {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
border: 1px solid #4a5568;
|
||||
border-radius: 3px;
|
||||
background-color: #2d3748;
|
||||
}
|
||||
|
||||
QCheckBox::indicator:checked {
|
||||
background-color: #4f46e5;
|
||||
border: 1px solid #4f46e5;
|
||||
}
|
||||
|
||||
/* 分组框 */
|
||||
QGroupBox {
|
||||
font-weight: bold;
|
||||
background-color: #2d3748;
|
||||
border: 1px solid #4a5568;
|
||||
border-radius: 8px;
|
||||
margin-top: 1.5ex;
|
||||
padding-top: 10px;
|
||||
}
|
||||
|
||||
QGroupBox::title {
|
||||
subcontrol-origin: margin;
|
||||
subcontrol-position: top left;
|
||||
background-color: transparent;
|
||||
padding: 0 3px;
|
||||
left: 9px;
|
||||
}
|
||||
"""
|
||||
def mouseDoubleClickEvent(self, event):
|
||||
"""鼠标双击事件处理"""
|
||||
if event.button() == Qt.LeftButton:
|
||||
self.toggle_maximize()
|
||||
event.accept()
|
||||
|
||||
|
||||
class MainWindow(QMainWindow):
|
||||
def __init__(self):
|
||||
super().__init__()
|
||||
self.username = None
|
||||
self.setWindowFlag(Qt.FramelessWindowHint) # 设置为无边框窗口
|
||||
self.init_ui()
|
||||
|
||||
def init_ui(self):
|
||||
self.setWindowTitle("文档处理工具")
|
||||
self.setGeometry(100, 100, 1200, 800)
|
||||
self.setStyleSheet(STYLES_TXT)
|
||||
|
||||
# 添加自定义标题栏样式
|
||||
titlebar_styles = """
|
||||
/* 自定义标题栏样式 */
|
||||
#customTitleBar {
|
||||
background-color: #1a202c;
|
||||
border-bottom: 1px solid #2d3748;
|
||||
height: 50px;
|
||||
}
|
||||
|
||||
#titleLabel {
|
||||
color: #cbd5e0;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
#dragArea {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
QPushButton#minimizeBtn,
|
||||
QPushButton#maximizeBtn,
|
||||
QPushButton#closeBtn {
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
font-size: 14px;
|
||||
color: #a0aec0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
QPushButton#minimizeBtn:hover,
|
||||
QPushButton#maximizeBtn:hover {
|
||||
background-color: rgba(74, 85, 104, 0.3);
|
||||
color: #e2e8f0;
|
||||
}
|
||||
|
||||
QPushButton#closeBtn:hover {
|
||||
background-color: rgba(254, 178, 178, 0.3);
|
||||
color: #f56565;
|
||||
}
|
||||
|
||||
/* 窗口边框效果 */
|
||||
#mainWidget {
|
||||
border: 1px solid #2d3748;
|
||||
}
|
||||
"""
|
||||
# 合并样式表
|
||||
self.setStyleSheet(STYLES_TXT + titlebar_styles)
|
||||
|
||||
# 设置暗色主题调色板
|
||||
palette = QPalette()
|
||||
@@ -351,10 +173,29 @@ class MainWindow(QMainWindow):
|
||||
|
||||
# 主窗口部件
|
||||
self.main_widget = QWidget()
|
||||
self.main_layout = QHBoxLayout(self.main_widget)
|
||||
self.main_widget.setObjectName("mainWidget")
|
||||
self.main_layout = QVBoxLayout(self.main_widget)
|
||||
self.main_layout.setContentsMargins(0, 0, 0, 0)
|
||||
self.main_layout.setSpacing(0)
|
||||
|
||||
# 添加自定义标题栏
|
||||
self.title_bar = CustomTitleBar(self)
|
||||
self.main_layout.addWidget(self.title_bar)
|
||||
|
||||
# 添加分隔线
|
||||
separator = QFrame()
|
||||
separator.setFrameShape(QFrame.HLine)
|
||||
separator.setFrameShadow(QFrame.Sunken)
|
||||
separator.setMaximumHeight(1)
|
||||
separator.setStyleSheet("background-color: #2d3748;")
|
||||
self.main_layout.addWidget(separator)
|
||||
|
||||
# 主内容区域
|
||||
content_widget = QWidget()
|
||||
content_layout = QHBoxLayout(content_widget)
|
||||
content_layout.setContentsMargins(0, 0, 0, 0)
|
||||
content_layout.setSpacing(0)
|
||||
|
||||
# 导航栏 (初始隐藏)
|
||||
self.nav_bar = NavBar("")
|
||||
self.nav_bar.setObjectName("navBar")
|
||||
@@ -381,10 +222,13 @@ class MainWindow(QMainWindow):
|
||||
# Word转PDF页
|
||||
self.word_to_pdf = WordToPDFPage()
|
||||
|
||||
# Word转PDF页
|
||||
self.pdf_tools_page = PDFToolsPage()
|
||||
|
||||
# 使用记录页
|
||||
self.history_page = HistoryPage()
|
||||
|
||||
# 设置页（待实现）
|
||||
# 设置页（占位）
|
||||
self.settings_page = QWidget()
|
||||
self.settings_page.setObjectName("settingsPage")
|
||||
|
||||
@@ -393,17 +237,26 @@ class MainWindow(QMainWindow):
|
||||
self.stacked_pages.addWidget(self.app_center)
|
||||
self.stacked_pages.addWidget(self.home)
|
||||
self.stacked_pages.addWidget(self.word_to_pdf)
|
||||
self.stacked_pages.addWidget(self.pdf_tools_page)
|
||||
self.stacked_pages.addWidget(self.history_page)
|
||||
self.stacked_pages.addWidget(self.settings_page)
|
||||
|
||||
# 主布局
|
||||
self.main_layout.addWidget(self.nav_bar)
|
||||
self.main_layout.addWidget(self.stacked_pages, 1) # 设置弹性因子为1
|
||||
# 主内容布局
|
||||
content_layout.addWidget(self.nav_bar)
|
||||
content_layout.addWidget(self.stacked_pages, 1)
|
||||
|
||||
# 添加到主布局
|
||||
self.main_layout.addWidget(content_widget, 1)
|
||||
|
||||
self.setCentralWidget(self.main_widget)
|
||||
|
||||
# 鼠标悬停在边缘时的调整光标
|
||||
self.setMouseTracking(True)
|
||||
|
||||
def handle_login_success(self, username):
|
||||
self.username = username
|
||||
# 更新标题栏显示
|
||||
self.title_bar.title_label.setText(f"文档处理工具 - 欢迎 {username}")
|
||||
# 更新导航栏用户信息
|
||||
self.nav_bar.username = username
|
||||
self.nav_bar.show()
|
||||
@@ -415,6 +268,8 @@ class MainWindow(QMainWindow):
|
||||
self.username = None
|
||||
self.nav_bar.hide()
|
||||
self.stacked_pages.setCurrentWidget(self.login_page)
|
||||
# 重置标题栏
|
||||
self.title_bar.title_label.setText("文档处理工具")
|
||||
|
||||
def handle_nav_click(self, nav_id):
|
||||
# 确保导航栏状态更新
|
||||
@@ -434,17 +289,15 @@ class MainWindow(QMainWindow):
|
||||
try:
|
||||
if app_id == "word_to_pdf":
|
||||
self.stacked_pages.setCurrentWidget(self.word_to_pdf)
|
||||
elif app_id == "pdf_tools_page":
|
||||
print('1')
|
||||
self.stacked_pages.setCurrentWidget(self.pdf_tools_page)
|
||||
elif app_id == "history":
|
||||
# 注意：这里假设历史记录页面尚未开发，暂时显示word_to_pdf页面
|
||||
# 实际开发中应替换为正确的历史记录页面
|
||||
self.stacked_pages.setCurrentWidget(self.word_to_pdf)
|
||||
else:
|
||||
# 未开发的应用：弹出提示弹窗
|
||||
self.show_development_popup(app_id)
|
||||
except Exception as e:
|
||||
# 捕获并打印异常信息，避免程序闪退
|
||||
print(f"处理应用选择时发生错误: {e}")
|
||||
# 可以选择显示错误弹窗
|
||||
QMessageBox.critical(self, "错误", f"发生错误: {str(e)}", QMessageBox.Button.Ok)
|
||||
|
||||
def show_development_popup(self, app_id):
|
||||
@@ -476,4 +329,4 @@ def main():
|
||||
|
||||
|
||||
if __name__ == "__main__":
|
||||
main()
|
||||
main()
|
||||
Reference in New Issue
Block a user