widget: new fillMode and smt

2026-08-15 18:43:59 +00:00 · 2025-11-19 16:07:07 +08:00
parent 79f79e0cff
commit 12766e411d
3 changed files with 16 additions and 19 deletions
@@ -0,0 +1,135 @@
+import QtQuick
+import QtQuick.Layouts
+import QtQuick.Controls
+import qs.Commons
+import qs.Widgets
+import qs.Services.Keyboard
+
+Item {
+  id: previewPanel
+
+  property var currentItem: null
+  property string fullContent: ""
+  property string imageDataUrl: ""
+  property bool loadingFullContent: false
+  property bool isImageContent: false
+
+  implicitHeight: contentColumn.implicitHeight + Style.marginL * 2
+
+  Connections {
+    target: previewPanel
+    function onCurrentItemChanged() {
+      fullContent = "";
+      imageDataUrl = "";
+      loadingFullContent = false;
+      isImageContent = currentItem && currentItem.isImage;
+
+      if (currentItem && currentItem.clipboardId) {
+        if (isImageContent) {
+          imageDataUrl = ClipboardService.getImageData(currentItem.clipboardId) || "";
+          loadingFullContent = !imageDataUrl;
+
+          if (!imageDataUrl && currentItem.mime) {
+            ClipboardService.decodeToDataUrl(currentItem.clipboardId, currentItem.mime, null);
+          }
+        } else {
+          loadingFullContent = true;
+          ClipboardService.decode(currentItem.clipboardId, function(content) {
+            fullContent = content;
+            loadingFullContent = false;
+          });
+        }
+      }
+    }
+  }
+
+  readonly property int _rev: ClipboardService.revision
+
+  Timer {
+    id: imageUpdateTimer
+    interval: 200
+    running: currentItem && currentItem.isImage && imageDataUrl === ""
+    repeat: currentItem && currentItem.isImage && imageDataUrl === ""
+
+    onTriggered: {
+      if (currentItem && currentItem.clipboardId) {
+        const newData = ClipboardService.getImageData(currentItem.clipboardId) || "";
+        if (newData !== imageDataUrl) {
+          imageDataUrl = newData;
+          if (newData) {
+            loadingFullContent = false;
+          }
+        }
+      }
+    }
+  }
+
+  Rectangle {
+    anchors.fill: parent
+    color: Color.mSurface || "#f5f5f5"
+    border.color: Color.mOutlineVariant || "#cccccc"
+    border.width: 1
+    radius: Style.radiusM
+
+    ColumnLayout {
+      id: contentColumn
+      anchors.fill: parent
+      anchors.margins: Style.marginM
+      spacing: Style.marginM
+
+      NText {
+        text: currentItem ? (currentItem.name || "Preview") : "Preview"
+        font.weight: Style.fontWeightBold
+        Layout.fillWidth: true
+        pointSize: Style.fontSizeM
+        color: Color.mOnSurface
+      }
+
+      NDivider {
+        Layout.fillWidth: true
+      }
+
+      Rectangle {
+        Layout.fillWidth: true
+        Layout.fillHeight: true
+        color: Color.mSurfaceVariant || "#e0e0e0"
+        border.color: Color.mOutline || "#aaaaaa"
+        border.width: 1
+        radius: Style.radiusS
+
+        BusyIndicator {
+          anchors.centerIn: parent
+          running: loadingFullContent
+          visible: loadingFullContent
+          width: Style.baseWidgetSize
+          height: width
+        }
+
+        Item {
+          anchors.fill: parent
+          anchors.margins: Style.marginS
+
+          NImageRounded {
+            anchors.fill: parent
+            imagePath: imageDataUrl
+            visible: isImageContent && !loadingFullContent && imageDataUrl !== ""
+            imageRadius: Style.radiusS
+            imageFillMode: Image.PreserveAspectFit
+          }
+
+          ScrollView {
+            anchors.fill: parent
+            clip: true
+            visible: !isImageContent && !loadingFullContent
+
+            TextArea {
+              text: fullContent
+              readOnly: true
+              wrapMode: Text.Wrap
+            }
+          }
+        }
+      }
+    }
+  }
+}
@@ -15,11 +15,13 @@ SmartPanel {

  readonly property bool previewActive: activePlugin && activePlugin.name === I18n.tr("plugins.clipboard") && results.length > 0

-  // Panel configuration - use proportional widths
-  readonly property real clipListRatio: 0.6  // 60% for the list
-  readonly property real clipPreviewRatio: 0.4  // 40% for the preview
-  readonly property int totalBaseWidth: Math.round(600 * Style.uiScaleRatio)  // Base width when no preview
-  readonly property int totalExpandedWidth: Math.round(900 * Style.uiScaleRatio)  // Width when preview active
+  // Panel configuration
+  readonly property int listPanelWidth: Math.round(600 * Style.uiScaleRatio)
+  readonly property int previewPanelWidth: Math.round(300 * Style.uiScaleRatio)
+  readonly property int dividerWidth: Style.borderS
+
+  readonly property int totalBaseWidth: listPanelWidth + (Style.marginL * 2)
+  readonly property int totalExpandedWidth: listPanelWidth + dividerWidth + previewPanelWidth + (Style.marginL * 2) + (Style.marginM * 2)

  preferredWidth: previewActive ? totalExpandedWidth : totalBaseWidth
  preferredHeight: Math.round(600 * Style.uiScaleRatio)
@@ -345,16 +347,14 @@ SmartPanel {

    RowLayout {
      anchors.fill: parent
-      spacing: 0
+      anchors.margins: Style.marginL // Apply overall margins here
+      spacing: Style.marginM // Apply spacing between elements here

      // --- Left Pane ---
      ColumnLayout {
        id: leftPane
        Layout.fillHeight: true
-        Layout.preferredWidth: root.previewActive ?
-          Math.round(root.clipListRatio * (root.preferredWidth - (Style.marginL * 2))) :
-          (root.preferredWidth - (Style.marginL * 2))  // Use full width when preview not active
-        anchors.margins: Style.marginL
+        Layout.preferredWidth: root.listPanelWidth
        spacing: Style.marginM

        NTextInput {
@@ -404,7 +404,6 @@ SmartPanel {
            if (currentIndex >= 0) {
              positionViewAtIndex(currentIndex, ListView.Contain);
            }
-            // Pass data to preview loader
            if (clipboardPreviewLoader.item) {
              clipboardPreviewLoader.item.currentItem = results[currentIndex] || null;
            }
@@ -656,13 +655,13 @@ SmartPanel {
        Layout.fillHeight: true
        vertical: true
        visible: root.previewActive
+        Layout.preferredWidth: root.dividerWidth
      }

      // --- Right Pane (Preview) ---
      Item {
        Layout.fillHeight: true
-        Layout.preferredWidth: root.previewActive ?
-          Math.round(root.clipPreviewRatio * (root.preferredWidth - (Style.marginL * 2))) : 0
+        Layout.preferredWidth: root.previewActive ? root.previewPanelWidth : 0
        visible: root.previewActive

        Behavior on Layout.preferredWidth {
@@ -676,12 +675,8 @@ SmartPanel {
        Loader {
          id: clipboardPreviewLoader
          anchors.fill: parent
-          anchors.leftMargin: Style.marginM
-          anchors.rightMargin: Style.marginL
-          anchors.topMargin: Style.marginL
-          anchors.bottomMargin: Style.marginL
          active: root.previewActive
-          source: active ? "../../../Widgets/ClipboardPreview.qml" : ""
+          source: active ? "./ClipboardPreview.qml" : ""

          // Access the loaded component to set the current item
          onLoaded: {