fix: control center

images/dark/screenshot.svg

@@ -0,0 +1,9 @@
+<svg version="1.1" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+ <defs>
+  <style id="current-color-scheme" type="text/css">.ColorScheme-Text {
+        color:#363636;
+      }</style>
+ </defs>
+ <path d="m8 4.1111a3.8889 3.8889 0 0 0-3.8889 3.8889 3.8889 3.8889 0 0 0 3.8889 3.8889 3.8889 3.8889 0 0 0 3.8889-3.8889 3.8889 3.8889 0 0 0-3.8889-3.8889zm-0.030382 2.5925a1.2963 1.2963 0 0 1 0.030382 0 1.2963 1.2963 0 0 1 1.2963 1.2963 1.2963 1.2963 0 0 1-1.2963 1.2963 1.2963 1.2963 0 0 1-1.2963-1.2963 1.2963 1.2963 0 0 1 1.2659-1.2963z" fill="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2.5925"/>
+ <path d="m3 1.0001c-1.108 0-2 0.892-2 2v2h0.99999v-2c0-0.554 0.44599-0.99999 0.99999-0.99999h2v-0.99999zm7.9999 0v0.99999h2c0.554 0 0.99999 0.44599 0.99999 0.99999v2h1v-2c0-1.108-0.892-2-2-2zm-9.9999 9.9999v2c0 1.108 0.892 2 2 2h2v-0.99999h-2c-0.554 0-0.99999-0.44599-0.99999-0.99999v-2zm13 0v2c0 0.554-0.44599 0.99999-0.99999 0.99999h-2v0.99999h2c1.108 0 2-0.892 2-2v-2z" fill="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width=".99999"/>
+</svg>

images/light/screenshot.svg

@@ -0,0 +1,9 @@
+<svg version="1.1" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+ <defs>
+  <style id="current-color-scheme" type="text/css">.ColorScheme-Text {
+        color:#363636;
+      }</style>
+ </defs>
+ <path d="m8 4.1111a3.8889 3.8889 0 0 0-3.8889 3.8889 3.8889 3.8889 0 0 0 3.8889 3.8889 3.8889 3.8889 0 0 0 3.8889-3.8889 3.8889 3.8889 0 0 0-3.8889-3.8889zm-0.030382 2.5925a1.2963 1.2963 0 0 1 0.030382 0 1.2963 1.2963 0 0 1 1.2963 1.2963 1.2963 1.2963 0 0 1-1.2963 1.2963 1.2963 1.2963 0 0 1-1.2963-1.2963 1.2963 1.2963 0 0 1 1.2659-1.2963z" fill="#363636" stroke-linecap="round" stroke-linejoin="round" stroke-width="2.5925"/>
+ <path d="m3 1.0001c-1.108 0-2 0.892-2 2v2h0.99999v-2c0-0.554 0.44599-0.99999 0.99999-0.99999h2v-0.99999zm7.9999 0v0.99999h2c0.554 0 0.99999 0.44599 0.99999 0.99999v2h1v-2c0-1.108-0.892-2-2-2zm-9.9999 9.9999v2c0 1.108 0.892 2 2 2h2v-0.99999h-2c-0.554 0-0.99999-0.44599-0.99999-0.99999v-2zm13 0v2c0 0.554-0.44599 0.99999-0.99999 0.99999h-2v0.99999h2c1.108 0 2-0.892 2-2v-2z" fill="#363636" stroke-linecap="round" stroke-linejoin="round" stroke-width=".99999"/>
+</svg>

qml.qrc

@@ -123,5 +123,7 @@
         <file>images/dark/system-shutdown.svg</file>
         <file>images/dark/system-suspend.svg</file>
         <file>qml/StandardCard.qml</file>
+        <file>images/light/screenshot.svg</file>
+        <file>images/dark/screenshot.svg</file>
     </qresource>
 </RCC>

qml/CardItem.qml

@@ -52,6 +52,10 @@ Item {
         acceptedButtons: Qt.LeftButton
         onClicked: control.clicked()
 
+        onPressedChanged: {
+            imageItem.scale = pressed ? 0.95 : 1.0
+        }
+
         onPressAndHold: {
             control.pressAndHold()
         }
@@ -68,11 +72,19 @@ Item {
         }
 
         Item {
+            id: imageItem
             Layout.preferredWidth: 28 + FishUI.Units.largeSpacing * 2
             Layout.preferredHeight: 28 + FishUI.Units.largeSpacing * 2
 
             Layout.alignment: Qt.AlignHCenter
 
+            Behavior on scale {
+                NumberAnimation {
+                    duration: 200
+                    easing.type: Easing.OutSine
+                }
+            }
+
             Rectangle {
                 anchors.fill: parent
                 radius: height / 2
@@ -114,6 +126,9 @@ Item {
 //            color: control.checked ? FishUI.Theme.highlightedTextColor : FishUI.Theme.textColor
             Layout.preferredHeight: control.height * 0.15
             Layout.alignment: Qt.AlignHCenter
+            horizontalAlignment: Qt.AlignHCenter
+            Layout.fillWidth: true
+            elide: Text.ElideMiddle
             visible: text
         }
 

qml/ControlCenter.qml

@@ -201,21 +201,33 @@ ControlCenterDialog {
         Item {
             id: cardItems
             Layout.fillWidth: true
-            height: 110
+            Layout.preferredHeight: Math.ceil(cardLayout.count / 4) * 110
 
-            property var cellWidth: cardItems.width / 3
+            property var cellWidth: cardItems.width / 4
 
             Rectangle {
                 anchors.fill: parent
                 color: FishUI.Theme.darkMode ? "#AEAEAE" : "white"
                 radius: FishUI.Theme.bigRadius
-                opacity: 0.8
+                opacity: 0.7
             }
 
             GridLayout {
+                id: cardLayout
                 anchors.fill: parent
                 columnSpacing: 0
-                columns: 3
+                columns: 4
+
+                property int count: {
+                    var count = 0
+
+                    for (var i in cardLayout.children) {
+                        if (cardLayout.children[i].visible)
+                            ++count
+                    }
+
+                    return count
+                }
 
                 CardItem {
                     id: wirelessItem
@@ -259,6 +271,19 @@ ControlCenterDialog {
                     label: qsTr("Dark Mode")
                     onClicked: appearance.switchDarkMode(!FishUI.Theme.darkMode)
                 }
+
+                CardItem {
+                    Layout.fillHeight: true
+                    Layout.preferredWidth: cardItems.cellWidth
+                    icon: FishUI.Theme.darkMode || checked ? "qrc:/images/dark/screenshot.svg"
+                                                           : "qrc:/images/light/screenshot.svg"
+                    checked: false
+                    label: qsTr("Screenshot")
+                    onClicked: {
+                        control.visible = false
+                        process.startDetached("cutefish-screenshot", ["-d", "500"])
+                    }
+                }
             }
         }
 
@@ -390,6 +415,8 @@ ControlCenterDialog {
         }
 
         RowLayout {
+            Layout.leftMargin: FishUI.Units.smallSpacing
+            Layout.rightMargin: FishUI.Units.smallSpacing
             spacing: 0
 
             Label {

translations/en_US.ts

@@ -12,25 +12,30 @@
 <context>
     <name>ControlCenter</name>
     <message>
-        <location filename="../qml/ControlCenter.qml" line="222"/>
+        <location filename="../qml/ControlCenter.qml" line="240"/>
         <source>Wi-Fi</source>
         <translation type="unfinished"></translation>
     </message>
     <message>
-        <location filename="../qml/ControlCenter.qml" line="167"/>
+        <location filename="../qml/ControlCenter.qml" line="169"/>
         <source>Control Center</source>
         <translation type="unfinished"></translation>
     </message>
     <message>
-        <location filename="../qml/ControlCenter.qml" line="237"/>
+        <location filename="../qml/ControlCenter.qml" line="255"/>
         <source>Bluetooth</source>
         <translation type="unfinished"></translation>
     </message>
     <message>
-        <location filename="../qml/ControlCenter.qml" line="253"/>
+        <location filename="../qml/ControlCenter.qml" line="271"/>
         <source>Dark Mode</source>
         <translation type="unfinished"></translation>
     </message>
+    <message>
+        <location filename="../qml/ControlCenter.qml" line="281"/>
+        <source>Screenshot</source>
+        <translation type="unfinished"></translation>
+    </message>
 </context>
 <context>
     <name>ShutdownDialog</name>

translations/zh_CN.ts

@@ -12,25 +12,30 @@
 <context>
     <name>ControlCenter</name>
     <message>
-        <location filename="../qml/ControlCenter.qml" line="222"/>
+        <location filename="../qml/ControlCenter.qml" line="240"/>
         <source>Wi-Fi</source>
         <translation>无线网络</translation>
     </message>
     <message>
-        <location filename="../qml/ControlCenter.qml" line="167"/>
+        <location filename="../qml/ControlCenter.qml" line="169"/>
         <source>Control Center</source>
         <translation>控制中心</translation>
     </message>
     <message>
-        <location filename="../qml/ControlCenter.qml" line="237"/>
+        <location filename="../qml/ControlCenter.qml" line="255"/>
         <source>Bluetooth</source>
         <translation>蓝牙</translation>
     </message>
     <message>
-        <location filename="../qml/ControlCenter.qml" line="253"/>
+        <location filename="../qml/ControlCenter.qml" line="271"/>
         <source>Dark Mode</source>
         <translation>深色模式</translation>
     </message>
+    <message>
+        <location filename="../qml/ControlCenter.qml" line="281"/>
+        <source>Screenshot</source>
+        <translation>截图</translation>
+    </message>
 </context>
 <context>
     <name>ShutdownDialog</name>