WifiPanel: Improved look and functionalities
This commit is contained in:
parent
54c39ab8a3
commit
5f00266df7
2 changed files with 62 additions and 34 deletions
|
|
@ -13,6 +13,7 @@ Singleton {
|
|||
*/
|
||||
|
||||
// Font size
|
||||
property real fontSizeXXS: 8
|
||||
property real fontSizeXS: 9
|
||||
property real fontSizeS: 10
|
||||
property real fontSizeM: 11
|
||||
|
|
|
|||
|
|
@ -46,6 +46,7 @@ NPanel {
|
|||
font.weight: Style.fontWeightBold
|
||||
color: Color.mOnSurface
|
||||
Layout.fillWidth: true
|
||||
Layout.leftMargin: Style.marginS * scaling
|
||||
}
|
||||
|
||||
NIconButton {
|
||||
|
|
@ -72,6 +73,16 @@ NPanel {
|
|||
Layout.fillWidth: true
|
||||
}
|
||||
|
||||
// Show errors at the very top
|
||||
NText {
|
||||
visible: NetworkService.connectStatus === "error" && NetworkService.connectError.length > 0
|
||||
text: NetworkService.connectError
|
||||
color: Color.mError
|
||||
font.pointSize: Style.fontSizeXS * scaling
|
||||
wrapMode: Text.Wrap
|
||||
Layout.fillWidth: true
|
||||
}
|
||||
|
||||
Item {
|
||||
Layout.fillWidth: true
|
||||
Layout.fillHeight: true
|
||||
|
|
@ -127,69 +138,65 @@ NPanel {
|
|||
|
||||
// Network list
|
||||
ListView {
|
||||
id: networkList
|
||||
anchors.fill: parent
|
||||
visible: Settings.data.network.wifiEnabled && !NetworkService.isLoading
|
||||
model: Object.values(NetworkService.networks)
|
||||
spacing: Style.marginM * scaling
|
||||
spacing: Style.marginS * scaling
|
||||
clip: true
|
||||
|
||||
delegate: Item {
|
||||
width: parent ? parent.width : 0
|
||||
height: modelData.ssid === passwordPromptSsid
|
||||
&& showPasswordPrompt ? 108 * scaling : Style.baseWidgetSize * 1.5 * scaling
|
||||
&& showPasswordPrompt ? 130 * scaling : Style.baseWidgetSize * 1.75 * scaling
|
||||
|
||||
ColumnLayout {
|
||||
anchors.fill: parent
|
||||
spacing: 0
|
||||
|
||||
Rectangle {
|
||||
id: rect
|
||||
Layout.fillWidth: true
|
||||
Layout.preferredHeight: Style.baseWidgetSize * 1.5 * scaling
|
||||
Layout.fillHeight: true
|
||||
radius: Style.radiusS * scaling
|
||||
color: modelData.connected ? Color.mPrimary : (networkMouseArea.containsMouse ? Color.mTertiary : Color.transparent)
|
||||
color: networkMouseArea.containsMouse ? Color.mTertiary : Color.transparent
|
||||
border.color: modelData.connected ? Color.mPrimary : Color.transparent
|
||||
border.width: Math.max(1, Style.borderM * scaling)
|
||||
|
||||
RowLayout {
|
||||
anchors.fill: parent
|
||||
anchors.margins: Style.marginS * scaling
|
||||
anchors {
|
||||
fill: parent
|
||||
leftMargin: Style.marginL * scaling
|
||||
rightMargin: Style.marginL * scaling
|
||||
}
|
||||
spacing: Style.marginS * scaling
|
||||
|
||||
NIcon {
|
||||
text: NetworkService.signalIcon(modelData.signal)
|
||||
font.pointSize: Style.fontSizeXXL * scaling
|
||||
color: modelData.connected ? Color.mSurface : (networkMouseArea.containsMouse ? Color.mSurface : Color.mOnSurface)
|
||||
color: networkMouseArea.containsMouse ? Color.mSurface : Color.mOnSurface
|
||||
}
|
||||
|
||||
ColumnLayout {
|
||||
Layout.fillWidth: true
|
||||
spacing: Style.marginXS * scaling
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
spacing: 0
|
||||
|
||||
// SSID
|
||||
NText {
|
||||
Layout.fillWidth: true
|
||||
text: modelData.ssid || "Unknown Network"
|
||||
font.pointSize: Style.fontSizeNormal * scaling
|
||||
elide: Text.ElideRight
|
||||
Layout.fillWidth: true
|
||||
color: modelData.connected ? Color.mSurface : (networkMouseArea.containsMouse ? Color.mSurface : Color.mOnSurface)
|
||||
color: networkMouseArea.containsMouse ? Color.mSurface : Color.mOnSurface
|
||||
}
|
||||
|
||||
// Security Protocol
|
||||
NText {
|
||||
text: modelData.security && modelData.security !== "--" ? modelData.security : "Open"
|
||||
font.pointSize: Style.fontSizeXS * scaling
|
||||
elide: Text.ElideRight
|
||||
Layout.fillWidth: true
|
||||
color: modelData.connected ? Color.mSurface : (networkMouseArea.containsMouse ? Color.mSurface : Color.mOnSurface)
|
||||
}
|
||||
|
||||
NText {
|
||||
visible: NetworkService.connectStatusSsid === modelData.ssid
|
||||
&& NetworkService.connectStatus === "error" && NetworkService.connectError.length > 0
|
||||
text: NetworkService.connectError
|
||||
color: Color.mError
|
||||
font.pointSize: Style.fontSizeXS * scaling
|
||||
font.pointSize: Style.fontSizeXXS * scaling
|
||||
elide: Text.ElideRight
|
||||
Layout.fillWidth: true
|
||||
color: networkMouseArea.containsMouse ? Color.mSurface : Color.mOnSurface
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -203,17 +210,25 @@ NPanel {
|
|||
NBusyIndicator {
|
||||
visible: NetworkService.connectingSsid === modelData.ssid
|
||||
running: NetworkService.connectingSsid === modelData.ssid
|
||||
color: Color.mPrimary
|
||||
color: networkMouseArea.containsMouse ? Color.mSurface : Color.mOnSurface
|
||||
anchors.centerIn: parent
|
||||
size: Style.baseWidgetSize * 0.7 * scaling
|
||||
}
|
||||
}
|
||||
|
||||
NText {
|
||||
RowLayout {
|
||||
visible: modelData.connected
|
||||
text: "connected"
|
||||
font.pointSize: Style.fontSizeXS * scaling
|
||||
color: modelData.connected ? Color.mSurface : (networkMouseArea.containsMouse ? Color.mSurface : Color.mOnSurface)
|
||||
NText {
|
||||
text: "Connected"
|
||||
font.pointSize: Style.fontSizeXS * scaling
|
||||
color: networkMouseArea.containsMouse ? Color.mSurface : Color.mOnSurface
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
}
|
||||
NIcon {
|
||||
text: "check"
|
||||
font.pointSize: Style.fontSizeXXL * scaling
|
||||
color: networkMouseArea.containsMouse ? Color.mSurface : Color.mOnSurface
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -224,6 +239,7 @@ NPanel {
|
|||
onClicked: {
|
||||
if (modelData.connected) {
|
||||
NetworkService.disconnectNetwork(modelData.ssid)
|
||||
showPasswordPrompt = false
|
||||
} else if (NetworkService.isSecured(modelData.security) && !modelData.existing) {
|
||||
passwordPromptSsid = modelData.ssid
|
||||
showPasswordPrompt = true
|
||||
|
|
@ -240,11 +256,11 @@ NPanel {
|
|||
|
||||
// Password prompt section
|
||||
Rectangle {
|
||||
id: passwordPromptSection
|
||||
visible: modelData.ssid === passwordPromptSsid && showPasswordPrompt
|
||||
Layout.fillWidth: true
|
||||
Layout.preferredHeight: modelData.ssid === passwordPromptSsid && showPasswordPrompt ? 60 : 0
|
||||
Layout.margins: Style.marginS * scaling
|
||||
visible: modelData.ssid === passwordPromptSsid && showPasswordPrompt
|
||||
|
||||
color: Color.mSurfaceVariant
|
||||
radius: Style.radiusS * scaling
|
||||
|
||||
|
|
@ -280,8 +296,10 @@ NPanel {
|
|||
echoMode: TextInput.Password
|
||||
onTextChanged: passwordInput = text
|
||||
onAccepted: {
|
||||
NetworkService.submitPassword(passwordPromptSsid, passwordInput)
|
||||
showPasswordPrompt = false
|
||||
if (passwordInput !== "") {
|
||||
NetworkService.submitPassword(passwordPromptSsid, passwordInput)
|
||||
showPasswordPrompt = false
|
||||
}
|
||||
}
|
||||
|
||||
MouseArea {
|
||||
|
|
@ -315,8 +333,10 @@ NPanel {
|
|||
MouseArea {
|
||||
anchors.fill: parent
|
||||
onClicked: {
|
||||
NetworkService.submitPassword(passwordPromptSsid, passwordInput)
|
||||
showPasswordPrompt = false
|
||||
if (passwordInput !== "") {
|
||||
NetworkService.submitPassword(passwordPromptSsid, passwordInput)
|
||||
showPasswordPrompt = false
|
||||
}
|
||||
}
|
||||
cursorShape: Qt.PointingHandCursor
|
||||
hoverEnabled: true
|
||||
|
|
@ -324,6 +344,13 @@ NPanel {
|
|||
onExited: parent.color = Color.mPrimary
|
||||
}
|
||||
}
|
||||
|
||||
NIconButton {
|
||||
icon: "close"
|
||||
onClicked: {
|
||||
showPasswordPrompt = false
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue