aiden
/
statusbar
mirror of https://github.com/cutefishos/statusbar
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

feat: new control center design

Browse Source
pull/18/head
kate 4 years ago
parent 8f1460ebe4
commit 54c45efe9b
6 changed files with 224 additions and 241 deletions
Show Stats Download Patch File Download Diff File

105
qml/CardItem.qml
Unescape Escape View File

@ -29,7 +29,6 @@ Item {
property bool checked: false
property alias icon: _image.source
property alias label: _titleLabel.text
property alias text: _label.text
signal clicked
signal pressAndHold
@ -53,93 +52,71 @@ Item {
acceptedButtons: Qt.LeftButton
onClicked: control.clicked()
onPressedChanged: {
control.scale = pressed ? 0.95 : 1.0
}
onPressAndHold: {
control.pressAndHold()
}
}
Behavior on scale {
NumberAnimation {
duration: 200
easing.type: Easing.OutSine
}
}
Rectangle {
anchors.fill: parent
radius: FishUI.Theme.bigRadius
opacity: 1
color: {
if (control.checked) {
if (_mouseArea.pressed)
return highlightPressedColor
else if (_mouseArea.containsMouse)
return highlightHoverColor
else
return FishUI.Theme.highlightColor
} else {
if (_mouseArea.pressed)
return pressedColor
else if (_mouseArea.containsMouse)
return hoverColor
else
return backgroundColor
}
}
}
ColumnLayout {
anchors.fill: parent
anchors.leftMargin: FishUI.Theme.smallRadius
anchors.rightMargin: FishUI.Theme.smallRadius
spacing: FishUI.Units.smallSpacing
spacing: FishUI.Units.largeSpacing
Item {
Layout.fillHeight: true
}
Image {
id: _image
Layout.preferredWidth: 28
Layout.preferredHeight: 28
sourceSize: Qt.size(28, 28)
asynchronous: true
Item {
Layout.preferredWidth: 28 + FishUI.Units.largeSpacing * 2
Layout.preferredHeight: 28 + FishUI.Units.largeSpacing * 2
Layout.alignment: Qt.AlignHCenter
Layout.topMargin: FishUI.Units.largeSpacing
antialiasing: true
smooth: true
// ColorOverlay {
// anchors.fill: _image
// source: _image
// color: control.checked ? FishUI.Theme.highlightedTextColor : FishUI.Theme.disabledTextColor
// }
Rectangle {
anchors.fill: parent
radius: height / 2
// color: "#E5E5E5"
color: {
if (control.checked) {
if (_mouseArea.pressed)
return highlightPressedColor
else if (_mouseArea.containsMouse)
return highlightHoverColor
else
return FishUI.Theme.highlightColor
} else {
if (_mouseArea.pressed)
return pressedColor
else if (_mouseArea.containsMouse)
return hoverColor
else
return backgroundColor
}
}
}
Image {
id: _image
Layout.preferredWidth: 28
Layout.preferredHeight: 28
anchors.centerIn: parent
sourceSize: Qt.size(28, 28)
asynchronous: true
antialiasing: true
smooth: true
}
}
Label {
id: _titleLabel
color: control.checked ? FishUI.Theme.highlightedTextColor : FishUI.Theme.textColor
// color: control.checked ? FishUI.Theme.highlightedTextColor : FishUI.Theme.textColor
Layout.preferredHeight: control.height * 0.15
Layout.alignment: Qt.AlignHCenter
visible: text
}
Label {
id: _label
color: control.checked ? FishUI.Theme.highlightedTextColor : FishUI.Theme.textColor
elide: Label.ElideRight
Layout.preferredHeight: control.height * 0.1
Layout.alignment: Qt.AlignHCenter
Layout.maximumWidth: control.width - FishUI.Units.largeSpacing
Layout.bottomMargin: FishUI.Units.largeSpacing
visible: text
}
Item {
Layout.fillHeight: true
}

113
qml/ControlCenter.qml
Unescape Escape View File

@ -32,8 +32,8 @@ import FishUI 1.0 as FishUI
ControlCenterDialog {
id: control
width: 420
height: _mainLayout.implicitHeight + FishUI.Units.largeSpacing * 2.5
width: 450
height: _mainLayout.implicitHeight + FishUI.Units.largeSpacing * 2
property var margin: 4 * Screen.devicePixelRatio
property point position: Qt.point(0, 0)
@ -132,8 +132,8 @@ ControlCenterDialog {
id: _background
anchors.fill: parent
radius: windowHelper.compositing ? FishUI.Theme.bigRadius * 1.5 : 0
color: FishUI.Theme.darkMode ? "#4D4D4D" : "#FFFFFF"
opacity: windowHelper.compositing ? FishUI.Theme.darkMode ? 0.5 : 0.7 : 1.0
color: FishUI.Theme.darkMode ? "#4D4D4D" : "#F0F0F0"
opacity: windowHelper.compositing ? FishUI.Theme.darkMode ? 0.6 : 0.8 : 1.0
antialiasing: true
border.width: 1 / Screen.devicePixelRatio
border.pixelAligned: Screen.devicePixelRatio > 1 ? false : true
@ -150,54 +150,26 @@ ControlCenterDialog {
ColumnLayout {
id: _mainLayout
anchors.fill: parent
anchors.leftMargin: FishUI.Units.largeSpacing * 1.5
anchors.rightMargin: FishUI.Units.largeSpacing * 1.5
anchors.topMargin: FishUI.Units.largeSpacing * 1.5
anchors.bottomMargin: FishUI.Units.largeSpacing
anchors.margins: FishUI.Units.largeSpacing
spacing: FishUI.Units.largeSpacing
Item {
id: topItem
Layout.fillWidth: true
height: 36
height: 32
RowLayout {
id: topItemLayout
anchors.fill: parent
anchors.rightMargin: FishUI.Units.largeSpacing
spacing: FishUI.Units.largeSpacing
Image {
id: userIcon
property int iconSize: 36
Layout.preferredHeight: iconSize
Layout.preferredWidth: iconSize
sourceSize: String(source) === "image://icontheme/default-user" ? Qt.size(iconSize, iconSize) : undefined
source: currentUser.iconFileName ? "file:///" + currentUser.iconFileName : "image://icontheme/default-user"
antialiasing: true
smooth: false
layer.enabled: true
layer.effect: OpacityMask {
maskSource: Item {
width: userIcon.width
height: userIcon.height
Rectangle {
anchors.fill: parent
radius: parent.height / 2
}
}
}
}
Label {
id: userLabel
text: currentUser.userName
Layout.fillHeight: true
leftPadding: FishUI.Units.largeSpacing
text: qsTr("Control Center")
font.bold: true
font.pointSize: 14
Layout.fillWidth: true
elide: Label.ElideRight
}
IconButton {
@ -229,12 +201,17 @@ ControlCenterDialog {
Item {
id: cardItems
Layout.fillWidth: true
height: 100
visible: wirelessItem.visible || bluetoothItem.visible
height: 110
RowLayout {
Rectangle {
anchors.fill: parent
color: FishUI.Theme.darkMode ? "#AEAEAE" : "white"
radius: FishUI.Theme.bigRadius
opacity: 0.8
}
GridLayout {
anchors.fill: parent
spacing: FishUI.Units.largeSpacing
CardItem {
id: wirelessItem
@ -244,10 +221,7 @@ ControlCenterDialog {
: "qrc:/images/light/network-wireless-connected-100.svg"
visible: enabledConnections.wirelessHwEnabled
checked: enabledConnections.wirelessEnabled
label: qsTr("Wi-Fi")
text: enabledConnections.wirelessEnabled ? activeConnection.wirelessName ?
activeConnection.wirelessName :
qsTr("On") : qsTr("Off")
label: activeConnection.wirelessName ? activeConnection.wirelessName : qsTr("Wi-Fi")
onClicked: nmHandler.enableWireless(!checked)
onPressAndHold: {
control.visible = false
@ -263,7 +237,6 @@ ControlCenterDialog {
: "qrc:/images/light/bluetooth-symbolic.svg"
checked: !control.bluetoothDisConnected
label: qsTr("Bluetooth")
text: checked ? qsTr("On") : qsTr("Off")
visible: Bluez.Manager.adapters.length
onClicked: control.toggleBluetooth()
onPressAndHold: {
@ -280,13 +253,8 @@ ControlCenterDialog {
: "qrc:/images/light/dark-mode.svg"
checked: FishUI.Theme.darkMode
label: qsTr("Dark Mode")
text: FishUI.Theme.darkMode ? qsTr("On") : qsTr("Off")
onClicked: appearance.switchDarkMode(!FishUI.Theme.darkMode)
}
Item {
Layout.fillWidth: true
}
}
}
@ -304,9 +272,9 @@ ControlCenterDialog {
Rectangle {
id: brightnessItemBg
anchors.fill: parent
color: FishUI.Theme.darkMode ? "#AEAEAE" : "white"
radius: FishUI.Theme.bigRadius
color: FishUI.Theme.darkMode ? Qt.rgba(255, 255, 255, 0.1)
: Qt.rgba(0, 0, 0, 0.05)
opacity: 0.8
}
RowLayout {
@ -344,11 +312,11 @@ ControlCenterDialog {
onMoved: brightnessTimer.start()
}
Label {
text: brightnessSlider.value + "%"
color: FishUI.Theme.disabledTextColor
Layout.preferredWidth: _fontMetrics.advanceWidth("100%")
}
// Label {
// text: brightnessSlider.value + "%"
// color: FishUI.Theme.disabledTextColor
// Layout.preferredWidth: _fontMetrics.advanceWidth("100%")
// }
}
}
@ -361,9 +329,9 @@ ControlCenterDialog {
Rectangle {
id: volumeItemBg
anchors.fill: parent
color: FishUI.Theme.darkMode ? "#AEAEAE" : "white"
radius: FishUI.Theme.bigRadius
color: FishUI.Theme.darkMode ? Qt.rgba(255, 255, 255, 0.1)
: Qt.rgba(0, 0, 0, 0.05)
opacity: 0.8
}
RowLayout {
@ -405,11 +373,11 @@ ControlCenterDialog {
}
}
Label {
text: parseInt(volumeSlider.value / PulseAudio.NormalVolume * 100.0) + "%"
Layout.preferredWidth: _fontMetrics.advanceWidth("100%")
color: FishUI.Theme.disabledTextColor
}
// Label {
// text: parseInt(volumeSlider.value / PulseAudio.NormalVolume * 100.0) + "%"
// Layout.preferredWidth: _fontMetrics.advanceWidth("100%")
// color: FishUI.Theme.disabledTextColor
// }
}
}
@ -477,4 +445,15 @@ ControlCenterDialog {
}
}
}
function calcExtraSpacing(cellSize, containerSize) {
var availableColumns = Math.floor(containerSize / cellSize)
var extraSpacing = 0
if (availableColumns > 0) {
var allColumnSize = availableColumns * cellSize
var extraSpace = Math.max(containerSize - allColumnSize, 0)
extraSpacing = extraSpace / availableColumns
}
return Math.floor(extraSpacing)
}
}

5
qml/MprisItem.qml
Unescape Escape View File

@ -60,10 +60,9 @@ Item {
Rectangle {
anchors.fill: parent
color: FishUI.Theme.darkMode ? "#AEAEAE" : "white"
radius: FishUI.Theme.bigRadius
color: FishUI.Theme.darkMode ? Qt.rgba(255, 255, 255, 0.4)
: Qt.rgba(0, 0, 0, 0.1)
opacity: FishUI.Theme.darkMode ? 0.3 : 0.5
opacity: 0.8
}
RowLayout {

182
qml/ShutdownDialog.qml
Unescape Escape View File

@ -45,6 +45,10 @@ ControlCenterDialog {
: Qt.rgba(0, 0, 0, 0.2) : FishUI.Theme.darkMode ? Qt.rgba(255, 255, 255, 0.15)
: Qt.rgba(0, 0, 0, 0.15)
Accounts.UserAccount {
id: currentUser
}
FishUI.WindowBlur {
view: control
geometry: Qt.rect(control.x, control.y, control.width, control.height)
@ -77,86 +81,128 @@ ControlCenterDialog {
}
}
GridLayout {
ColumnLayout {
id: _mainLayout
anchors.fill: parent
anchors.margins: FishUI.Units.largeSpacing * 1.5
rowSpacing: FishUI.Units.largeSpacing
columnSpacing: FishUI.Units.largeSpacing
columns: 3
StandardCard {
Layout.preferredWidth: 96
Layout.preferredHeight: 96
icon: FishUI.Theme.darkMode ? "qrc:/images/dark/system-shutdown.svg"
: "qrc:/images/light/system-shutdown.svg"
visible: true
checked: false
text: qsTr("Shutdown")
onClicked: {
control.visible = false
actions.shutdown()
spacing: FishUI.Units.largeSpacing
RowLayout {
spacing: FishUI.Units.smallSpacing * 1.5
Image {
id: userIcon
property int iconSize: 33
Layout.preferredHeight: iconSize
Layout.preferredWidth: iconSize
sourceSize: String(source) === "image://icontheme/default-user" ? Qt.size(iconSize, iconSize) : undefined
source: currentUser.iconFileName ? "file:///" + currentUser.iconFileName : "image://icontheme/default-user"
antialiasing: true
smooth: false
layer.enabled: true
layer.effect: OpacityMask {
maskSource: Item {
width: userIcon.width
height: userIcon.height
Rectangle {
anchors.fill: parent
radius: parent.height / 2
}
}
}
}
}
StandardCard {
Layout.preferredWidth: 96
Layout.preferredHeight: 96
icon: FishUI.Theme.darkMode ? "qrc:/images/dark/system-reboot.svg"
: "qrc:/images/light/system-reboot.svg"
visible: true
checked: false
text: qsTr("Reboot")
onClicked: {
control.visible = false
actions.reboot()
Label {
id: userLabel
text: currentUser.userName
Layout.fillHeight: true
Layout.fillWidth: true
elide: Label.ElideRight
}
}
StandardCard {
Layout.preferredWidth: 96
Layout.preferredHeight: 96
icon: FishUI.Theme.darkMode ? "qrc:/images/dark/system-log-out.svg"
: "qrc:/images/light/system-log-out.svg"
visible: true
checked: false
text: qsTr("Log out")
onClicked: {
control.visible = false
actions.logout()
GridLayout {
rowSpacing: FishUI.Units.largeSpacing
columnSpacing: FishUI.Units.largeSpacing
columns: 3
StandardCard {
Layout.preferredWidth: 96
Layout.preferredHeight: 96
icon: FishUI.Theme.darkMode ? "qrc:/images/dark/system-shutdown.svg"
: "qrc:/images/light/system-shutdown.svg"
visible: true
checked: false
text: qsTr("Shutdown")
onClicked: {
control.visible = false
actions.shutdown()
}
}
}
StandardCard {
Layout.preferredWidth: 96
Layout.preferredHeight: 96
icon: FishUI.Theme.darkMode ? "qrc:/images/dark/system-lock-screen.svg"
: "qrc:/images/light/system-lock-screen.svg"
visible: true
checked: false
text: qsTr("Lock Screen")
onClicked: {
control.visible = false
actions.lockScreen()
StandardCard {
Layout.preferredWidth: 96
Layout.preferredHeight: 96
icon: FishUI.Theme.darkMode ? "qrc:/images/dark/system-reboot.svg"
: "qrc:/images/light/system-reboot.svg"
visible: true
checked: false
text: qsTr("Reboot")
onClicked: {
control.visible = false
actions.reboot()
}
}
StandardCard {
Layout.preferredWidth: 96
Layout.preferredHeight: 96
icon: FishUI.Theme.darkMode ? "qrc:/images/dark/system-log-out.svg"
: "qrc:/images/light/system-log-out.svg"
visible: true
checked: false
text: qsTr("Log out")
onClicked: {
control.visible = false
actions.logout()
}
}
StandardCard {
Layout.preferredWidth: 96
Layout.preferredHeight: 96
icon: FishUI.Theme.darkMode ? "qrc:/images/dark/system-lock-screen.svg"
: "qrc:/images/light/system-lock-screen.svg"
visible: true
checked: false
text: qsTr("Lock Screen")
onClicked: {
control.visible = false
actions.lockScreen()
}
}
}
StandardCard {
Layout.preferredWidth: 96
Layout.preferredHeight: 96
icon: FishUI.Theme.darkMode ? "qrc:/images/dark/system-suspend.svg"
: "qrc:/images/light/system-suspend.svg"
visible: true
checked: false
text: qsTr("Suspend")
onClicked: {
control.visible = false
actions.suspend()
StandardCard {
Layout.preferredWidth: 96
Layout.preferredHeight: 96
icon: FishUI.Theme.darkMode ? "qrc:/images/dark/system-suspend.svg"
: "qrc:/images/light/system-suspend.svg"
visible: true
checked: false
text: qsTr("Suspend")
onClicked: {
control.visible = false
actions.suspend()
}
}
}
}

29
translations/en_US.ts
Unescape Escape View File

@ -12,31 +12,22 @@
<context>
<name>ControlCenter</name>
<message>
<location filename="../qml/ControlCenter.qml" line="247"/>
<location filename="../qml/ControlCenter.qml" line="222"/>
<source>Wi-Fi</source>
<translation type="unfinished"></translation>
</message>
<message>
<location filename="../qml/ControlCenter.qml" line="250"/>
<location filename="../qml/ControlCenter.qml" line="266"/>
<location filename="../qml/ControlCenter.qml" line="283"/>
<source>On</source>
<location filename="../qml/ControlCenter.qml" line="167"/>
<source>Control Center</source>
<translation type="unfinished"></translation>
</message>
<message>
<location filename="../qml/ControlCenter.qml" line="250"/>
<location filename="../qml/ControlCenter.qml" line="266"/>
<location filename="../qml/ControlCenter.qml" line="283"/>
<source>Off</source>
<translation type="unfinished"></translation>
</message>
<message>
<location filename="../qml/ControlCenter.qml" line="265"/>
<location filename="../qml/ControlCenter.qml" line="237"/>
<source>Bluetooth</source>
<translation type="unfinished"></translation>
</message>
<message>
<location filename="../qml/ControlCenter.qml" line="282"/>
<location filename="../qml/ControlCenter.qml" line="253"/>
<source>Dark Mode</source>
<translation type="unfinished"></translation>
</message>
@ -44,27 +35,27 @@
<context>
<name>ShutdownDialog</name>
<message>
<location filename="../qml/ShutdownDialog.qml" line="95"/>
<location filename="../qml/ShutdownDialog.qml" line="140"/>
<source>Shutdown</source>
<translation type="unfinished"></translation>
</message>
<message>
<location filename="../qml/ShutdownDialog.qml" line="110"/>
<location filename="../qml/ShutdownDialog.qml" line="155"/>
<source>Reboot</source>
<translation type="unfinished"></translation>
</message>
<message>
<location filename="../qml/ShutdownDialog.qml" line="125"/>
<location filename="../qml/ShutdownDialog.qml" line="170"/>
<source>Log out</source>
<translation type="unfinished"></translation>
</message>
<message>
<location filename="../qml/ShutdownDialog.qml" line="140"/>
<location filename="../qml/ShutdownDialog.qml" line="185"/>
<source>Lock Screen</source>
<translation type="unfinished"></translation>
</message>
<message>
<location filename="../qml/ShutdownDialog.qml" line="155"/>
<location filename="../qml/ShutdownDialog.qml" line="200"/>
<source>Suspend</source>
<translation type="unfinished"></translation>
</message>

31
translations/zh_CN.ts
Unescape Escape View File

@ -12,31 +12,22 @@
<context>
<name>ControlCenter</name>
<message>
<location filename="../qml/ControlCenter.qml" line="247"/>
<location filename="../qml/ControlCenter.qml" line="222"/>
<source>Wi-Fi</source>
<translation>无线网络</translation>
</message>
<message>
<location filename="../qml/ControlCenter.qml" line="250"/>
<location filename="../qml/ControlCenter.qml" line="266"/>
<location filename="../qml/ControlCenter.qml" line="283"/>
<source>On</source>
<translation>打开</translation>
<location filename="../qml/ControlCenter.qml" line="167"/>
<source>Control Center</source>
<translation>控制中心</translation>
</message>
<message>
<location filename="../qml/ControlCenter.qml" line="250"/>
<location filename="../qml/ControlCenter.qml" line="266"/>
<location filename="../qml/ControlCenter.qml" line="283"/>
<source>Off</source>
<translation>关闭</translation>
</message>
<message>
<location filename="../qml/ControlCenter.qml" line="265"/>
<location filename="../qml/ControlCenter.qml" line="237"/>
<source>Bluetooth</source>
<translation>蓝牙</translation>
</message>
<message>
<location filename="../qml/ControlCenter.qml" line="282"/>
<location filename="../qml/ControlCenter.qml" line="253"/>
<source>Dark Mode</source>
<translation>深色模式</translation>
</message>
@ -44,27 +35,27 @@
<context>
<name>ShutdownDialog</name>
<message>
<location filename="../qml/ShutdownDialog.qml" line="95"/>
<location filename="../qml/ShutdownDialog.qml" line="140"/>
<source>Shutdown</source>
<translation>关机</translation>
</message>
<message>
<location filename="../qml/ShutdownDialog.qml" line="110"/>
<location filename="../qml/ShutdownDialog.qml" line="155"/>
<source>Reboot</source>
<translation>重启</translation>
</message>
<message>
<location filename="../qml/ShutdownDialog.qml" line="125"/>
<location filename="../qml/ShutdownDialog.qml" line="170"/>
<source>Log out</source>
<translation>注销</translation>
</message>
<message>
<location filename="../qml/ShutdownDialog.qml" line="140"/>
<location filename="../qml/ShutdownDialog.qml" line="185"/>
<source>Lock Screen</source>
<translation>锁屏</translation>
</message>
<message>
<location filename="../qml/ShutdownDialog.qml" line="155"/>
<location filename="../qml/ShutdownDialog.qml" line="200"/>
<source>Suspend</source>
<translation>休眠</translation>
</message>

Write Preview
Loading…
Cancel
Save