feat: add network page
This commit is contained in:
parent
1bfc451a68
commit
f109f5f2d7
3 changed files with 170 additions and 5 deletions
|
|
@ -11,6 +11,7 @@ QtObject {
|
|||
readonly property list<Component> pageComps: [
|
||||
// Appearance
|
||||
Component {
|
||||
// Wallpaper & style
|
||||
StackPage {
|
||||
Component {
|
||||
WallpaperAndStyle {}
|
||||
|
|
@ -25,6 +26,16 @@ QtObject {
|
|||
ColourSelect {}
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
// Connectivity
|
||||
Component {
|
||||
// Network
|
||||
StackPage {
|
||||
Component {
|
||||
NetworkPage {}
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
|
|||
|
|
@ -10,18 +10,25 @@ StyledSwitch {
|
|||
property string subtext
|
||||
property bool first
|
||||
property bool last
|
||||
readonly property alias bg: bg
|
||||
|
||||
implicitWidth: implicitContentWidth + implicitIndicatorWidth + Tokens.padding.largeIncreased * 2
|
||||
implicitHeight: Math.max(implicitContentHeight, implicitIndicatorHeight) + Tokens.padding.medium * 2
|
||||
horizontalPadding: Tokens.padding.largeIncreased
|
||||
verticalPadding: Tokens.padding.medium
|
||||
font: Tokens.font.body.small
|
||||
|
||||
implicitWidth: implicitContentWidth + implicitIndicatorWidth + horizontalPadding * 2
|
||||
implicitHeight: Math.max(implicitContentHeight, implicitIndicatorHeight) + verticalPadding * 2
|
||||
cLayer: 2
|
||||
|
||||
indicator.anchors.verticalCenter: verticalCenter
|
||||
indicator.anchors.right: right
|
||||
indicator.anchors.rightMargin: Tokens.padding.large
|
||||
indicator.anchors.rightMargin: root.horizontalPadding
|
||||
|
||||
onPressed: stateLayer.press(stateLayer.mouseX, stateLayer.mouseY)
|
||||
|
||||
background: StyledRect {
|
||||
id: bg
|
||||
|
||||
color: Colours.tPalette.m3surfaceContainer
|
||||
topLeftRadius: root.first ? Tokens.rounding.extraLarge : Tokens.rounding.extraSmall
|
||||
topRightRadius: root.first ? Tokens.rounding.extraLarge : Tokens.rounding.extraSmall
|
||||
|
|
@ -43,7 +50,7 @@ StyledSwitch {
|
|||
contentItem: Item {
|
||||
anchors.left: parent.left
|
||||
anchors.right: root.indicator.left
|
||||
anchors.leftMargin: Tokens.padding.large
|
||||
anchors.leftMargin: root.horizontalPadding
|
||||
anchors.rightMargin: Tokens.spacing.medium
|
||||
|
||||
implicitWidth: column.implicitWidth
|
||||
|
|
@ -58,11 +65,13 @@ StyledSwitch {
|
|||
spacing: 0
|
||||
|
||||
StyledText {
|
||||
id: label
|
||||
|
||||
anchors.left: parent.left
|
||||
anchors.right: parent.right
|
||||
|
||||
text: root.text
|
||||
font: Tokens.font.body.small
|
||||
font: root.font
|
||||
elide: Text.ElideRight
|
||||
}
|
||||
|
||||
|
|
|
|||
145
modules/nexus/pages/NetworkPage.qml
Normal file
145
modules/nexus/pages/NetworkPage.qml
Normal file
|
|
@ -0,0 +1,145 @@
|
|||
pragma ComponentBehavior: Bound
|
||||
|
||||
import QtQuick
|
||||
import QtQuick.Layouts
|
||||
import Caelestia.Components
|
||||
import Caelestia.Config
|
||||
import qs.components
|
||||
import qs.components.controls
|
||||
import qs.services
|
||||
import qs.utils
|
||||
import qs.modules.nexus.common
|
||||
|
||||
PageBase {
|
||||
id: root
|
||||
|
||||
title: qsTr("Network")
|
||||
|
||||
ColumnLayout {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
anchors.top: parent.top
|
||||
width: root.cappedWidth
|
||||
spacing: Tokens.spacing.extraSmall / 2
|
||||
|
||||
ToggleRow {
|
||||
Layout.fillWidth: true
|
||||
first: true
|
||||
text: qsTr("Wi-Fi")
|
||||
font: Tokens.font.title.medium
|
||||
checked: Network.wifiEnabled
|
||||
onToggled: Network.enableWifi(checked)
|
||||
|
||||
horizontalPadding: Tokens.padding.largeIncreased
|
||||
verticalPadding: Tokens.padding.medium
|
||||
}
|
||||
|
||||
StyledRect {
|
||||
Layout.fillWidth: true
|
||||
implicitHeight: networkList.implicitHeight + networkList.anchors.margins * 2
|
||||
radius: Tokens.rounding.extraSmall
|
||||
color: Colours.tPalette.m3surfaceContainer
|
||||
|
||||
ColumnLayout {
|
||||
id: networkList
|
||||
|
||||
anchors.fill: parent
|
||||
spacing: 0
|
||||
|
||||
Repeater {
|
||||
model: Network.networks
|
||||
|
||||
StateLayer {
|
||||
id: network
|
||||
|
||||
required property Network.AccessPoint modelData
|
||||
|
||||
Layout.fillWidth: true
|
||||
implicitHeight: networkLayout.implicitHeight + networkLayout.anchors.margins * 2
|
||||
radius: Tokens.rounding.extraSmall
|
||||
anchors.fill: undefined
|
||||
|
||||
RowLayout {
|
||||
id: networkLayout
|
||||
|
||||
anchors.fill: parent
|
||||
anchors.margins: Tokens.padding.medium
|
||||
anchors.leftMargin: Tokens.padding.largeIncreased
|
||||
anchors.rightMargin: Tokens.padding.largeIncreased
|
||||
spacing: Tokens.spacing.medium
|
||||
|
||||
MaterialIcon {
|
||||
text: Icons.getNetworkIcon(network.modelData.strength)
|
||||
color: network.modelData.active ? Colours.palette.m3primary : Colours.tPalette.m3onSurfaceVariant
|
||||
font: Tokens.font.icon.medium
|
||||
}
|
||||
|
||||
ColumnLayout {
|
||||
Layout.fillWidth: true
|
||||
spacing: 0
|
||||
|
||||
StyledText {
|
||||
Layout.fillWidth: true
|
||||
text: network.modelData.ssid
|
||||
font: Tokens.font.body.small
|
||||
elide: Text.ElideRight
|
||||
}
|
||||
|
||||
StyledText {
|
||||
Layout.fillWidth: true
|
||||
text: qsTr("Security: %1").arg(network.modelData.security)
|
||||
color: Colours.tPalette.m3outline
|
||||
font: Tokens.font.label.small
|
||||
elide: Text.ElideRight
|
||||
}
|
||||
}
|
||||
|
||||
MaterialIcon {
|
||||
visible: network.modelData.isSecure
|
||||
text: network.modelData.active ? "settings" : "lock"
|
||||
color: network.modelData.active ? Colours.palette.m3primary : Colours.tPalette.m3onSurfaceVariant
|
||||
font: Tokens.font.icon.medium
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
StyledRect {
|
||||
Layout.fillWidth: true
|
||||
bottomLeftRadius: Tokens.rounding.extraLarge
|
||||
bottomRightRadius: Tokens.rounding.extraLarge
|
||||
radius: Tokens.rounding.extraSmall
|
||||
|
||||
implicitHeight: addNetworkLayout.implicitHeight + addNetworkLayout.anchors.margins * 2
|
||||
color: Colours.tPalette.m3surfaceContainer
|
||||
|
||||
StateLayer {}
|
||||
|
||||
RowLayout {
|
||||
id: addNetworkLayout
|
||||
|
||||
anchors.fill: parent
|
||||
anchors.margins: Tokens.padding.medium
|
||||
anchors.leftMargin: Tokens.padding.largeIncreased
|
||||
anchors.rightMargin: Tokens.padding.largeIncreased
|
||||
|
||||
spacing: Tokens.spacing.medium
|
||||
|
||||
MaterialIcon {
|
||||
text: "add"
|
||||
color: Colours.tPalette.m3onSurfaceVariant
|
||||
font: Tokens.font.icon.medium
|
||||
}
|
||||
|
||||
StyledText {
|
||||
Layout.fillWidth: true
|
||||
text: qsTr("Add network")
|
||||
color: Colours.tPalette.m3onSurfaceVariant
|
||||
font: Tokens.font.body.small
|
||||
elide: Text.ElideRight
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
Loading…
Add table
Reference in a new issue