🔧 調整圖片上傳介面,將狀態標籤移至預覽區域前面,並增加預覽區域的最小及最大高度,以改善使用者體驗。

This commit is contained in:
Minidoracat 2025-05-31 05:37:36 +08:00
parent 7bacf9ba18
commit 10b33ebb4f
2 changed files with 12 additions and 9 deletions

View File

@ -169,13 +169,13 @@ class ImageUploadWidget(QWidget):
# 拖拽區域
self._create_drop_zone(layout)
# 狀態標籤 - 移到預覽區域前面
self.status_label = QLabel("已選擇 0 張圖片")
self.status_label.setStyleSheet("color: #9e9e9e; font-size: 10px; margin: 5px 0;")
layout.addWidget(self.status_label)
# 圖片預覽區域
self._create_preview_area(layout)
# 狀態標籤
self.status_label = QLabel("已選擇 0 張圖片")
self.status_label.setStyleSheet("color: #9e9e9e; font-size: 10px;")
layout.addWidget(self.status_label)
def _create_buttons(self, layout: QVBoxLayout) -> None:
"""創建操作按鈕"""
@ -243,8 +243,8 @@ class ImageUploadWidget(QWidget):
self.preview_scroll.setWidget(self.preview_widget)
self.preview_scroll.setVerticalScrollBarPolicy(Qt.ScrollBarAsNeeded)
self.preview_scroll.setHorizontalScrollBarPolicy(Qt.ScrollBarAsNeeded)
self.preview_scroll.setMinimumHeight(70)
self.preview_scroll.setMaximumHeight(180)
self.preview_scroll.setMinimumHeight(100) # 增加最小高度
self.preview_scroll.setMaximumHeight(250) # 增加最大高度
self.preview_scroll.setWidgetResizable(True)
self.preview_scroll.setStyleSheet("""
QScrollArea {

View File

@ -289,6 +289,8 @@
.image-preview-area {
flex: 1;
min-height: 120px;
max-height: 300px;
overflow-y: auto;
border: 1px solid var(--border-color);
border-radius: 6px;
@ -341,7 +343,8 @@
.image-status {
color: var(--text-secondary);
font-size: 11px;
margin-top: 10px;
margin-top: 8px;
margin-bottom: 10px;
}
/* ===== 命令分頁樣式 ===== */
@ -516,8 +519,8 @@
<div class="drop-zone" id="dropZone">
🎯 拖拽圖片到這裡 (PNG、JPG、JPEG、GIF、BMP、WebP)
</div>
<div class="image-preview-area" id="imagePreviewArea"></div>
<div class="image-status" id="imageStatus">已選擇 0 張圖片</div>
<div class="image-preview-area" id="imagePreviewArea"></div>
</div>
</div>