Compare commits
32
Commits
v1.2.0
...
96c3c055c2
| Author | SHA1 | Date | |
|---|---|---|---|
 Jokul
|
96c3c055c2 | ||
|
Jokul
|
1d79dbf261 | ||
|
Jokul
|
77039d807c | ||
|
Jokul
|
84e56c547c | ||
|
Jokul
|
640cc2ab84 | ||
|
Jokul
|
34e163c6d2 | ||
|
Jokul
|
da271deea0 | ||
|
Jokul
|
30a186b6dc | ||
|
Jokul
|
6ef9a23a24 | ||
|
Jokul
|
a5cfffc2f1 | ||
|
Jokul
|
ee885e0dbb | ||
|
Jokul
|
d18314bdec | ||
|
Jokul
|
4aca583d2d | ||
|
Jokul
|
0f70beaab8 | ||
|
Jokul
|
0814cc70ca | ||
|
Jokul
|
d1b7e083eb | ||
|
Jokul
|
72c1f1e702 | ||
|
Jokul
|
9b8f6367e9 | ||
|
Jokul
|
8129730d43 | ||
|
Jokul
|
28829c2ab7 | ||
|
Jokul
|
45fd39407f | ||
|
Jokul
|
98f88c05c5 | ||
|
Jokul
|
7ebfa5b74e | ||
|
Jokul
|
e7f0200da4 | ||
|
Jokul
|
37300e3b79 | ||
|
Jokul
|
e6123b1600 | ||
|
Jokul
|
483c0f2ee6 | ||
|
Jokul
|
d1b222486b | ||
|
Jokul
|
90a2f39e75 | ||
|
Jokul
|
01e38db724 | ||
|
Jokul
|
d0ce71ddab | ||
|
Jokul
|
8cd402a474 |
@@ -15,6 +15,7 @@ cmake-build-*/
|
||||
*.so
|
||||
*.so.*
|
||||
*.dylib
|
||||
*.deb
|
||||
|
||||
# Qt Creator
|
||||
*.pro.user
|
||||
|
||||
+8
-1
@@ -6,7 +6,10 @@ set(CMAKE_CXX_STANDARD 17)
|
||||
set(CMAKE_CXX_STANDARD_REQUIRED ON)
|
||||
set(CMAKE_AUTOMOC ON)
|
||||
|
||||
find_package(Qt6 REQUIRED COMPONENTS Core Quick DBus Network LinguistTools Test)
|
||||
find_package(Qt6 REQUIRED COMPONENTS Core Quick DBus Network LinguistTools)
|
||||
# Test 仅用于单元测试目标，非主插件依赖；将其设为可选，
|
||||
# 避免未安装 Qt6 Test 开发包的环境构建主插件时失败
|
||||
find_package(Qt6 OPTIONAL_COMPONENTS Test)
|
||||
find_package(Dtk6 REQUIRED COMPONENTS Core)
|
||||
find_package(DDEShell REQUIRED)
|
||||
|
||||
@@ -68,6 +71,9 @@ install(DIRECTORY package/components DESTINATION /usr/share/dde-shell/${PLUGIN_I
|
||||
install(FILES ${QM_FILES} DESTINATION /usr/share/dde-shell/${PLUGIN_ID}/translations)
|
||||
|
||||
# ---- 单元测试 ----
|
||||
# 仅当 Qt6 Test 组件存在时才构建测试目标
|
||||
# 设计原因：Test 为可选组件，未安装 Qt6 Test 开发包的环境仍应能正常构建主插件
|
||||
if(TARGET Qt6::Test)
|
||||
# 直接编译源文件到测试可执行文件，避免共享库依赖问题
|
||||
enable_testing()
|
||||
add_executable(tst_networkmonitorapplet
|
||||
@@ -93,3 +99,4 @@ target_compile_definitions(tst_networkmonitorapplet PRIVATE
|
||||
TRANSLATIONS_DIR="${CMAKE_CURRENT_SOURCE_DIR}/translations"
|
||||
)
|
||||
add_test(NAME tst_networkmonitorapplet COMMAND tst_networkmonitorapplet)
|
||||
endif()
|
||||
@@ -28,7 +28,7 @@ QML 前端渲染界面，实时显示当前网卡的上行/下行速率与累计
|
||||
构建需要以下开发包：
|
||||
|
||||
```sh
|
||||
sudo apt install build-essential cmake pkg-config qt6-base-dev qt6-declarative-dev libdtkcommon-dev libdde-shell-dev
|
||||
sudo apt install build-essential cmake pkg-config qt6-base-dev qt6-declarative-dev libdtkcommon-dev libdtk6gui-dev libxkbcommon-dev libdde-shell-dev
|
||||
```
|
||||
|
||||
各包与 CMake `find_package` 的对应关系：
|
||||
@@ -36,8 +36,10 @@ sudo apt install build-essential cmake pkg-config qt6-base-dev qt6-declarative-d
|
||||
| 依赖包 | 提供 | 对应 CMake find_package |
|
||||
|---|---|---|
|
||||
| qt6-base-dev | Qt6 Core / DBus / Network | Qt6 Core DBus Network |
|
||||
| qt6-declarative-dev | Qt6 Quick | Qt6 Quick |
|
||||
| qt6-declarative-dev | Qt6 Quick / LinguistTools / Test | Qt6 Quick LinguistTools Test |
|
||||
| libdtkcommon-dev | Dtk6 Core | Dtk6 Core |
|
||||
| libdtk6gui-dev | Dtk6 Gui（DDEShell 间接依赖） | Dtk6Gui（由 DDEShellConfig.cmake find_dependency） |
|
||||
| libxkbcommon-dev | XKB（DDEShell 间接依赖） | XKB（由 DDEShellConfig.cmake find_dependency） |
|
||||
| libdde-shell-dev | DDEShell | DDEShell |
|
||||
|
||||
> 运行时仅需 `dde-shell` 及 Qt6/Dtk6 运行库，上述 `-dev` 包仅构建时需要。
|
||||
|
||||
+1
-1
@@ -66,7 +66,7 @@ echo "[1/6] 检查构建依赖..."
|
||||
# 设计原因：用户 clone 后直接运行 build-deb.sh 经常因缺少 -dev 包导致
|
||||
# CMake 配置失败，但原脚本用 tail -3 吞掉关键错误，用户无法定位问题。
|
||||
# 在构建前主动预检可提前给出明确指引。
|
||||
DEPS=(qt6-base-dev qt6-declarative-dev libdtkcommon-dev libdde-shell-dev)
|
||||
DEPS=(qt6-base-dev qt6-declarative-dev libdtkcommon-dev libdtk6gui-dev libxkbcommon-dev libdde-shell-dev)
|
||||
MISSING=()
|
||||
for pkg in "${DEPS[@]}"; do
|
||||
if ! dpkg -s "$pkg" &> /dev/null 2>&1; then
|
||||
|
||||
@@ -0,0 +1,744 @@
|
||||
# 左键弹窗重新设计 实现计划
|
||||
|
||||
> **For agentic workers:** REQUIRED SUB-SKILL: Use superpowers:subagent-driven-development (recommended) or superpowers:executing-plans to implement this plan task-by-task. Steps use checkbox (`- [ ]`) syntax for tracking.
|
||||
|
||||
**Goal:** 重新设计 NetworkPopup 左键弹窗布局，采用通透分区方案，适配用户字体颜色和网卡图标，预留字号缩放扩展点。
|
||||
|
||||
**Architecture:** 去掉自绘卡片背景，用分隔线+留白划分四个区域（接口信息/实时速度/累计流量/接口切换），速度数字放大为视觉锚点。将 SettingsWindow 的 interfaceIcon/interfaceDescription 提取到 NetCommon 共享，NetworkPopup 接入用户 textColor 和 fontScale。
|
||||
|
||||
**Tech Stack:** QML 2.15 + QtQuick.Controls 2.15 + DTK 1.0 + dde-shell PanelPopup
|
||||
|
||||
## Global Constraints
|
||||
|
||||
- 项目无测试/lint/CI 目标，验证为手动：`cmake --build build` + `sudo cmake --install build` + `systemctl --user restart dde-shell@DDE`
|
||||
- QML 文件保留 SPDX 头（`SPDX-FileCopyrightText: 2026 Jokul` + `SPDX-License-Identifier: LGPL-3.0-or-later`）
|
||||
- 注释语言统一使用中文，字段/函数上方必须添加中文注释
|
||||
- `NetCommon.qml` 的现有颜色定义和格式化函数不变，仅新增函数
|
||||
- C++ 后端本次不改（fontScale 预留扩展点，后续再加）
|
||||
- Commit message 使用中文，格式遵循 conventional commits
|
||||
|
||||
---
|
||||
|
||||
## File Structure
|
||||
|
||||
| 文件 | 职责 | 本次改动 |
|
||||
|---|---|---|
|
||||
| `package/components/NetCommon.qml` | 公共颜色与格式化函数 | 新增 `interfaceIcon`、`interfaceDescription`、`formatSpeedValue`、`formatSpeedUnit` 四个函数 |
|
||||
| `package/components/SettingsWindow.qml` | 设置窗口 | 删除本地 `interfaceIcon`/`interfaceDescription`，改为调用 `common.xxx` |
|
||||
| `package/components/NetworkPopup.qml` | 弹窗内容组件 | 完全重写布局 |
|
||||
| `package/networkview.qml` | 主入口 | 仅改 `PanelPopup` 的 width/height |
|
||||
|
||||
---
|
||||
|
||||
### Task 1: 提取共享函数到 NetCommon.qml + 更新 SettingsWindow.qml
|
||||
|
||||
**Files:**
|
||||
- Modify: `package/components/NetCommon.qml`（在 `formatTotal` 函数后、闭合 `}` 前新增四个函数）
|
||||
- Modify: `package/components/SettingsWindow.qml`（删除本地 interfaceIcon/interfaceDescription，新增 import 和 common 实例，替换调用处）
|
||||
|
||||
**Interfaces:**
|
||||
- Produces: `common.interfaceIcon(name)` 返回 Unicode 符号字符串；`common.interfaceDescription(name)` 返回翻译后的类型描述字符串；`common.formatSpeedValue(bytesPerSec)` 返回速度数值部分（如 `"4.11"`）；`common.formatSpeedUnit(bytesPerSec)` 返回速度单位部分（如 `"KB/s"`）
|
||||
|
||||
- [ ] **Step 1: 在 NetCommon.qml 新增四个函数**
|
||||
|
||||
在 `NetCommon.qml` 的 `formatTotal` 函数闭合 `}` 之后、文件最终闭合 `}` 之前，插入以下代码：
|
||||
|
||||
```qml
|
||||
|
||||
// 根据接口名返回类型图标（Unicode 符号），用于网络接口列表和弹窗接口信息区
|
||||
// 设计原因：项目未引入图标库，用 Text 渲染 Unicode 符号（与 ↓↑ 一致）；
|
||||
// 所选符号均为 DejaVu/Noto 等常见字体覆盖的单色字形，避免彩色 emoji 破坏浅色主题观感
|
||||
function interfaceIcon(name) {
|
||||
if (name === "lo") return "↻" // 本地回环：循环箭头
|
||||
if (name === "Meta") return "▢" // 虚拟接口：空心方块
|
||||
if (/^enp|^eth/.test(name)) return "⇄" // 有线网络：双向链路
|
||||
if (/^wlp|^wlan/.test(name)) return "∿" // 无线网络：信号波形
|
||||
if (/^docker|^veth/.test(name)) return "▣" // 容器网络：盒中盒
|
||||
if (/^br/.test(name)) return "⋈" // 桥接：连接
|
||||
if (/^tun|^tap/.test(name)) return "⚿" // VPN：钥匙
|
||||
if (/^virbr/.test(name)) return "⋈" // 虚拟桥接：同桥接
|
||||
return "◉" // 其他：通用网络节点
|
||||
}
|
||||
|
||||
// 根据接口名返回类型描述，用于设置窗口网络接口列表和弹窗 tooltip
|
||||
// 设计原因：用户面对多个网口时难以仅凭 enp3s0/wlp3s0 等命名判断用途，
|
||||
// 加一行类型说明（有线/无线/VPN 等）降低认知负担
|
||||
function interfaceDescription(name) {
|
||||
if (name === "lo") return qsTr("Loopback")
|
||||
if (name === "Meta") return qsTr("Virtual Interface")
|
||||
if (/^enp|^eth/.test(name)) return qsTr("Wired Network")
|
||||
if (/^wlp|^wlan/.test(name)) return qsTr("Wireless Network")
|
||||
if (/^docker|^veth/.test(name)) return qsTr("Container Network")
|
||||
if (/^br/.test(name)) return qsTr("Bridge")
|
||||
if (/^tun|^tap/.test(name)) return qsTr("VPN")
|
||||
if (/^virbr/.test(name)) return qsTr("Virtual Bridge")
|
||||
return qsTr("Other")
|
||||
}
|
||||
|
||||
// 拆分速度字符串为数值部分：formatSpeed 返回 "4.11 KB/s"，本函数返回 "4.11"
|
||||
// 设计原因：弹窗速度区需将数值（大号粗体）与单位（小号）拆分显示以增强层次感
|
||||
function formatSpeedValue(bytesPerSec) {
|
||||
var str = formatSpeed(bytesPerSec)
|
||||
var idx = str.indexOf(' ')
|
||||
return idx < 0 ? str : str.substring(0, idx)
|
||||
}
|
||||
|
||||
// 拆分速度字符串为单位部分：formatSpeed 返回 "4.11 KB/s"，本函数返回 "KB/s"
|
||||
function formatSpeedUnit(bytesPerSec) {
|
||||
var str = formatSpeed(bytesPerSec)
|
||||
var idx = str.indexOf(' ')
|
||||
return idx < 0 ? "" : str.substring(idx + 1)
|
||||
}
|
||||
```
|
||||
|
||||
- [ ] **Step 2: 在 SettingsWindow.qml 添加 import 和 NetCommon 实例**
|
||||
|
||||
在 `SettingsWindow.qml` 的 import 块末尾（`import QtQuick.Window 2.15` 之后）添加：
|
||||
|
||||
```qml
|
||||
import "."
|
||||
```
|
||||
|
||||
在 `Window { id: root` 之后、`property var applet: null` 之前添加：
|
||||
|
||||
```qml
|
||||
// 公共函数：interfaceIcon/interfaceDescription 已从本文件迁移至 NetCommon.qml，
|
||||
// 与 NetworkPopup 共享同一份实现，消除跨组件重复定义
|
||||
NetCommon { id: common }
|
||||
```
|
||||
|
||||
- [ ] **Step 3: 删除 SettingsWindow.qml 的本地 interfaceIcon 和 interfaceDescription 函数**
|
||||
|
||||
删除 `SettingsWindow.qml` 中 `interfaceDescription` 函数（当前第 72-82 行）和 `interfaceIcon` 函数（当前第 88-98 行）的完整定义，包括函数上方的注释。
|
||||
|
||||
- [ ] **Step 4: 替换 SettingsWindow.qml 中的函数调用处**
|
||||
|
||||
将 `SettingsWindow.qml` 中所有 `interfaceIcon(modelData)` 替换为 `common.interfaceIcon(modelData)`，将 `interfaceDescription(modelData)` 替换为 `common.interfaceDescription(modelData)`。
|
||||
|
||||
涉及两处（均在接口列表 Repeater 的 delegate 内）：
|
||||
- 图标 Text 的 `text: interfaceIcon(modelData)` -> `text: common.interfaceIcon(modelData)`
|
||||
- 描述 Text 的 `text: interfaceDescription(modelData)` -> `text: common.interfaceDescription(modelData)`
|
||||
|
||||
- [ ] **Step 5: 构建**
|
||||
|
||||
Run: `cmake --build build`
|
||||
Expected: 编译成功，无错误
|
||||
|
||||
- [ ] **Step 6: 安装并重启 dde-shell**
|
||||
|
||||
Run: `sudo cmake --install build && systemctl --user restart dde-shell@DDE`
|
||||
Expected: 安装成功，dde-shell 重启
|
||||
|
||||
- [ ] **Step 7: 手动验证设置窗口**
|
||||
|
||||
验证清单：
|
||||
1. 右键任务栏网络监控图标 -> 点击"设置"
|
||||
2. 设置窗口打开，网络接口列表每行左侧仍显示类型图标（∿/⇄/▢ 等）
|
||||
3. 每行右侧仍显示类型描述（"无线网络"/"有线网络"/"虚拟接口" 等）
|
||||
4. 图标和描述与改动前完全一致
|
||||
|
||||
- [ ] **Step 8: 提交**
|
||||
|
||||
```bash
|
||||
git add package/components/NetCommon.qml package/components/SettingsWindow.qml
|
||||
git commit -m "refactor: 提取 interfaceIcon/interfaceDescription 到 NetCommon 共享
|
||||
|
||||
将 SettingsWindow 的接口图标和描述函数迁移到 NetCommon.qml，
|
||||
消除与 NetworkPopup 的重复定义；新增 formatSpeedValue/formatSpeedUnit
|
||||
为弹窗速度数值与单位拆分显示做准备"
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
### Task 2: 重写 NetworkPopup.qml + 更新 networkview.qml 弹窗尺寸
|
||||
|
||||
**Files:**
|
||||
- Modify: `package/networkview.qml:267-268`（PanelPopup 的 width/height）
|
||||
- Rewrite: `package/components/NetworkPopup.qml`（完整重写布局）
|
||||
|
||||
**Interfaces:**
|
||||
- Consumes: `common.interfaceIcon(name)`（Task 1 产出）、`common.formatSpeedValue(bytesPerSec)`、`common.formatSpeedUnit(bytesPerSec)`
|
||||
- Produces: `popup.primaryText`（支持用户 textColor 覆盖）、`popup.fontScale`（预留字号缩放）
|
||||
|
||||
- [ ] **Step 1: 更新 networkview.qml 的 PanelPopup 尺寸**
|
||||
|
||||
将 `networkview.qml` 第 267-268 行：
|
||||
|
||||
```qml
|
||||
width: 360
|
||||
height: 320
|
||||
```
|
||||
|
||||
改为：
|
||||
|
||||
```qml
|
||||
width: 330
|
||||
height: 250
|
||||
```
|
||||
|
||||
- [ ] **Step 2: 完整重写 NetworkPopup.qml**
|
||||
|
||||
将 `package/components/NetworkPopup.qml` 全文替换为以下内容：
|
||||
|
||||
```qml
|
||||
// SPDX-FileCopyrightText: 2026 Jokul
|
||||
//
|
||||
// SPDX-License-Identifier: LGPL-3.0-or-later
|
||||
|
||||
// 网络速度监控弹窗内容组件
|
||||
// 通透分区布局：去掉自绘卡片背景，用分隔线+留白划分四个区域
|
||||
// （接口信息 / 实时速度 / 累计流量 / 接口切换），速度数字放大为视觉锚点
|
||||
// 由 networkview.qml 的 PanelPopup 实例化，传入 applet 属性
|
||||
// 毛玻璃背景、圆角、阴影由 PanelPopup 自动提供，本组件不自绘背景
|
||||
// 颜色与格式化函数统一取自同目录 NetCommon.qml（common.xxx），数据由 applet 提供
|
||||
// 可配置适配：primaryText 跟随用户 textColor、fontScale 预留字号缩放扩展点
|
||||
// 设计原因：PanelPopup 是 dock 上下文类型，不能作为独立组件根元素，
|
||||
// 因此本组件用 Control 作为根，由 networkview.qml 的 PanelPopup 包裹
|
||||
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import org.deepin.ds.dock 1.0
|
||||
import org.deepin.dtk 1.0
|
||||
import "."
|
||||
|
||||
Control {
|
||||
id: popup
|
||||
|
||||
// 公共颜色与格式化函数：集中定义于同目录 NetCommon.qml
|
||||
NetCommon { id: common }
|
||||
|
||||
// C++ 后端对象，提供速度/接口/IP 等所有数据
|
||||
property var applet: null
|
||||
|
||||
readonly property bool ready: applet ? applet.ready : false
|
||||
readonly property real downloadSpeed: applet ? applet.downloadSpeed : 0
|
||||
readonly property real uploadSpeed: applet ? applet.uploadSpeed : 0
|
||||
readonly property real totalDownload: applet ? applet.totalDownload : 0
|
||||
readonly property real totalUpload: applet ? applet.totalUpload : 0
|
||||
readonly property string activeInterface: applet ? (applet.activeInterface || "") : ""
|
||||
// 活动接口的 IPv4 地址，由 C++ 后端 detectIpAddress 持续更新
|
||||
readonly property string ipAddress: applet ? (applet.ipAddress || "") : ""
|
||||
// 活动接口的 IPv6 全球地址，由 C++ 后端 detectIpAddress 持续更新
|
||||
readonly property string ipv6Address: applet ? (applet.ipv6Address || "") : ""
|
||||
readonly property var networkInterfaces: applet ? (applet.networkInterfaces || []) : []
|
||||
|
||||
// 用户自定义字体色：非空时覆盖 primaryText，空串回退 DTK 调色板派生
|
||||
// 仅作用于主要文字（接口名、速度数值、累计数值、chip 未选中文字）
|
||||
// secondaryText/tertiaryText/强调色不跟随，保持系统主题层次不崩
|
||||
readonly property string userTextColor: applet ? (applet.textColor || "") : ""
|
||||
readonly property color primaryText: userTextColor.length > 0
|
||||
? Qt.rgba(userTextColor.r, userTextColor.g, userTextColor.b, 0.95)
|
||||
: common.primaryText
|
||||
|
||||
// 次要/三级文字与卡片边框仍从 common 取 DTK 派生值，不跟随用户色
|
||||
readonly property color secondaryText: common.secondaryText
|
||||
readonly property color tertiaryText: common.tertiaryText
|
||||
readonly property color cardBorder: common.cardBorder
|
||||
|
||||
// 强调色：下载蓝、上传绿，是面板的主视觉区分
|
||||
readonly property color accentBlue: common.accentBlue
|
||||
readonly property color accentGreen: common.accentGreen
|
||||
|
||||
// 上传值颜色：固定绿色，不做高速警示
|
||||
readonly property color uploadValueColor: common.uploadValueColor
|
||||
|
||||
// 字号缩放因子：默认 1.0，后续 C++ 后端新增 applet.fontScale 后自动绑定
|
||||
// 所有字号 = 基准字号 × fontScale，实现全局字号调节
|
||||
// 当前 applet.fontScale 尚不存在，恒为 1.0，视觉无变化
|
||||
readonly property real fontScale: (applet && applet.fontScale !== undefined)
|
||||
? applet.fontScale : 1.0
|
||||
|
||||
// 排序后的接口列表：物理网卡在前，虚拟网卡在后，各自按名称排序
|
||||
// 设计原因：保持稳定排序，活动接口不再移到最前，避免切换网卡时 chip 顺序跳动；
|
||||
// 活动 chip 若被截断，由 chipFlickable 自动滚动露出完整样式；
|
||||
// 物理网卡判断逻辑共用 common.isPhysicalIf（与 C++ isPhysicalInterface 一致）
|
||||
readonly property var sortedInterfaces: {
|
||||
if (!popup.ready || popup.networkInterfaces.length === 0) return []
|
||||
var physical = []
|
||||
var virtual = []
|
||||
for (var i = 0; i < popup.networkInterfaces.length; i++) {
|
||||
var name = popup.networkInterfaces[i]
|
||||
if (common.isPhysicalIf(name)) physical.push(name)
|
||||
else virtual.push(name)
|
||||
}
|
||||
physical.sort()
|
||||
virtual.sort()
|
||||
return physical.concat(virtual)
|
||||
}
|
||||
|
||||
// 供外部调用：popup 打开时滚动到活动 chip
|
||||
function scrollToActiveChip(animated) {
|
||||
chipFlickable.scrollToActiveChip(animated)
|
||||
}
|
||||
|
||||
padding: 12
|
||||
|
||||
contentItem: ColumnLayout {
|
||||
spacing: 10
|
||||
|
||||
// ==================== 占位态：未检测到接口 ====================
|
||||
// 占位时只显示警告图标+文字，不显示其他分区和分隔线
|
||||
ColumnLayout {
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
Layout.preferredHeight: 80
|
||||
spacing: 6
|
||||
visible: !popup.ready
|
||||
|
||||
Text {
|
||||
text: "⚠"
|
||||
font.pixelSize: Math.round(40 * popup.fontScale)
|
||||
color: popup.tertiaryText
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
}
|
||||
|
||||
Text {
|
||||
text: qsTr("No network interface detected")
|
||||
font.pixelSize: Math.round(14 * popup.fontScale)
|
||||
color: popup.secondaryText
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
}
|
||||
}
|
||||
|
||||
// ==================== 分区1：接口信息 ====================
|
||||
// 类型图标 + 接口名 + IPv4 一行，IPv6 截断显示一行
|
||||
ColumnLayout {
|
||||
Layout.fillWidth: true
|
||||
spacing: 4
|
||||
visible: popup.ready
|
||||
|
||||
// 行1：类型图标 + 接口名 + · + IPv4
|
||||
Text {
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
Layout.fillWidth: true
|
||||
horizontalAlignment: Text.AlignHCenter
|
||||
font.pixelSize: Math.round(13 * popup.fontScale)
|
||||
color: popup.secondaryText
|
||||
text: {
|
||||
var icon = common.interfaceIcon(popup.activeInterface)
|
||||
var parts = icon + " " + popup.activeInterface
|
||||
if (popup.ipAddress) parts += " · " + popup.ipAddress
|
||||
return parts
|
||||
}
|
||||
}
|
||||
|
||||
// 行2：IPv6 地址（超长截断 + hover tooltip 显示完整地址）
|
||||
Text {
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
Layout.fillWidth: true
|
||||
Layout.maximumWidth: 300
|
||||
horizontalAlignment: Text.AlignHCenter
|
||||
font.pixelSize: Math.round(12 * popup.fontScale)
|
||||
color: popup.tertiaryText
|
||||
visible: popup.ipv6Address !== ""
|
||||
text: popup.ipv6Address ? qsTr("IPv6: ") + popup.ipv6Address : ""
|
||||
elide: Text.ElideRight
|
||||
|
||||
ToolTip.text: popup.ipv6Address
|
||||
ToolTip.visible: ipv6Mouse.containsMouse && popup.ipv6Address !== ""
|
||||
ToolTip.delay: 300
|
||||
|
||||
MouseArea {
|
||||
id: ipv6Mouse
|
||||
anchors.fill: parent
|
||||
hoverEnabled: true
|
||||
cursorShape: Qt.IBeamCursor
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 分隔线1
|
||||
Rectangle {
|
||||
Layout.fillWidth: true
|
||||
Layout.preferredHeight: 1
|
||||
color: popup.cardBorder
|
||||
visible: popup.ready
|
||||
}
|
||||
|
||||
// ==================== 分区2：实时速度（视觉锚点） ====================
|
||||
// 双栏等宽，下载左半区、上传右半区，中间靠留白区分无竖线
|
||||
Item {
|
||||
Layout.fillWidth: true
|
||||
Layout.preferredHeight: 60
|
||||
visible: popup.ready
|
||||
|
||||
// 下载半区（左半）
|
||||
Item {
|
||||
id: downloadHalf
|
||||
anchors.left: parent.left
|
||||
anchors.top: parent.top
|
||||
anchors.bottom: parent.bottom
|
||||
width: parent.width / 2
|
||||
|
||||
ColumnLayout {
|
||||
anchors.centerIn: parent
|
||||
spacing: 2
|
||||
|
||||
// 下载标签
|
||||
Text {
|
||||
text: qsTr("Download")
|
||||
font.pixelSize: Math.round(12 * popup.fontScale)
|
||||
color: popup.secondaryText
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
}
|
||||
|
||||
// 箭头 + 数值（大号粗体）+ 单位（小号）
|
||||
RowLayout {
|
||||
spacing: 2
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
|
||||
Text {
|
||||
text: "↓"
|
||||
font.pixelSize: Math.round(24 * popup.fontScale)
|
||||
font.weight: Font.Bold
|
||||
color: common.downloadValueColor(popup.downloadSpeed)
|
||||
}
|
||||
|
||||
Text {
|
||||
text: common.formatSpeedValue(popup.downloadSpeed)
|
||||
font.pixelSize: Math.round(24 * popup.fontScale)
|
||||
font.weight: Font.Bold
|
||||
color: common.downloadValueColor(popup.downloadSpeed)
|
||||
}
|
||||
|
||||
Text {
|
||||
text: common.formatSpeedUnit(popup.downloadSpeed)
|
||||
font.pixelSize: Math.round(13 * popup.fontScale)
|
||||
color: common.downloadValueColor(popup.downloadSpeed)
|
||||
Layout.alignment: Qt.AlignBaseline
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 上传半区（右半）
|
||||
Item {
|
||||
id: uploadHalf
|
||||
anchors.right: parent.right
|
||||
anchors.top: parent.top
|
||||
anchors.bottom: parent.bottom
|
||||
width: parent.width / 2
|
||||
|
||||
ColumnLayout {
|
||||
anchors.centerIn: parent
|
||||
spacing: 2
|
||||
|
||||
// 上传标签
|
||||
Text {
|
||||
text: qsTr("Upload")
|
||||
font.pixelSize: Math.round(12 * popup.fontScale)
|
||||
color: popup.secondaryText
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
}
|
||||
|
||||
// 箭头 + 数值（大号粗体）+ 单位（小号）
|
||||
RowLayout {
|
||||
spacing: 2
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
|
||||
Text {
|
||||
text: "↑"
|
||||
font.pixelSize: Math.round(24 * popup.fontScale)
|
||||
font.weight: Font.Bold
|
||||
color: popup.uploadValueColor
|
||||
}
|
||||
|
||||
Text {
|
||||
text: common.formatSpeedValue(popup.uploadSpeed)
|
||||
font.pixelSize: Math.round(24 * popup.fontScale)
|
||||
font.weight: Font.Bold
|
||||
color: popup.uploadValueColor
|
||||
}
|
||||
|
||||
Text {
|
||||
text: common.formatSpeedUnit(popup.uploadSpeed)
|
||||
font.pixelSize: Math.round(13 * popup.fontScale)
|
||||
color: popup.uploadValueColor
|
||||
Layout.alignment: Qt.AlignBaseline
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 分隔线2
|
||||
Rectangle {
|
||||
Layout.fillWidth: true
|
||||
Layout.preferredHeight: 1
|
||||
color: popup.cardBorder
|
||||
visible: popup.ready
|
||||
}
|
||||
|
||||
// ==================== 分区3：累计流量 ====================
|
||||
// 单行紧凑：总计标签 + 下载箭头/数值 + 上传箭头/数值
|
||||
RowLayout {
|
||||
Layout.fillWidth: true
|
||||
spacing: 8
|
||||
visible: popup.ready
|
||||
|
||||
Item { Layout.fillWidth: true }
|
||||
|
||||
Text {
|
||||
text: qsTr("Total")
|
||||
font.pixelSize: Math.round(12 * popup.fontScale)
|
||||
color: popup.tertiaryText
|
||||
}
|
||||
|
||||
Text {
|
||||
text: "↓"
|
||||
font.pixelSize: Math.round(12 * popup.fontScale)
|
||||
font.weight: Font.Bold
|
||||
color: popup.accentBlue
|
||||
}
|
||||
|
||||
Text {
|
||||
text: common.formatTotal(popup.totalDownload)
|
||||
font.pixelSize: Math.round(13 * popup.fontScale)
|
||||
color: popup.primaryText
|
||||
}
|
||||
|
||||
Text {
|
||||
text: "↑"
|
||||
font.pixelSize: Math.round(12 * popup.fontScale)
|
||||
font.weight: Font.Bold
|
||||
color: popup.accentGreen
|
||||
}
|
||||
|
||||
Text {
|
||||
text: common.formatTotal(popup.totalUpload)
|
||||
font.pixelSize: Math.round(13 * popup.fontScale)
|
||||
color: popup.primaryText
|
||||
}
|
||||
|
||||
Item { Layout.fillWidth: true }
|
||||
}
|
||||
|
||||
// 分隔线3
|
||||
Rectangle {
|
||||
Layout.fillWidth: true
|
||||
Layout.preferredHeight: 1
|
||||
color: popup.cardBorder
|
||||
visible: popup.ready
|
||||
}
|
||||
|
||||
// ==================== 分区4：接口切换 chip 列表 ====================
|
||||
// 水平滚动，物理网卡在前、虚拟网卡在后，顺序稳定不随切换变化
|
||||
// chip 少时分散撑满一行；chip 多超出宽度时固定宽度 + 水平滚动
|
||||
// 活动 chip 不在可视区域或被截断时，自动滚动露出完整样式（见 scrollToActiveChip）
|
||||
Flickable {
|
||||
id: chipFlickable
|
||||
Layout.fillWidth: true
|
||||
// 高度需容纳 chip（28px）+ 水平滚动条（~6px）+ 上下间距
|
||||
Layout.preferredHeight: 40
|
||||
visible: popup.ready && popup.networkInterfaces.length > 1
|
||||
contentWidth: Math.max(chipRow.width, width)
|
||||
contentHeight: chipRow.height
|
||||
flickableDirection: Flickable.HorizontalFlick
|
||||
clip: true
|
||||
|
||||
// 平滑滚动动画：直接赋值 contentX 会被 Flickable 的拖拽/回弹行为覆盖，
|
||||
// 用 NumberAnimation 驱动 contentX 实现自动滚动，平滑且不冲突
|
||||
NumberAnimation {
|
||||
id: chipScrollAnim
|
||||
target: chipFlickable
|
||||
property: "contentX"
|
||||
duration: 200
|
||||
easing.type: Easing.OutCubic
|
||||
}
|
||||
|
||||
// 用户开始拖拽/滑动时停止自动滚动，避免动画与用户操作争抢
|
||||
onMovementStarted: chipScrollAnim.stop()
|
||||
|
||||
// 自动滚动使活动接口的 chip 完整可见：
|
||||
// 列表顺序稳定后活动 chip 可能位于可视区域外或被截断，
|
||||
// 切换接口或 popup 打开时调用，将其滚动露出完整样式。
|
||||
// animated=false 用于 popup 刚打开时立即定位，跳过滚动过程
|
||||
function scrollToActiveChip(animated) {
|
||||
if (!visible || width <= 0) return
|
||||
var idx = popup.sortedInterfaces.indexOf(popup.activeInterface)
|
||||
if (idx < 0) return
|
||||
var chip = chipRepeater.itemAt(idx)
|
||||
if (!chip) return
|
||||
var targetX = contentX
|
||||
if (chip.x < contentX) {
|
||||
// chip 在可视区左侧之外：回滚使 chip 左边缘与可视区左缘对齐
|
||||
targetX = chip.x
|
||||
} else if (chip.x + chip.width > contentX + width) {
|
||||
// chip 在可视区右侧之外或被截断：滚动使 chip 右边缘与可视区右缘对齐
|
||||
targetX = chip.x + chip.width - width
|
||||
}
|
||||
// 钳制到合法滚动范围 [0, contentWidth - width]，避免触发边界回弹
|
||||
targetX = Math.max(0, Math.min(targetX, Math.max(0, contentWidth - width)))
|
||||
if (Math.abs(targetX - contentX) < 1) return
|
||||
chipScrollAnim.stop()
|
||||
if (animated) {
|
||||
chipScrollAnim.to = targetX
|
||||
chipScrollAnim.start()
|
||||
} else {
|
||||
contentX = targetX
|
||||
}
|
||||
}
|
||||
|
||||
// 活动接口变化时（用户点击 chip 或后端自动切换）自动滚动露出活动 chip
|
||||
Connections {
|
||||
target: popup
|
||||
function onActiveInterfaceChanged() {
|
||||
chipFlickable.scrollToActiveChip(true)
|
||||
}
|
||||
}
|
||||
|
||||
// 等宽分配宽度：假设所有 chip 等宽撑满时的单个宽度
|
||||
readonly property real equalChipWidth: popup.sortedInterfaces.length > 0
|
||||
? (width - 6 * (popup.sortedInterfaces.length - 1)) / popup.sortedInterfaces.length
|
||||
: 0
|
||||
|
||||
Row {
|
||||
id: chipRow
|
||||
spacing: 6
|
||||
|
||||
Repeater {
|
||||
id: chipRepeater
|
||||
model: popup.sortedInterfaces
|
||||
|
||||
Rectangle {
|
||||
// 宽度取等宽和自然宽度的较大值：
|
||||
// chip 少时 equalChipWidth > 自然宽度 -> 分散撑满一行
|
||||
// chip 多时 自然宽度 > equalChipWidth -> 固定宽度 + 水平滚动
|
||||
width: Math.max(chipFlickable.equalChipWidth, chipText.implicitWidth + 24)
|
||||
height: 28
|
||||
radius: 8
|
||||
// 选中态：蓝色填充+蓝边框；未选中态：透明背景+cardBorder 边框
|
||||
// hover 态：边框变蓝、文字变蓝，提供清晰交互反馈
|
||||
color: modelData === popup.activeInterface
|
||||
? popup.accentBlue
|
||||
: "transparent"
|
||||
border.width: 1
|
||||
border.color: modelData === popup.activeInterface
|
||||
? popup.accentBlue
|
||||
: (chipMouse.containsMouse ? popup.accentBlue : popup.cardBorder)
|
||||
|
||||
Text {
|
||||
id: chipText
|
||||
anchors.centerIn: parent
|
||||
text: modelData
|
||||
font.pixelSize: Math.round(12 * popup.fontScale)
|
||||
font.weight: modelData === popup.activeInterface ? Font.Bold : Font.Normal
|
||||
color: modelData === popup.activeInterface
|
||||
? "white"
|
||||
: (chipMouse.containsMouse ? popup.accentBlue : popup.primaryText)
|
||||
}
|
||||
|
||||
MouseArea {
|
||||
id: chipMouse
|
||||
anchors.fill: parent
|
||||
cursorShape: Qt.PointingHandCursor
|
||||
hoverEnabled: true
|
||||
onClicked: {
|
||||
if (popup.applet) popup.applet.setActiveInterface(modelData)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 自定义滚动条样式：默认 ScrollBar 在面板配色下可能不可见，
|
||||
// 用 contentItem 显式绘制，颜色派生自 basePalette 适配深浅主题
|
||||
ScrollBar.horizontal: ScrollBar {
|
||||
id: chipScrollBar
|
||||
policy: ScrollBar.AsNeeded
|
||||
interactive: true
|
||||
|
||||
contentItem: Rectangle {
|
||||
implicitHeight: 4
|
||||
radius: 2
|
||||
// 按压时加深、悬停时中等、默认稍淡，保证滚动条在深浅主题下均可见
|
||||
color: chipScrollBar.pressed ? popup.secondaryText
|
||||
: (chipScrollBar.hovered ? popup.secondaryText : popup.tertiaryText)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 填充剩余空间，将内容推至顶部
|
||||
Item { Layout.fillHeight: true }
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
- [ ] **Step 3: 构建**
|
||||
|
||||
Run: `cmake --build build`
|
||||
Expected: 编译成功，无错误
|
||||
|
||||
- [ ] **Step 4: 安装并重启 dde-shell**
|
||||
|
||||
Run: `sudo cmake --install build && systemctl --user restart dde-shell@DDE`
|
||||
Expected: 安装成功，dde-shell 重启
|
||||
|
||||
- [ ] **Step 5: 手动验证弹窗布局**
|
||||
|
||||
验证清单：
|
||||
1. 左键点击任务栏网络监控图标，弹窗打开
|
||||
2. **无卡片背景**：毛玻璃通透，无 6% 透明度色块，四个区域用分隔线划分
|
||||
3. **接口信息区**：显示类型图标（如 ∿）+ 接口名 + · + IPv4 地址，居中
|
||||
4. **IPv6 截断**：IPv6 地址超长时末尾显示 `…`，hover 显示完整地址 tooltip
|
||||
5. **速度区**：下载/上传标签在上（小字），箭头+数值 24px 粗体在下，单位 KB/s 小号
|
||||
6. **下载阈值变色**：下载速度 >1MB/s 时数值变橙，>10MB/s 变红，否则蓝色
|
||||
7. **累计流量区**：单行显示"总计 ↓ 4.85 GB ↑ 134 MB"，紧凑居中
|
||||
8. **chip 未选中态**：透明背景 + 边框，清晰可辨
|
||||
9. **chip hover**：边框变蓝，文字变蓝
|
||||
10. **chip 选中态**：蓝色填充 + 白字
|
||||
11. **chip 滚动**：接口多时可水平滚动，活动 chip 自动滚入可视区
|
||||
12. **无冗余标题**：弹窗顶部无"网络速度监控"标题
|
||||
|
||||
- [ ] **Step 6: 手动验证深浅主题**
|
||||
|
||||
验证清单：
|
||||
1. 切换系统到深色模式：弹窗毛玻璃深色底，文字浅色，对比度良好
|
||||
2. 切换系统到浅色模式：弹窗毛玻璃浅色底，文字深色，对比度良好
|
||||
3. 各分区文字层次清晰：速度数值 > 标签/接口名 > IPv6/总计标签
|
||||
|
||||
- [ ] **Step 7: 手动验证字体颜色适配**
|
||||
|
||||
验证清单：
|
||||
1. 右键任务栏图标 -> 设置 -> 字体颜色 -> 选择红色
|
||||
2. 左键打开弹窗：接口名、速度数值（未超阈值时）、累计数值、chip 未选中文字变红
|
||||
3. 标签（下载/上传/总计）、IPv6、蓝绿箭头仍保持系统主题色，不跟随
|
||||
4. 设置 -> 字体颜色 -> 选择"跟随系统"：弹窗恢复 DTK 调色板派生色
|
||||
|
||||
- [ ] **Step 8: 手动验证网卡切换**
|
||||
|
||||
验证清单：
|
||||
1. 弹窗底部点击不同 chip，接口信息区更新为对应网卡的图标、名称、IP
|
||||
2. 速度数值切换到对应网卡的数据
|
||||
3. chip 选中态正确跟随切换
|
||||
|
||||
- [ ] **Step 9: 手动验证占位态**
|
||||
|
||||
验证清单：
|
||||
1. （如条件允许）断开所有网络接口或模拟无接口状态
|
||||
2. 左键打开弹窗：显示 ⚠ 图标 + "未检测到网络接口"文字，无其他分区
|
||||
|
||||
- [ ] **Step 10: 提交**
|
||||
|
||||
```bash
|
||||
git add package/networkview.qml package/components/NetworkPopup.qml
|
||||
git commit -m "feat: 重新设计左键弹窗布局
|
||||
|
||||
采用通透分区方案，去掉自绘卡片背景改用分隔线+留白划分四区：
|
||||
接口信息（含类型图标）/ 实时速度（24px 锚点）/ 累计流量 / 接口切换
|
||||
速度数值与单位拆分显示，chip 未选中态改透明+边框
|
||||
适配用户 textColor（仅主要文字跟随）、预留 fontScale 字号缩放扩展点"
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 验证总结
|
||||
|
||||
本计划无自动化测试，验证完全依赖手动构建+安装+视觉检查：
|
||||
- Task 1 验证设置窗口接口图标/描述不受影响（函数迁移无行为变化）
|
||||
- Task 2 验证弹窗新布局、深浅主题、字体颜色跟随、网卡切换、占位态
|
||||
|
||||
若构建或运行时报错，优先检查：
|
||||
- QML import 路径是否正确（`import "."` 在 SettingsWindow.qml 中）
|
||||
- NetCommon.qml 新增函数的 `qsTr()` 在 QtObject 内是否正常（应正常，qsTr 是全局函数）
|
||||
- RowLayout 内 `Layout.alignment: Qt.AlignBaseline` 是否被正确解析
|
||||
@@ -0,0 +1,268 @@
|
||||
# 左键弹窗重新设计
|
||||
|
||||
> 日期：2026-08-08
|
||||
> 状态：已批准，待制定实现计划
|
||||
> 涉及文件：`NetworkPopup.qml`、`NetCommon.qml`、`SettingsWindow.qml`、`networkview.qml`
|
||||
|
||||
## 背景与问题
|
||||
|
||||
当前左键弹窗（`NetworkPopup.qml`）存在以下设计问题（基于截图分析 + 代码阅读）：
|
||||
|
||||
1. **深色模式下文字对比度极低**：卡片背景 `cardBackground` 仅 6% 透明度，在 PanelPopup 自动提供的毛玻璃上几乎不可见，导致区域"糊"在一起，且遮挡了原生通透感。
|
||||
2. **IPv6 地址拥挤**：长 IPv6 地址撑满接口信息卡片，破坏平衡。
|
||||
3. **底部 chip 未选中态过弱**：未选中 chip 用 `cardBackground` 填充几乎不可见，缺乏交互暗示。
|
||||
4. **箭头图标风格不统一**：速度区用圆形底色块 + 文本箭头，累计区用纯文本箭头。
|
||||
5. **冗余标题**：弹窗本身就是网络监控，标题"网络速度监控"浪费空间且字号小发闷。
|
||||
6. **字号层次不足**：速度数值 18px 不够突出，与标签层次差距小。
|
||||
|
||||
### 关键技术发现（librarian 研究）
|
||||
|
||||
`PanelPopup`（dde-shell 源码实测）已自动提供：
|
||||
- **毛玻璃背景**（`enableBlurWindow: true`，透明度跟随系统外观设置）
|
||||
- **圆角**（跟随系统 `windowRadius`，fallback 4px）
|
||||
- **阴影**（偏移 `(0, 25)`，深色 50% 黑 / 浅色 20% 黑）
|
||||
|
||||
官方参考（`PanelPluginPage.qml`）：内容区宽度 330px，内边距 10px，元素间距 10px。DTK 字号表 T3=24px、T6=14px、T7=13px、T8=12px。
|
||||
|
||||
**结论：弹窗内不应自绘背景卡片，应让 PanelPopup 的毛玻璃直接透出，用分隔线 + 留白划分区域。**
|
||||
|
||||
## 设计目标
|
||||
|
||||
- 重新设计布局结构（非仅视觉微调）
|
||||
- 速度与接口信息并重（用户第一眼需求）
|
||||
- Deepin 原生风格（毛玻璃通透、DTK 字号、系统调色板）
|
||||
- 适配用户配置：字体颜色、网卡类型图标、预留字号缩放
|
||||
|
||||
## 设计方案
|
||||
|
||||
选定方案 A：**通透分区，速度为锚点**。去掉所有自绘卡片背景，用分隔线 + 留白划分区域，速度数字放大为视觉锚点。
|
||||
|
||||
### 第 1 节：整体布局结构
|
||||
|
||||
**容器调整**（`networkview.qml`）：
|
||||
- `PanelPopup` 宽度从 360 -> **330px**（对齐官方 `PanelPluginPage` 参考值）
|
||||
- 高度从固定 320 -> **跟随内容**（预估约 230px，若 PanelPopup 不支持自动高度则 fallback 固定 230）
|
||||
- padding 从 16 -> **12px**，区域间 spacing 12 -> **10px**
|
||||
|
||||
**纵向布局**（4 个分区 + 3 条分隔线，自上而下）：
|
||||
|
||||
```
|
||||
┌───────────────────────────────┐
|
||||
│ 接口信息区 (次要) │ 行1: ∿ wlp3s0 · 192.168.3.83
|
||||
│ │ 行2: IPv6 截断显示 + tooltip
|
||||
│ ───────────────────────────── │ ← 分隔线1
|
||||
│ 速度区 (锚点, 最大视觉权重) │ ↓ 4.11 KB/s ↑ 3.55 KB/s
|
||||
│ ───────────────────────────── │ ← 分隔线2
|
||||
│ 累计流量区 (紧凑) │ 总计 ↓ 4.85 GB ↑ 134 MB
|
||||
│ ───────────────────────────── │ ← 分隔线3
|
||||
│ 接口切换 chip 区 │ [enp2s0] [wlp3s0] [Meta]
|
||||
└───────────────────────────────┘
|
||||
```
|
||||
|
||||
**关键变化**：
|
||||
- 去掉冗余标题"网络速度监控"
|
||||
- 移除所有自绘卡片 `Rectangle` 背景填充，毛玻璃直接透出
|
||||
- 分隔线用 `cardBorder` 色（0.10 透明度）1px 横线，替代原来的卡片边界
|
||||
|
||||
### 第 2 节：配色与字体层次
|
||||
|
||||
保留 `NetCommon.qml` 的颜色定义和格式化函数不变（networkview.qml 和 TrafficChartWindow 共享），仅改 `NetworkPopup.qml` 内的使用方式。
|
||||
|
||||
| 元素 | 颜色 | 字号(DTK) | 字重 |
|
||||
|---|---|---|---|
|
||||
| 接口名 `wlp3s0` | `primaryText`(用户色或0.95) | T7(13px) | Normal |
|
||||
| 接口类型图标 `∿` | `tertiaryText`(0.65) | T8(12px) | Normal |
|
||||
| IPv4 地址 | `secondaryText`(0.80) | T7(13px) | Normal |
|
||||
| IPv6 地址 | `tertiaryText`(0.65) | T8(12px) | Normal |
|
||||
| 下载/上传标签 `下载` | `secondaryText`(0.80) | T8(12px) | Normal |
|
||||
| **速度数值** `4.11` | **蓝/绿强调色**(下载带阈值变色) | **T3(24px)** | **Bold** |
|
||||
| 速度单位 `KB/s` | 强调色(同数值) | T7(13px) | Normal |
|
||||
| `总计` 标签 | `tertiaryText`(0.65) | T8(12px) | Normal |
|
||||
| 累计数值 | `primaryText`(用户色或0.95) | T7(13px) | Normal |
|
||||
| 累计箭头 `↓↑` | 蓝/绿强调色 | T8(12px) | Bold |
|
||||
| chip 选中文字 | white | T8(12px) | Bold |
|
||||
| chip 未选中文字 | `primaryText`(用户色或0.95) | T8(12px) | Normal |
|
||||
| 分隔线 | `cardBorder`(0.10) | - | - |
|
||||
|
||||
**关键变化**：
|
||||
1. 速度数字从 18px -> 24px(T3)，成为绝对视觉锚点
|
||||
2. 箭头图标统一为文本符号（去掉速度区的 32x32 圆形底色块），速度区和累计区风格一致
|
||||
3. 速度数值和单位拆分显示：`4.11` 大号粗体 + `KB/s` 小号
|
||||
4. 下载值保留阈值变色逻辑（>10MB/s 红、>1MB/s 橙、否则蓝），上传固定绿
|
||||
|
||||
### 第 3 节：各分区内部布局细节
|
||||
|
||||
#### 3.1 接口信息区（顶部）
|
||||
|
||||
```
|
||||
│ ∿ wlp3s0 · 192.168.3.83 │ 行1: 类型图标 + 接口名 + 中点 + IPv4
|
||||
│ IPv6 2408:823c:9c12:a69:...:3 │ 行2: IPv6 截断显示
|
||||
```
|
||||
|
||||
- 行1：接口类型图标 + 接口名 + `·` + IPv4，用 `secondaryText`/`tertiaryText`，T7 13px
|
||||
- 行2：`IPv6` 标签 + 地址。地址超长时截断显示，末尾加 `…`，hover 显示完整地址 tooltip
|
||||
- 整体水平居中，垂直间距 4px
|
||||
- 无 IPv6 时只显示行1
|
||||
|
||||
#### 3.2 速度区（锚点）
|
||||
|
||||
```
|
||||
│ ↓ 4.11 KB/s ↑ 3.55 KB/s │
|
||||
```
|
||||
|
||||
- 双栏等宽，中间无竖线（靠留白区分）
|
||||
- 每栏内部布局：
|
||||
```
|
||||
下载 (T8 12px, secondaryText, 居中)
|
||||
↓ 4.11 KB/s (↓+数值 T3 24px Bold 强调色, KB/s T7 13px)
|
||||
```
|
||||
- 下载/上传标签在上方居中小字，下方是箭头 + 大号数值 + 小号单位
|
||||
|
||||
#### 3.3 累计流量区
|
||||
|
||||
```
|
||||
│ 总计 ↓ 4.85 GB ↑ 134 MB │
|
||||
```
|
||||
|
||||
- 单行紧凑，水平居中
|
||||
- `总计` 标签 tertiaryText，箭头蓝/绿强调色 Bold，数值 primaryText
|
||||
|
||||
#### 3.4 接口切换 chip 区
|
||||
|
||||
```
|
||||
│ [enp2s0] [wlp3s0] [Meta] │
|
||||
```
|
||||
|
||||
- chip 样式重做：
|
||||
- **选中态**：蓝色填充背景 `accentBlue` + 白字 + 蓝色边框（保持不变）
|
||||
- **未选中态**：**透明背景** + `cardBorder` 边框 + primaryText 文字（原来是 cardBackground 填充几乎不可见）
|
||||
- hover：边框变 `accentBlue`，文字变 `accentBlue`
|
||||
- 宽度逻辑、滚动逻辑、`scrollToActiveChip`、`sortedInterfaces`、`Connections` 全部保留不变
|
||||
|
||||
#### 3.5 分隔线
|
||||
|
||||
- 3 条横线，分别在：接口区下方、速度区下方、累计区下方
|
||||
- 颜色 `cardBorder`(0.10 透明度)，高度 1px，撑满 padding 内宽度
|
||||
|
||||
### 第 4 节：错误态与尺寸约束
|
||||
|
||||
#### 4.1 未检测到接口的占位态
|
||||
|
||||
```
|
||||
┌───────────────────────────────┐
|
||||
│ ⚠ │ (T1 40px, tertiaryText)
|
||||
│ 未检测到网络接口 │ (T6 14px, secondaryText)
|
||||
└───────────────────────────────┘
|
||||
```
|
||||
|
||||
- 去掉卡片背景填充，直接在毛玻璃上居中
|
||||
- 警告图标从 24px -> 40px(T1)，更醒目
|
||||
- 占位态时不显示分隔线、速度区、累计区、chip 区
|
||||
|
||||
#### 4.2 尺寸与高度自适应
|
||||
|
||||
- 宽度固定 330px（`networkview.qml` 的 `PanelPopup` 设置）
|
||||
- 高度跟随内容（预估约 230px）。各分区预估高度：
|
||||
- 接口区：~40px（两行）
|
||||
- 分隔线：1px + 上下 10px spacing
|
||||
- 速度区：~60px（标签 + 大号数值）
|
||||
- 累计区：~30px
|
||||
- chip 区：40px
|
||||
- padding 上下各 12px
|
||||
- 合计：~213px
|
||||
- 若 PanelPopup 不支持自动高度，fallback 为固定 `height: 230`
|
||||
|
||||
### 第 5 节：可配置适配
|
||||
|
||||
#### 5.1 字体颜色适配（仅主要文字跟随用户色）
|
||||
|
||||
`NetworkPopup.qml` 新增属性覆盖：
|
||||
|
||||
```qml
|
||||
// 用户自定义字体色（来自 C++ 后端 applet.textColor，持久化到 settings.ini）
|
||||
// 非空时覆盖 primaryText，空串时回退到 DTK 调色板派生（保持自适应）
|
||||
readonly property string userTextColor: applet ? applet.textColor : ""
|
||||
readonly property color primaryText: userTextColor.length > 0
|
||||
? Qt.rgba(userTextColor.r, userTextColor.g, userTextColor.b, 0.95)
|
||||
: common.primaryText
|
||||
```
|
||||
|
||||
**跟随范围**（用 `popup.primaryText` 的元素）：
|
||||
- 接口名 `wlp3s0`
|
||||
- 速度数值 `4.11`（注意：下载值有阈值变色逻辑，用户色不覆盖蓝/橙/红阈值色，仅覆盖"未超阈值"时的回退色）
|
||||
- 累计数值 `4.85 GB`
|
||||
- chip 未选中文字
|
||||
|
||||
**不跟随**（仍从 `common` 取 DTK 派生）：
|
||||
- `secondaryText`（IPv4、标签）
|
||||
- `tertiaryText`（IPv6、总计标签）
|
||||
- 蓝绿强调色（下载/上传箭头、chip 选中态）
|
||||
|
||||
> 用户选了红色时，弹窗的接口名、数值、chip 文字变红，但标签和辅助信息仍保持系统主题色，层次不崩。
|
||||
|
||||
#### 5.2 网卡类型图标（接口信息区）
|
||||
|
||||
**提取公共函数**：将 `SettingsWindow.qml` 中的 `interfaceIcon(name)` 和 `interfaceDescription(name)` 提取到 `NetCommon.qml`，消除重复定义。
|
||||
|
||||
**弹窗接口信息区布局更新**：
|
||||
- 接口名前加类型图标，与设置窗口列表的图标一致
|
||||
- 图标颜色 `tertiaryText`（次要，不抢速度区焦点）
|
||||
- 图标字号 T8(12px)，与接口名行对齐
|
||||
|
||||
#### 5.3 字号缩放预留（fontScale）
|
||||
|
||||
`NetworkPopup.qml` 新增属性：
|
||||
|
||||
```qml
|
||||
// 字号缩放因子：默认 1.0，后续 C++ 后端新增 applet.fontScale 后绑定
|
||||
// 所有字号 = 基准字号 × fontScale，实现全局字号调节
|
||||
readonly property real fontScale: (applet && applet.fontScale !== undefined)
|
||||
? applet.fontScale : 1.0
|
||||
```
|
||||
|
||||
**所有 `font.pixelSize` 改为缩放形式**：
|
||||
|
||||
| 元素 | 基准字号 | 缩放后 |
|
||||
|---|---|---|
|
||||
| 速度数值 | 24 | `Math.round(24 * fontScale)` |
|
||||
| 速度单位 | 13 | `Math.round(13 * fontScale)` |
|
||||
| 接口名/IPv4 | 13 | `Math.round(13 * fontScale)` |
|
||||
| IPv6/标签/箭头 | 12 | `Math.round(12 * fontScale)` |
|
||||
| chip 文字 | 12 | `Math.round(12 * fontScale)` |
|
||||
| 占位图标 | 40 | `Math.round(40 * fontScale)` |
|
||||
| 占位文字 | 14 | `Math.round(14 * fontScale)` |
|
||||
|
||||
**当前状态**：`applet.fontScale` 尚不存在，`fontScale` 恒为 1.0，视觉无变化。后续 C++ 后端加属性 + 设置窗口加选项后即可生效，弹窗代码无需再改。
|
||||
|
||||
## 影响范围
|
||||
|
||||
| 文件 | 改动 |
|
||||
|---|---|
|
||||
| `NetCommon.qml` | 新增 `interfaceIcon`/`interfaceDescription` 公共函数（从 SettingsWindow 迁移） |
|
||||
| `NetworkPopup.qml` | 重写布局（主体工作）+ 新增 `userTextColor`/`fontScale`/`primaryText` 覆盖 |
|
||||
| `SettingsWindow.qml` | `interfaceIcon`/`interfaceDescription` 改为调用 `common.xxx`（消除本地重复定义） |
|
||||
| `networkview.qml` | 仅改 `PanelPopup` 的 width/height 两个数值 |
|
||||
| C++ 后端 | **本次不改**（fontScale 预留扩展点，后续再加） |
|
||||
|
||||
## 保持不变的部分
|
||||
|
||||
- `NetCommon.qml` 的颜色定义和格式化函数（networkview.qml 和 TrafficChartWindow 共享）
|
||||
- chip 滚动逻辑、`scrollToActiveChip`、`sortedInterfaces`、`Connections`
|
||||
- `TrafficChartWindow.qml`、`AboutWindow.qml`
|
||||
- C++ 后端
|
||||
- 深浅主题适配机制（颜色派生自 `DTK.palette.windowText`，自动切换）
|
||||
|
||||
## 验证方式
|
||||
|
||||
本项目无测试/lint/CI 目标，验证为手动：
|
||||
1. `cmake -B build && cmake --build build && sudo cmake --install build`
|
||||
2. `systemctl --user restart dde-shell@DDE`
|
||||
3. 左键点击任务栏网络监控图标，检查弹窗：
|
||||
- 毛玻璃通透，无卡片填充色块
|
||||
- 速度数字 24px 为视觉锚点
|
||||
- 接口信息区显示类型图标
|
||||
- chip 未选中态有清晰边框
|
||||
- 分隔线划分四个区域
|
||||
4. 深色/浅色模式切换，检查文字对比度
|
||||
5. 设置窗口选字体颜色，检查弹窗主要文字是否跟随
|
||||
6. 切换网卡，检查 chip 滚动和接口信息更新
|
||||
@@ -8,13 +8,21 @@
|
||||
// 深/浅主题由 isDarkMode 切换（networkview.qml 依据 DockPalette 检测任务栏深浅后传入），
|
||||
// 默认浅色，保证组件独立预览时与原版视觉一致
|
||||
// 对外依赖：accentColor、isDarkMode，由 networkview.qml 实例化时传入，触发方式为 show()/raise()/requestActivate()
|
||||
// 公共能力复用：主题色取自 WindowTheme，标题栏/圆角卡片取自 TitleBar，消除三窗口样板重复
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import "."
|
||||
|
||||
Window {
|
||||
id: root
|
||||
|
||||
// 公共主题色：集中定义于 WindowTheme.qml，随 isDarkMode 切换深浅
|
||||
WindowTheme {
|
||||
id: theme
|
||||
isDarkMode: root.isDarkMode
|
||||
}
|
||||
|
||||
// 对外依赖：关闭按钮 hover 态文字高亮色，由父组件传入
|
||||
// 默认值与 networkview.qml 中 root.accentRed 一致，确保独立可用
|
||||
property color accentColor: Qt.rgba(220 / 255, 38 / 255, 38 / 255, 1)
|
||||
@@ -27,14 +35,6 @@ Window {
|
||||
// 默认 false（浅色）保证组件独立预览时与原版视觉一致
|
||||
property bool isDarkMode: false
|
||||
|
||||
// ---- 主题感知颜色：isDarkMode 为 false 时取值与原浅色硬编码完全一致 ----
|
||||
readonly property color winBg: isDarkMode ? "#202020" : "#FFFFFF"
|
||||
readonly property color cardBg: isDarkMode ? "#2A2A2A" : "#FFFFFF"
|
||||
readonly property color lineColor: isDarkMode ? "#383838" : "#E8E8E8"
|
||||
readonly property color textPrimary: isDarkMode ? "#E0E0E0" : "#333333"
|
||||
readonly property color textSecondary: isDarkMode ? "#AAAAAA" : "#666666"
|
||||
readonly property color textTertiary: isDarkMode ? "#888888" : "#999999"
|
||||
|
||||
// 复制成功状态标记：true 时复制图标变绿并显示"已复制"提示，
|
||||
// 2 秒后由 copyResetTimer 复位
|
||||
property bool copied: false
|
||||
@@ -58,63 +58,22 @@ Window {
|
||||
// 窗口主体：圆角卡片（背景与边框随 isDarkMode 切换深浅），1px 边框模拟 DTK 窗口描边
|
||||
Rectangle {
|
||||
anchors.fill: parent
|
||||
color: root.winBg
|
||||
color: theme.winBg
|
||||
radius: 12
|
||||
border.width: 1
|
||||
border.color: root.lineColor
|
||||
border.color: theme.lineColor
|
||||
|
||||
ColumnLayout {
|
||||
anchors.fill: parent
|
||||
spacing: 0
|
||||
|
||||
// 自定义标题栏：左侧"关于"标题 + 右侧圆形关闭按钮，整栏可拖动窗口
|
||||
Rectangle {
|
||||
// 公共标题栏：标题文字 + 圆形关闭按钮，整栏可拖动
|
||||
TitleBar {
|
||||
Layout.fillWidth: true
|
||||
Layout.preferredHeight: 44
|
||||
color: "transparent"
|
||||
|
||||
// 拖动层：声明在关闭按钮之前（位于其下方），避免遮挡按钮点击与 hover
|
||||
MouseArea {
|
||||
anchors.fill: parent
|
||||
drag.target: root
|
||||
}
|
||||
|
||||
Text {
|
||||
anchors.left: parent.left
|
||||
anchors.leftMargin: 16
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
text: qsTr("About")
|
||||
font.pixelSize: 15
|
||||
font.weight: Font.Bold
|
||||
color: root.textPrimary
|
||||
}
|
||||
|
||||
// 关闭按钮：28x28 圆形，hover 时淡红底 + 红色 ×（颜色由 accentColor 决定）
|
||||
Rectangle {
|
||||
anchors.right: parent.right
|
||||
anchors.rightMargin: 12
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
width: 28
|
||||
height: 28
|
||||
radius: 14
|
||||
color: aboutCloseMouse.containsMouse ? Qt.rgba(220 / 255, 38 / 255, 38 / 255, 0.15) : "transparent"
|
||||
|
||||
Text {
|
||||
anchors.centerIn: parent
|
||||
text: "×"
|
||||
font.pixelSize: 20
|
||||
font.weight: Font.Bold
|
||||
color: aboutCloseMouse.containsMouse ? accentColor : root.textSecondary
|
||||
}
|
||||
|
||||
MouseArea {
|
||||
id: aboutCloseMouse
|
||||
anchors.fill: parent
|
||||
hoverEnabled: true
|
||||
cursorShape: Qt.PointingHandCursor
|
||||
onClicked: root.hide()
|
||||
}
|
||||
}
|
||||
titleText: qsTr("About")
|
||||
textColor: theme.textPrimary
|
||||
secondaryTextColor: theme.textSecondary
|
||||
closeHoverColor: root.accentColor
|
||||
}
|
||||
|
||||
// 标题区上方间距
|
||||
@@ -133,7 +92,7 @@ Window {
|
||||
text: qsTr("Network Speed Monitor")
|
||||
font.pixelSize: 18
|
||||
font.weight: Font.Bold
|
||||
color: root.textPrimary
|
||||
color: theme.textPrimary
|
||||
Layout.fillWidth: true
|
||||
horizontalAlignment: Text.AlignHCenter
|
||||
}
|
||||
@@ -141,7 +100,7 @@ Window {
|
||||
Text {
|
||||
text: "JNetApplet"
|
||||
font.pixelSize: 12
|
||||
color: root.textTertiary
|
||||
color: theme.textTertiary
|
||||
Layout.fillWidth: true
|
||||
horizontalAlignment: Text.AlignHCenter
|
||||
}
|
||||
@@ -158,7 +117,7 @@ Window {
|
||||
Layout.leftMargin: 24
|
||||
Layout.rightMargin: 24
|
||||
Layout.preferredHeight: 1
|
||||
color: root.lineColor
|
||||
color: theme.lineColor
|
||||
}
|
||||
|
||||
// 信息区上方间距
|
||||
@@ -189,7 +148,7 @@ Window {
|
||||
Text {
|
||||
text: version
|
||||
font.pixelSize: 12
|
||||
color: root.textPrimary
|
||||
color: theme.textPrimary
|
||||
Layout.fillWidth: true
|
||||
}
|
||||
}
|
||||
@@ -210,7 +169,7 @@ Window {
|
||||
Text {
|
||||
text: "Jokul"
|
||||
font.pixelSize: 12
|
||||
color: root.textPrimary
|
||||
color: theme.textPrimary
|
||||
Layout.fillWidth: true
|
||||
}
|
||||
}
|
||||
@@ -231,7 +190,7 @@ Window {
|
||||
Text {
|
||||
text: qsTr("Monitor network speed and traffic")
|
||||
font.pixelSize: 12
|
||||
color: root.textPrimary
|
||||
color: theme.textPrimary
|
||||
Layout.fillWidth: true
|
||||
wrapMode: Text.WordWrap
|
||||
}
|
||||
@@ -253,7 +212,7 @@ Window {
|
||||
Text {
|
||||
text: "git.jokul.space/Jokul/JNetApplet"
|
||||
font.pixelSize: 11
|
||||
color: root.textTertiary
|
||||
color: theme.textTertiary
|
||||
Layout.fillWidth: true
|
||||
wrapMode: Text.WrapAnywhere
|
||||
}
|
||||
@@ -274,7 +233,7 @@ Window {
|
||||
width: copiedHintText.implicitWidth + 10
|
||||
height: 18
|
||||
radius: 4
|
||||
color: root.cardBg
|
||||
color: theme.cardBg
|
||||
border.width: 1
|
||||
border.color: "#22A34A"
|
||||
|
||||
@@ -310,9 +269,9 @@ Window {
|
||||
width: 10
|
||||
height: 10
|
||||
radius: 2
|
||||
color: root.cardBg
|
||||
color: theme.cardBg
|
||||
border.width: 1
|
||||
border.color: copyRepoMouse.containsMouse ? root.textPrimary : root.textTertiary
|
||||
border.color: copyRepoMouse.containsMouse ? theme.textPrimary : theme.textTertiary
|
||||
}
|
||||
|
||||
// 前层矩形（左上），复制成功时边框短暂变绿
|
||||
@@ -322,9 +281,9 @@ Window {
|
||||
width: 10
|
||||
height: 10
|
||||
radius: 2
|
||||
color: root.cardBg
|
||||
color: theme.cardBg
|
||||
border.width: 1
|
||||
border.color: copied ? "#22A34A" : (copyRepoMouse.containsMouse ? root.textPrimary : root.textTertiary)
|
||||
border.color: copied ? "#22A34A" : (copyRepoMouse.containsMouse ? theme.textPrimary : theme.textTertiary)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -79,4 +79,58 @@ QtObject {
|
||||
return (bytes / (1024 * 1024 * 1024)).toFixed(2) + " GB"
|
||||
}
|
||||
}
|
||||
|
||||
// 根据接口名返回类型图标（Unicode 符号），用于网络接口列表和弹窗接口信息区
|
||||
// 设计原因：项目未引入图标库，用 Text 渲染 Unicode 符号（与 ↓↑ 一致）；
|
||||
// 所选符号均为 DejaVu/Noto 等常见字体覆盖的单色字形，避免彩色 emoji 破坏浅色主题观感
|
||||
function interfaceIcon(name) {
|
||||
if (name === "lo") return "↻" // 本地回环：循环箭头
|
||||
if (name === "Meta") return "▢" // 虚拟接口：空心方块
|
||||
if (/^enp|^eth/.test(name)) return "⇄" // 有线网络：双向链路
|
||||
if (/^wlp|^wlan/.test(name)) return "∿" // 无线网络：信号波形
|
||||
if (/^docker|^veth/.test(name)) return "▣" // 容器网络：盒中盒
|
||||
if (/^br/.test(name)) return "⋈" // 桥接：连接
|
||||
if (/^tun|^tap/.test(name)) return "⚿" // VPN：钥匙
|
||||
if (/^virbr/.test(name)) return "⋈" // 虚拟桥接：同桥接
|
||||
return "◉" // 其他：通用网络节点
|
||||
}
|
||||
|
||||
// 根据接口名返回类型描述，用于设置窗口网络接口列表和弹窗 tooltip
|
||||
// 设计原因：用户面对多个网口时难以仅凭 enp3s0/wlp3s0 等命名判断用途，
|
||||
// 加一行类型说明（有线/无线/VPN 等）降低认知负担
|
||||
function interfaceDescription(name) {
|
||||
if (name === "lo") return qsTr("Loopback")
|
||||
if (name === "Meta") return qsTr("Virtual Interface")
|
||||
if (/^enp|^eth/.test(name)) return qsTr("Wired Network")
|
||||
if (/^wlp|^wlan/.test(name)) return qsTr("Wireless Network")
|
||||
if (/^docker|^veth/.test(name)) return qsTr("Container Network")
|
||||
if (/^br/.test(name)) return qsTr("Bridge")
|
||||
if (/^tun|^tap/.test(name)) return qsTr("VPN")
|
||||
if (/^virbr/.test(name)) return qsTr("Virtual Bridge")
|
||||
return qsTr("Other")
|
||||
}
|
||||
|
||||
// 拆分速度字符串为数值部分：formatSpeed 返回 "4.11 KB/s"，本函数返回 "4.11"
|
||||
// 设计原因：弹窗速度区需将数值（大号粗体）与单位（小号）拆分显示以增强层次感
|
||||
function formatSpeedValue(bytesPerSec) {
|
||||
var str = formatSpeed(bytesPerSec)
|
||||
var idx = str.indexOf(' ')
|
||||
return idx < 0 ? str : str.substring(0, idx)
|
||||
}
|
||||
|
||||
// 拆分速度字符串为单位部分：formatSpeed 返回 "4.11 KB/s"，本函数返回 "KB/s"
|
||||
function formatSpeedUnit(bytesPerSec) {
|
||||
var str = formatSpeed(bytesPerSec)
|
||||
var idx = str.indexOf(' ')
|
||||
return idx < 0 ? "" : str.substring(idx + 1)
|
||||
}
|
||||
|
||||
// 格式化链路协商速率（Mbps 输入）：>=1000 显示 Gbps（保留 1 位小数），否则显示 Mbps
|
||||
// 设计原因：有线常见 1000/2500 Mbps，无线常见 866 Mbps，按阈值切换单位更易读
|
||||
function formatLinkSpeed(mbps) {
|
||||
if (mbps >= 1000) {
|
||||
return (mbps / 1000).toFixed(1) + " Gbps"
|
||||
}
|
||||
return mbps.toFixed(0) + " Mbps"
|
||||
}
|
||||
}
|
||||
|
||||
+433
-164
@@ -3,9 +3,12 @@
|
||||
// SPDX-License-Identifier: LGPL-3.0-or-later
|
||||
|
||||
// 网络速度监控弹窗内容组件
|
||||
// 展示实时速度、总量统计、网卡切换 chip 列表；
|
||||
// 由 networkview.qml 的 PanelPopup 实例化，传入 applet 属性；
|
||||
// 通透分区布局：去掉自绘卡片背景，用分隔线+留白划分四个区域
|
||||
// （接口信息 / 实时速度 / 累计流量 / 接口切换），速度数字放大为视觉锚点
|
||||
// 由 networkview.qml 的 PanelPopup 实例化，传入 applet 属性
|
||||
// 毛玻璃背景、圆角、阴影由 PanelPopup 自动提供，本组件不自绘背景
|
||||
// 颜色与格式化函数统一取自同目录 NetCommon.qml（common.xxx），数据由 applet 提供
|
||||
// 可配置适配：primaryText 跟随用户 textColor
|
||||
// 设计原因：PanelPopup 是 dock 上下文类型，不能作为独立组件根元素，
|
||||
// 因此本组件用 Control 作为根，由 networkview.qml 的 PanelPopup 包裹
|
||||
|
||||
@@ -19,13 +22,15 @@ import "."
|
||||
Control {
|
||||
id: popup
|
||||
|
||||
// 公共颜色与格式化函数：集中定义于同目录 NetCommon.qml，
|
||||
// 与 networkview.qml、TrafficChartWindow 共享同一份实现，消除跨组件重复定义
|
||||
NetCommon { id: common }
|
||||
|
||||
// C++ 后端对象，提供速度/接口/IP 等所有数据
|
||||
property var applet: null
|
||||
|
||||
// 公共颜色与格式化函数：由 networkview.qml 传入 dock 上下文的 NetCommon 实例
|
||||
// 设计原因：PanelPopup 是独立窗口上下文，在此上下文求值 DTK.palette.windowText
|
||||
// 深色模式下返回深色文字（与 dock 面板上下文不同），导致深底深字；
|
||||
// 传入 dock 上下文的 common 实例，颜色在 dock 面板上下文求值，深色模式正确返回浅色文字
|
||||
property var common: null
|
||||
|
||||
readonly property bool ready: applet ? applet.ready : false
|
||||
readonly property real downloadSpeed: applet ? applet.downloadSpeed : 0
|
||||
readonly property real uploadSpeed: applet ? applet.uploadSpeed : 0
|
||||
@@ -38,25 +43,44 @@ Control {
|
||||
readonly property string ipv6Address: applet ? (applet.ipv6Address || "") : ""
|
||||
readonly property var networkInterfaces: applet ? (applet.networkInterfaces || []) : []
|
||||
|
||||
// 弹窗颜色别名：转发 common 的公共颜色（派生自 DTK 系统调色板 windowText，
|
||||
// 主题适配的设计原因见 NetCommon.qml 文件头注释），保持下游 popup.xxx 引用不变
|
||||
readonly property color primaryText: common.primaryText
|
||||
// 活动接口的收发包/错误/丢包累计统计（自开机起），由 C++ 后端持续更新
|
||||
readonly property real rxPackets: applet ? (applet.rxPackets || 0) : 0
|
||||
readonly property real txPackets: applet ? (applet.txPackets || 0) : 0
|
||||
readonly property real rxErrors: applet ? (applet.rxErrors || 0) : 0
|
||||
readonly property real txErrors: applet ? (applet.txErrors || 0) : 0
|
||||
readonly property real rxDropped: applet ? (applet.rxDropped || 0) : 0
|
||||
readonly property real txDropped: applet ? (applet.txDropped || 0) : 0
|
||||
|
||||
// 活动接口的链路协商速率（Mbps），由 C++ 后端低频检测；0 表示不可用
|
||||
readonly property int linkSpeed: applet ? (applet.linkSpeed || 0) : 0
|
||||
// 当前活动接口的 TCP ESTABLISHED 连接数，由 C++ 后端每秒统计
|
||||
readonly property int tcpConnections: applet ? (applet.tcpConnections || 0) : 0
|
||||
// 活动接口的 WiFi 信号强度（dBm，负值），由 C++ 后端低频检测；0 表示不可用
|
||||
readonly property int wifiSignal: applet ? (applet.wifiSignal || 0) : 0
|
||||
|
||||
// 用户自定义字体色：非空时覆盖 primaryText，空串回退 DTK 调色板派生
|
||||
// 仅作用于主要文字（接口名、速度数值、累计数值、chip 未选中文字）
|
||||
// secondaryText/tertiaryText/强调色不跟随，保持系统主题层次不崩
|
||||
readonly property string userTextColor: applet ? (applet.textColor || "") : ""
|
||||
readonly property color primaryText: userTextColor.length > 0
|
||||
? Qt.rgba(Qt.color(userTextColor).r, Qt.color(userTextColor).g, Qt.color(userTextColor).b, 0.95)
|
||||
: common.primaryText
|
||||
|
||||
// 次要/三级文字与卡片边框仍从 common 取 DTK 派生值，不跟随用户色
|
||||
readonly property color secondaryText: common.secondaryText
|
||||
readonly property color tertiaryText: common.tertiaryText
|
||||
readonly property color cardBackground: common.cardBackground
|
||||
readonly property color cardBorder: common.cardBorder
|
||||
|
||||
// 强调色别名：下载蓝、上传绿，是面板的主视觉区分
|
||||
// 强调色：下载蓝、上传绿，是面板的主视觉区分
|
||||
readonly property color accentBlue: common.accentBlue
|
||||
readonly property color accentBlueLight: common.accentBlueLight
|
||||
readonly property color accentGreen: common.accentGreen
|
||||
readonly property color accentGreenLight: common.accentGreenLight
|
||||
|
||||
// 上传值颜色：固定绿色，不做高速警示
|
||||
// 下载值颜色带阈值逻辑（>10MB/s 红、>1MB/s 橙、否则蓝），已提取为
|
||||
// common.downloadValueColor(speed) 函数，在使用处直接传入 downloadSpeed 调用
|
||||
readonly property color uploadValueColor: common.uploadValueColor
|
||||
|
||||
// 复制反馈状态：记录刚复制的字段（"ipv4"/"ipv6"/""），用于图标切换为 ✓
|
||||
property string copiedField: ""
|
||||
|
||||
// 排序后的接口列表：物理网卡在前，虚拟网卡在后，各自按名称排序
|
||||
// 设计原因：保持稳定排序，活动接口不再移到最前，避免切换网卡时 chip 顺序跳动；
|
||||
// 活动 chip 若被截断，由 chipFlickable 自动滚动露出完整样式；
|
||||
@@ -80,82 +104,238 @@ Control {
|
||||
chipFlickable.scrollToActiveChip(animated)
|
||||
}
|
||||
|
||||
padding: 16
|
||||
// 一键复制：用隐藏 TextEdit 的 selectAll()+copy() 写入系统剪贴板
|
||||
// QML 无直接剪贴板 API，此为项目既定模式（SettingsWindow/AboutWindow 同模式）
|
||||
function copyToClipboard(text) {
|
||||
clipboardHelper.text = text
|
||||
clipboardHelper.selectAll()
|
||||
clipboardHelper.copy()
|
||||
}
|
||||
|
||||
padding: 12
|
||||
|
||||
contentItem: ColumnLayout {
|
||||
spacing: 12
|
||||
|
||||
// 标题栏：标题在上，网卡名+IP 在卡片底色背景内
|
||||
Item {
|
||||
Layout.fillWidth: true
|
||||
Layout.preferredHeight: 72
|
||||
spacing: 10
|
||||
|
||||
// ==================== 占位态：未检测到接口 ====================
|
||||
// 占位时只显示警告图标+文字，不显示其他分区和分隔线
|
||||
ColumnLayout {
|
||||
anchors.centerIn: parent
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
Layout.preferredHeight: 80
|
||||
spacing: 6
|
||||
visible: !popup.ready
|
||||
|
||||
Text {
|
||||
text: qsTr("Network Speed Monitor")
|
||||
font.pixelSize: 15
|
||||
font.weight: Font.Bold
|
||||
color: popup.primaryText
|
||||
text: "⚠"
|
||||
font.pixelSize: 40
|
||||
color: popup.tertiaryText
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
}
|
||||
|
||||
// 网卡名 + IP 地址卡片背景
|
||||
Rectangle {
|
||||
Text {
|
||||
text: qsTr("No network interface detected")
|
||||
font.pixelSize: 14
|
||||
color: popup.secondaryText
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
Layout.preferredWidth: 300
|
||||
// 有 IPv6 时增高以容纳第三行；无 IPv6 时保持原 40px
|
||||
Layout.preferredHeight: popup.ipv6Address ? 54 : 40
|
||||
color: popup.cardBackground
|
||||
radius: 8
|
||||
border.width: 1
|
||||
border.color: popup.cardBorder
|
||||
}
|
||||
}
|
||||
|
||||
// ==================== 分区1：接口信息 ====================
|
||||
// 三行对称结构：行1 接口名（居中），行2 IPv4 地址行，行3 IPv6 地址行
|
||||
// 地址行用固定宽度标签 + 地址 + 复制图标，两行结构对称不会错位
|
||||
// 固定区域高度（按最多 3 行：接口名 16px + IPv4 16px + IPv6 16px + 间距 8px ≈ 56px）：
|
||||
// 无论有无 IP 地址，区域高度恒定，弹窗整体高度不随网卡切换跳动；
|
||||
// 内容用 anchors.top 顶部对齐，接口名行始终在顶部同一垂直位置
|
||||
Item {
|
||||
Layout.fillWidth: true
|
||||
Layout.preferredHeight: 76
|
||||
visible: popup.ready
|
||||
|
||||
ColumnLayout {
|
||||
anchors.centerIn: parent
|
||||
spacing: 0
|
||||
id: ifaceCol
|
||||
anchors.top: parent.top
|
||||
width: parent.width
|
||||
spacing: 4
|
||||
|
||||
// 行1：类型图标 + 接口名（居中）
|
||||
RowLayout {
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
spacing: 4
|
||||
|
||||
// 网卡类型图标：与设置窗口列表图标一致，次要色不抢速度区焦点
|
||||
Text {
|
||||
text: common.interfaceIcon(popup.activeInterface)
|
||||
font.pixelSize: 12
|
||||
color: popup.tertiaryText
|
||||
}
|
||||
|
||||
// 接口名：跟随用户 textColor（primaryText），Spec 5.1 节要求
|
||||
Text {
|
||||
text: popup.activeInterface
|
||||
font.pixelSize: 11
|
||||
color: popup.secondaryText
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
font.pixelSize: 13
|
||||
color: popup.primaryText
|
||||
}
|
||||
|
||||
// 链路协商速率：speed>=1000 显示 Gbps，否则 Mbps；无速率时隐藏
|
||||
Text {
|
||||
text: popup.ipAddress ? qsTr("IPv4: ") + popup.ipAddress : ""
|
||||
font.pixelSize: 13
|
||||
color: popup.secondaryText
|
||||
text: popup.linkSpeed > 0 ? "· " + common.formatLinkSpeed(popup.linkSpeed) : ""
|
||||
font.pixelSize: 12
|
||||
color: popup.tertiaryText
|
||||
visible: popup.linkSpeed > 0
|
||||
}
|
||||
}
|
||||
|
||||
// 行2：IPv4 标签 + 地址 + 复制图标
|
||||
// 与行3 结构对称：标签固定宽度左对齐，地址左对齐，复制图标在右
|
||||
RowLayout {
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
Layout.maximumWidth: 320
|
||||
spacing: 6
|
||||
visible: popup.ipAddress !== ""
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
|
||||
// IPv4 标签：固定宽度，与 IPv6 标签列对齐
|
||||
Text {
|
||||
text: qsTr("IPv4")
|
||||
font.pixelSize: 12
|
||||
color: popup.tertiaryText
|
||||
Layout.preferredWidth: 32
|
||||
horizontalAlignment: Text.AlignLeft
|
||||
}
|
||||
|
||||
// IPv6 全球地址行，无 IPv6 时隐藏不占位
|
||||
// IPv4 地址：超长截断 + hover tooltip
|
||||
Text {
|
||||
text: popup.ipv6Address ? qsTr("IPv6: ") + popup.ipv6Address : ""
|
||||
text: popup.ipAddress
|
||||
font.pixelSize: 13
|
||||
color: popup.secondaryText
|
||||
visible: popup.ipv6Address !== ""
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
elide: Text.ElideRight
|
||||
Layout.fillWidth: true
|
||||
horizontalAlignment: Text.AlignLeft
|
||||
|
||||
ToolTip.text: popup.ipAddress
|
||||
ToolTip.visible: ipv4Mouse.containsMouse && popup.ipAddress !== ""
|
||||
ToolTip.delay: 300
|
||||
|
||||
MouseArea {
|
||||
id: ipv4Mouse
|
||||
anchors.fill: parent
|
||||
hoverEnabled: true
|
||||
cursorShape: Qt.IBeamCursor
|
||||
}
|
||||
}
|
||||
|
||||
// 一键复制图标：点击复制 IPv4 到剪贴板，复制后短暂显示 ✓
|
||||
// 默认态用 primaryText 保证深色背景上清晰可见，hover 变蓝
|
||||
Text {
|
||||
text: popup.copiedField === "ipv4" ? "✓" : "⧉"
|
||||
font.pixelSize: 12
|
||||
color: popup.copiedField === "ipv4"
|
||||
? popup.accentGreen
|
||||
: (ipv4CopyMouse.containsMouse ? popup.accentBlue : popup.primaryText)
|
||||
|
||||
MouseArea {
|
||||
id: ipv4CopyMouse
|
||||
anchors.fill: parent
|
||||
cursorShape: Qt.PointingHandCursor
|
||||
hoverEnabled: true
|
||||
onClicked: {
|
||||
popup.copyToClipboard(popup.ipAddress)
|
||||
popup.copiedField = "ipv4"
|
||||
copyFeedbackTimer.restart()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 实时速度卡片：双列布局，每列内容在各自半区内水平垂直居中
|
||||
// 设计原因：用显式 anchor 分两个等宽半区，比 RowLayout+fillWidth 更可靠，
|
||||
// 确保下载/上传内容各自在左/右半区正中显示
|
||||
// 行3：IPv6 标签 + 地址 + 复制图标
|
||||
// 与行2 结构对称：标签固定宽度左对齐，地址左对齐，复制图标在右
|
||||
RowLayout {
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
Layout.maximumWidth: 320
|
||||
spacing: 6
|
||||
visible: popup.ipv6Address !== ""
|
||||
|
||||
// IPv6 标签：固定宽度，与 IPv4 标签列对齐
|
||||
Text {
|
||||
text: qsTr("IPv6")
|
||||
font.pixelSize: 12
|
||||
color: popup.tertiaryText
|
||||
Layout.preferredWidth: 32
|
||||
horizontalAlignment: Text.AlignLeft
|
||||
}
|
||||
|
||||
// IPv6 地址：超长截断 + hover tooltip 显示完整地址
|
||||
Text {
|
||||
text: popup.ipv6Address
|
||||
font.pixelSize: 12
|
||||
color: popup.tertiaryText
|
||||
elide: Text.ElideRight
|
||||
Layout.fillWidth: true
|
||||
horizontalAlignment: Text.AlignLeft
|
||||
|
||||
ToolTip.text: popup.ipv6Address
|
||||
ToolTip.visible: ipv6Mouse.containsMouse && popup.ipv6Address !== ""
|
||||
ToolTip.delay: 300
|
||||
|
||||
MouseArea {
|
||||
id: ipv6Mouse
|
||||
anchors.fill: parent
|
||||
hoverEnabled: true
|
||||
cursorShape: Qt.IBeamCursor
|
||||
}
|
||||
}
|
||||
|
||||
// 一键复制图标：点击复制 IPv6 到剪贴板，复制后短暂显示 ✓
|
||||
// 默认态用 primaryText 保证深色背景上清晰可见，hover 变蓝
|
||||
Text {
|
||||
text: popup.copiedField === "ipv6" ? "✓" : "⧉"
|
||||
font.pixelSize: 12
|
||||
color: popup.copiedField === "ipv6"
|
||||
? popup.accentGreen
|
||||
: (ipv6CopyMouse.containsMouse ? popup.accentBlue : popup.primaryText)
|
||||
|
||||
MouseArea {
|
||||
id: ipv6CopyMouse
|
||||
anchors.fill: parent
|
||||
cursorShape: Qt.PointingHandCursor
|
||||
hoverEnabled: true
|
||||
onClicked: {
|
||||
popup.copyToClipboard(popup.ipv6Address)
|
||||
popup.copiedField = "ipv6"
|
||||
copyFeedbackTimer.restart()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 行4：WiFi 信号强度（dBm），仅无线接口有信号时显示
|
||||
RowLayout {
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
spacing: 6
|
||||
visible: popup.wifiSignal < 0
|
||||
|
||||
Text {
|
||||
text: qsTr("Signal") + " " + popup.wifiSignal.toFixed(0) + " dBm"
|
||||
font.pixelSize: 12
|
||||
color: popup.tertiaryText
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 分隔线1
|
||||
Rectangle {
|
||||
Layout.fillWidth: true
|
||||
Layout.preferredHeight: 110
|
||||
color: popup.cardBackground
|
||||
radius: 12
|
||||
border.width: 1
|
||||
border.color: popup.cardBorder
|
||||
Layout.preferredHeight: 1
|
||||
color: popup.cardBorder
|
||||
visible: popup.ready
|
||||
}
|
||||
|
||||
// ==================== 分区2：实时速度（视觉锚点） ====================
|
||||
// 双栏等宽，下载左半区、上传右半区，中间靠留白区分无竖线
|
||||
Item {
|
||||
Layout.fillWidth: true
|
||||
Layout.preferredHeight: 60
|
||||
visible: popup.ready
|
||||
|
||||
// 下载半区（左半）
|
||||
Item {
|
||||
@@ -163,55 +343,47 @@ Control {
|
||||
anchors.left: parent.left
|
||||
anchors.top: parent.top
|
||||
anchors.bottom: parent.bottom
|
||||
anchors.leftMargin: 12
|
||||
width: (parent.width - 1) / 2 - 12
|
||||
width: parent.width / 2
|
||||
|
||||
ColumnLayout {
|
||||
anchors.centerIn: parent
|
||||
spacing: 4
|
||||
|
||||
Rectangle {
|
||||
width: 32
|
||||
height: 32
|
||||
radius: 16
|
||||
color: popup.accentBlueLight
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
|
||||
Text {
|
||||
anchors.centerIn: parent
|
||||
text: "↓"
|
||||
font.pixelSize: 18
|
||||
font.weight: Font.Bold
|
||||
color: popup.accentBlue
|
||||
}
|
||||
}
|
||||
spacing: 2
|
||||
|
||||
// 下载标签
|
||||
Text {
|
||||
text: qsTr("Download")
|
||||
font.pixelSize: 11
|
||||
font.pixelSize: 12
|
||||
color: popup.secondaryText
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
}
|
||||
|
||||
// 箭头 + 数值（大号粗体）+ 单位（小号）
|
||||
RowLayout {
|
||||
spacing: 2
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
|
||||
Text {
|
||||
text: common.formatSpeed(popup.downloadSpeed)
|
||||
font.pixelSize: 18
|
||||
text: "↓"
|
||||
font.pixelSize: 24
|
||||
font.weight: Font.Bold
|
||||
color: common.downloadValueColor(popup.downloadSpeed)
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 中间分隔线
|
||||
Rectangle {
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
anchors.top: parent.top
|
||||
anchors.topMargin: 12
|
||||
anchors.bottom: parent.bottom
|
||||
anchors.bottomMargin: 12
|
||||
width: 1
|
||||
color: popup.cardBorder
|
||||
Text {
|
||||
text: common.formatSpeedValue(popup.downloadSpeed)
|
||||
font.pixelSize: 24
|
||||
font.weight: Font.Bold
|
||||
color: common.downloadValueColor(popup.downloadSpeed)
|
||||
}
|
||||
|
||||
Text {
|
||||
text: common.formatSpeedUnit(popup.downloadSpeed)
|
||||
font.pixelSize: 13
|
||||
color: common.downloadValueColor(popup.downloadSpeed)
|
||||
Layout.alignment: Qt.AlignBaseline
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 上传半区（右半）
|
||||
@@ -220,95 +392,201 @@ Control {
|
||||
anchors.right: parent.right
|
||||
anchors.top: parent.top
|
||||
anchors.bottom: parent.bottom
|
||||
anchors.rightMargin: 12
|
||||
width: (parent.width - 1) / 2 - 12
|
||||
width: parent.width / 2
|
||||
|
||||
ColumnLayout {
|
||||
anchors.centerIn: parent
|
||||
spacing: 4
|
||||
|
||||
Rectangle {
|
||||
width: 32
|
||||
height: 32
|
||||
radius: 16
|
||||
color: popup.accentGreenLight
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
|
||||
Text {
|
||||
anchors.centerIn: parent
|
||||
text: "↑"
|
||||
font.pixelSize: 18
|
||||
font.weight: Font.Bold
|
||||
color: popup.accentGreen
|
||||
}
|
||||
}
|
||||
spacing: 2
|
||||
|
||||
// 上传标签
|
||||
Text {
|
||||
text: qsTr("Upload")
|
||||
font.pixelSize: 11
|
||||
font.pixelSize: 12
|
||||
color: popup.secondaryText
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
}
|
||||
|
||||
// 箭头 + 数值（大号粗体）+ 单位（小号）
|
||||
RowLayout {
|
||||
spacing: 2
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
|
||||
Text {
|
||||
text: common.formatSpeed(popup.uploadSpeed)
|
||||
font.pixelSize: 18
|
||||
text: "↑"
|
||||
font.pixelSize: 24
|
||||
font.weight: Font.Bold
|
||||
color: popup.uploadValueColor
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
}
|
||||
|
||||
Text {
|
||||
text: common.formatSpeedValue(popup.uploadSpeed)
|
||||
font.pixelSize: 24
|
||||
font.weight: Font.Bold
|
||||
color: popup.uploadValueColor
|
||||
}
|
||||
|
||||
Text {
|
||||
text: common.formatSpeedUnit(popup.uploadSpeed)
|
||||
font.pixelSize: 13
|
||||
color: popup.uploadValueColor
|
||||
Layout.alignment: Qt.AlignBaseline
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 总量统计：单行紧凑
|
||||
// 分隔线2
|
||||
Rectangle {
|
||||
Layout.fillWidth: true
|
||||
Layout.preferredHeight: 44
|
||||
color: popup.cardBackground
|
||||
radius: 12
|
||||
border.width: 1
|
||||
border.color: popup.cardBorder
|
||||
Layout.preferredHeight: 1
|
||||
color: popup.cardBorder
|
||||
visible: popup.ready
|
||||
}
|
||||
|
||||
// ==================== 分区3：累计流量 ====================
|
||||
// 单行紧凑：总计标签 + 下载箭头/数值 + 上传箭头/数值
|
||||
RowLayout {
|
||||
anchors.fill: parent
|
||||
anchors.margins: 12
|
||||
Layout.fillWidth: true
|
||||
spacing: 8
|
||||
visible: popup.ready
|
||||
|
||||
Item { Layout.fillWidth: true }
|
||||
|
||||
Text {
|
||||
text: qsTr("Total")
|
||||
font.pixelSize: 11
|
||||
font.weight: Font.Bold
|
||||
color: popup.secondaryText
|
||||
font.pixelSize: 12
|
||||
color: popup.tertiaryText
|
||||
}
|
||||
|
||||
Text {
|
||||
text: "↓ " + common.formatTotal(popup.totalDownload)
|
||||
text: "↓"
|
||||
font.pixelSize: 12
|
||||
font.weight: Font.Bold
|
||||
color: popup.accentBlue
|
||||
}
|
||||
|
||||
Text {
|
||||
text: common.formatTotal(popup.totalDownload)
|
||||
font.pixelSize: 13
|
||||
color: popup.primaryText
|
||||
}
|
||||
|
||||
Text {
|
||||
text: "↑ " + common.formatTotal(popup.totalUpload)
|
||||
text: "↑"
|
||||
font.pixelSize: 12
|
||||
font.weight: Font.Bold
|
||||
color: popup.accentGreen
|
||||
}
|
||||
|
||||
Text {
|
||||
text: common.formatTotal(popup.totalUpload)
|
||||
font.pixelSize: 13
|
||||
color: popup.primaryText
|
||||
}
|
||||
|
||||
Item { Layout.fillWidth: true }
|
||||
}
|
||||
|
||||
// 包统计：收发包 + 错误/丢包（累计值，自开机起），紧接累计流量下方
|
||||
// 布局与流量总计行一致：标签 + ↓蓝粗 + 数值 + ↑绿粗 + 数值，拆分为独立 Text
|
||||
// 设计原因：包统计与流量统计同属"累计数据"，放一起信息归属清晰且视觉对称；
|
||||
// 包总数始终显示；错误/丢包仅在存在时显示，避免正常网卡信息过载
|
||||
RowLayout {
|
||||
Layout.fillWidth: true
|
||||
spacing: 8
|
||||
visible: popup.ready
|
||||
|
||||
Item { Layout.fillWidth: true }
|
||||
|
||||
// 包统计标签（与"流量总计"标签对齐）
|
||||
Text {
|
||||
text: qsTr("Packets")
|
||||
font.pixelSize: 12
|
||||
color: popup.tertiaryText
|
||||
}
|
||||
|
||||
// 接口切换 chip 列表：水平滚动，物理网卡在前、虚拟网卡在后，顺序稳定不随切换变化
|
||||
// 接收包数：蓝色下箭头（与流量总计行下载箭头一致）
|
||||
Text {
|
||||
text: "↓"
|
||||
font.pixelSize: 12
|
||||
font.weight: Font.Bold
|
||||
color: popup.accentBlue
|
||||
}
|
||||
|
||||
Text {
|
||||
text: popup.rxPackets.toFixed(0)
|
||||
font.pixelSize: 13
|
||||
color: popup.primaryText
|
||||
}
|
||||
|
||||
// 发送包数：绿色上箭头（与流量总计行上传箭头一致）
|
||||
Text {
|
||||
text: "↑"
|
||||
font.pixelSize: 12
|
||||
font.weight: Font.Bold
|
||||
color: popup.accentGreen
|
||||
}
|
||||
|
||||
Text {
|
||||
text: popup.txPackets.toFixed(0)
|
||||
font.pixelSize: 13
|
||||
color: popup.primaryText
|
||||
}
|
||||
|
||||
// 错误数：仅在存在错误或丢包时显示，格式 "错误 {rxE}/{txE}"
|
||||
Text {
|
||||
text: qsTr("Errors") + " " + popup.rxErrors.toFixed(0) + "/" + popup.txErrors.toFixed(0)
|
||||
font.pixelSize: 12
|
||||
color: popup.tertiaryText
|
||||
visible: popup.rxErrors > 0 || popup.txErrors > 0 || popup.rxDropped > 0 || popup.txDropped > 0
|
||||
}
|
||||
|
||||
// 丢包数：仅在存在错误或丢包时显示，格式 "丢包 {rxD}/{txD}"
|
||||
Text {
|
||||
text: qsTr("Dropped") + " " + popup.rxDropped.toFixed(0) + "/" + popup.txDropped.toFixed(0)
|
||||
font.pixelSize: 12
|
||||
color: popup.tertiaryText
|
||||
visible: popup.rxErrors > 0 || popup.txErrors > 0 || popup.rxDropped > 0 || popup.txDropped > 0
|
||||
}
|
||||
|
||||
Item { Layout.fillWidth: true }
|
||||
}
|
||||
|
||||
// TCP 连接数：仅在连接数>0 时显示，紧跟包统计下方
|
||||
// 设计原因：连接数反映当前网络会话活跃度，是用户关心的即时信息
|
||||
RowLayout {
|
||||
Layout.fillWidth: true
|
||||
spacing: 8
|
||||
visible: popup.ready && popup.tcpConnections > 0
|
||||
|
||||
Item { Layout.fillWidth: true }
|
||||
|
||||
Text {
|
||||
text: qsTr("Connections") + " " + popup.tcpConnections.toFixed(0)
|
||||
font.pixelSize: 12
|
||||
color: popup.tertiaryText
|
||||
}
|
||||
|
||||
Item { Layout.fillWidth: true }
|
||||
}
|
||||
|
||||
// 分隔线3
|
||||
Rectangle {
|
||||
Layout.fillWidth: true
|
||||
Layout.preferredHeight: 1
|
||||
color: popup.cardBorder
|
||||
visible: popup.ready
|
||||
}
|
||||
|
||||
// ==================== 分区4：接口切换 chip 列表 ====================
|
||||
// 水平滚动，物理网卡在前、虚拟网卡在后，顺序稳定不随切换变化
|
||||
// chip 少时分散撑满一行；chip 多超出宽度时固定宽度 + 水平滚动
|
||||
// 活动 chip 不在可视区域或被截断时，自动滚动露出完整样式（见 scrollToActiveChip）
|
||||
Flickable {
|
||||
id: chipFlickable
|
||||
Layout.fillWidth: true
|
||||
// 高度需容纳 chip（28px）+ 水平滚动条（~6px）+ 上下间距，
|
||||
// 此前 32px 仅剩 4px 给滚动条，导致滚动条无法正常显示
|
||||
// 高度需容纳 chip（28px）+ 水平滚动条（~6px）+ 上下间距
|
||||
Layout.preferredHeight: 40
|
||||
visible: popup.ready && popup.networkInterfaces.length > 1
|
||||
contentWidth: Math.max(chipRow.width, width)
|
||||
@@ -387,21 +665,25 @@ Control {
|
||||
width: Math.max(chipFlickable.equalChipWidth, chipText.implicitWidth + 24)
|
||||
height: 28
|
||||
radius: 8
|
||||
// 选中态：蓝色填充+蓝边框；未选中态：透明背景+cardBorder 边框
|
||||
// hover 态：边框变蓝、文字变蓝，提供清晰交互反馈
|
||||
color: modelData === popup.activeInterface
|
||||
? popup.accentBlue
|
||||
: (chipMouse.containsMouse ? popup.accentBlueLight : popup.cardBackground)
|
||||
: "transparent"
|
||||
border.width: 1
|
||||
border.color: modelData === popup.activeInterface
|
||||
? popup.accentBlue
|
||||
: popup.cardBorder
|
||||
: (chipMouse.containsMouse ? popup.accentBlue : popup.cardBorder)
|
||||
|
||||
Text {
|
||||
id: chipText
|
||||
anchors.centerIn: parent
|
||||
text: modelData
|
||||
font.pixelSize: 11
|
||||
font.pixelSize: 12
|
||||
font.weight: modelData === popup.activeInterface ? Font.Bold : Font.Normal
|
||||
color: modelData === popup.activeInterface ? "white" : popup.primaryText
|
||||
color: modelData === popup.activeInterface
|
||||
? "white"
|
||||
: (chipMouse.containsMouse ? popup.accentBlue : popup.primaryText)
|
||||
}
|
||||
|
||||
MouseArea {
|
||||
@@ -434,36 +716,23 @@ Control {
|
||||
}
|
||||
}
|
||||
|
||||
// 未检测到接口占位
|
||||
Rectangle {
|
||||
Layout.fillWidth: true
|
||||
Layout.preferredHeight: 80
|
||||
color: popup.cardBackground
|
||||
radius: 12
|
||||
border.width: 1
|
||||
border.color: popup.cardBorder
|
||||
visible: !popup.ready
|
||||
|
||||
ColumnLayout {
|
||||
anchors.centerIn: parent
|
||||
spacing: 6
|
||||
|
||||
Text {
|
||||
text: "⚠"
|
||||
font.pixelSize: 24
|
||||
color: popup.secondaryText
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
}
|
||||
|
||||
Text {
|
||||
text: qsTr("No network interface detected")
|
||||
font.pixelSize: 12
|
||||
color: popup.secondaryText
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 填充剩余空间，将内容推至顶部
|
||||
Item { Layout.fillHeight: true }
|
||||
}
|
||||
|
||||
// 隐藏的 TextEdit 用于复制 IP 地址到剪贴板
|
||||
// QML 没有直接剪贴板 API，用 TextEdit.selectAll()+copy() 实现
|
||||
//（与 SettingsWindow/AboutWindow 中 clipboardHelper 同模式）
|
||||
TextEdit {
|
||||
id: clipboardHelper
|
||||
visible: false
|
||||
text: ""
|
||||
}
|
||||
|
||||
// 复制反馈定时器：2 秒后将 copiedField 清空，图标从 ✓ 恢复为 ⧉
|
||||
Timer {
|
||||
id: copyFeedbackTimer
|
||||
interval: 2000
|
||||
onTriggered: popup.copiedField = ""
|
||||
}
|
||||
}
|
||||
|
||||
@@ -9,14 +9,30 @@
|
||||
// 对外依赖：applet（C++ 后端对象）、networkInterfaces（接口列表）、activeInterface（当前接口）、
|
||||
// accentColor（强调色）、isDarkMode（深色模式标记），由 networkview.qml 实例化时传入，
|
||||
// 触发方式为 show()/raise()/requestActivate()
|
||||
// 公共能力复用：主题色取自 WindowTheme（本窗口 winBg 浅色 #F5F5F5、lineColor 浅色
|
||||
// #E0E0E0 与其他窗口不同，通过覆盖 WindowTheme 的浅色对实现），标题栏/圆角卡片取自 TitleBar
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Controls 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
import "."
|
||||
|
||||
Window {
|
||||
id: root
|
||||
|
||||
// 公共函数：interfaceIcon/interfaceDescription 已从本文件迁移至 NetCommon.qml，
|
||||
// 与 NetworkPopup 共享同一份实现，消除跨组件重复定义
|
||||
NetCommon { id: common }
|
||||
|
||||
// 公共主题色：集中定义于 WindowTheme.qml，随 isDarkMode 切换深浅。
|
||||
// 本窗口 winBg 浅色 #F5F5F5、lineColor 浅色 #E0E0E0 与默认值不同，在此覆盖
|
||||
WindowTheme {
|
||||
id: theme
|
||||
isDarkMode: root.isDarkMode
|
||||
lightWinBg: "#F5F5F5"
|
||||
lightLineColor: "#E0E0E0"
|
||||
}
|
||||
|
||||
// 对外依赖：C++ 后端对象，用于获取/设置接口、字体颜色等
|
||||
property var applet: null
|
||||
|
||||
@@ -34,15 +50,8 @@ Window {
|
||||
// 默认 false（浅色）保证组件独立预览时与原版视觉一致
|
||||
property bool isDarkMode: false
|
||||
|
||||
// ---- 主题感知颜色：isDarkMode 为 false 时取值与原浅色硬编码完全一致 ----
|
||||
readonly property color winBg: isDarkMode ? "#202020" : "#F5F5F5"
|
||||
readonly property color cardBg: isDarkMode ? "#2A2A2A" : "#FFFFFF"
|
||||
readonly property color lineColor: isDarkMode ? "#383838" : "#E0E0E0"
|
||||
readonly property color textPrimary: isDarkMode ? "#E0E0E0" : "#333333"
|
||||
readonly property color textSecondary: isDarkMode ? "#AAAAAA" : "#666666"
|
||||
readonly property color textTertiary: isDarkMode ? "#888888" : "#999999"
|
||||
readonly property color iconGray: isDarkMode ? "#AAAAAA" : "#777777"
|
||||
readonly property color hoverBg: isDarkMode ? "#353535" : "#F0F0F0"
|
||||
// ---- 设置窗口特有颜色（不属于三窗口公共主题）----
|
||||
// 命令显示区底色
|
||||
readonly property color codeBg: isDarkMode ? "#2A2A2A" : "#E8E8E8"
|
||||
// 选中态蓝色系：深色模式下背景压暗、文字改浅蓝，保证深色卡片上的对比度
|
||||
readonly property color selBg: isDarkMode ? "#1A3A5C" : "#E3F2FD"
|
||||
@@ -54,11 +63,11 @@ Window {
|
||||
property string uninstallButtonText: qsTr("Uninstall Plugin")
|
||||
|
||||
width: 350
|
||||
height: 390
|
||||
height: 450
|
||||
minimumWidth: 350
|
||||
maximumWidth: 350
|
||||
minimumHeight: 390
|
||||
maximumHeight: 390
|
||||
minimumHeight: 450
|
||||
maximumHeight: 450
|
||||
visible: false
|
||||
flags: Qt.FramelessWindowHint | Qt.Window
|
||||
// NonModal：不阻塞桌面其他区域，用户可同时操作任务栏
|
||||
@@ -66,37 +75,6 @@ Window {
|
||||
// 窗口透明：让圆角外的区域不显示，由内部 Rectangle 提供可见背景
|
||||
color: "transparent"
|
||||
|
||||
// 根据接口名返回类型描述，用于设置窗口网络接口列表
|
||||
// 设计原因：用户面对多个网口时难以仅凭 enp3s0/wlp3s0 等命名判断用途，
|
||||
// 加一行类型说明（有线/无线/VPN 等）降低认知负担
|
||||
function interfaceDescription(name) {
|
||||
if (name === "lo") return qsTr("Loopback")
|
||||
if (name === "Meta") return qsTr("Virtual Interface")
|
||||
if (/^enp|^eth/.test(name)) return qsTr("Wired Network")
|
||||
if (/^wlp|^wlan/.test(name)) return qsTr("Wireless Network")
|
||||
if (/^docker|^veth/.test(name)) return qsTr("Container Network")
|
||||
if (/^br/.test(name)) return qsTr("Bridge")
|
||||
if (/^tun|^tap/.test(name)) return qsTr("VPN")
|
||||
if (/^virbr/.test(name)) return qsTr("Virtual Bridge")
|
||||
return qsTr("Other")
|
||||
}
|
||||
|
||||
// 根据接口名返回类型图标（Unicode 符号），用于网络接口列表每行左侧
|
||||
// 设计原因：项目未引入图标库，用 Text 渲染 Unicode 符号（与 networkview.qml 的 ↓↑ 一致）；
|
||||
// 所选符号均为 DejaVu/Noto 等常见字体覆盖的单色字形，避免彩色 emoji 破坏浅色主题观感，
|
||||
// 匹配规则与 interfaceDescription 保持一致
|
||||
function interfaceIcon(name) {
|
||||
if (name === "lo") return "↻" // 本地回环：循环箭头
|
||||
if (name === "Meta") return "▢" // 虚拟接口：空心方块
|
||||
if (/^enp|^eth/.test(name)) return "⇄" // 有线网络：双向链路
|
||||
if (/^wlp|^wlan/.test(name)) return "∿" // 无线网络：信号波形
|
||||
if (/^docker|^veth/.test(name)) return "▣" // 容器网络：盒中盒
|
||||
if (/^br/.test(name)) return "⋈" // 桥接：连接（蝴蝶结形）
|
||||
if (/^tun|^tap/.test(name)) return "⚿" // VPN：钥匙
|
||||
if (/^virbr/.test(name)) return "⋈" // 虚拟桥接：同桥接
|
||||
return "◉" // 其他：通用网络节点
|
||||
}
|
||||
|
||||
// 显示时居中到当前屏幕（任务栏所在屏幕）
|
||||
onVisibleChanged: {
|
||||
if (visible) {
|
||||
@@ -109,76 +87,30 @@ Window {
|
||||
// 主容器：提供不透明背景（随 isDarkMode 切换深浅）+ 圆角 + 边框
|
||||
Rectangle {
|
||||
anchors.fill: parent
|
||||
color: root.winBg
|
||||
color: theme.winBg
|
||||
radius: 12
|
||||
border.width: 1
|
||||
border.color: root.lineColor
|
||||
border.color: theme.lineColor
|
||||
|
||||
ColumnLayout {
|
||||
anchors.fill: parent
|
||||
anchors.margins: 0
|
||||
spacing: 0
|
||||
|
||||
// 自定义标题栏（可拖动）
|
||||
Rectangle {
|
||||
// 公共标题栏：标题文字 + 圆形关闭按钮，整栏可拖动
|
||||
TitleBar {
|
||||
Layout.fillWidth: true
|
||||
Layout.preferredHeight: 44
|
||||
color: "transparent"
|
||||
|
||||
// 拖动层：声明在关闭按钮之前（位于其下方），避免遮挡按钮点击与 hover
|
||||
// 用 startSystemMove() 系统级窗口拖动，由窗口管理器接管移动，
|
||||
// 这是 frameless Window 的正确做法，pressed 即触发，丝滑无抖动
|
||||
MouseArea {
|
||||
anchors.fill: parent
|
||||
cursorShape: Qt.OpenHandCursor
|
||||
onPressed: root.startSystemMove()
|
||||
}
|
||||
|
||||
// 标题文字
|
||||
Text {
|
||||
anchors.left: parent.left
|
||||
anchors.leftMargin: 16
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
text: qsTr("Settings")
|
||||
font.pixelSize: 15
|
||||
font.weight: Font.Bold
|
||||
color: root.textPrimary
|
||||
}
|
||||
|
||||
// 关闭按钮
|
||||
Rectangle {
|
||||
id: closeButton
|
||||
anchors.right: parent.right
|
||||
anchors.rightMargin: 12
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
width: 28
|
||||
height: 28
|
||||
radius: 14
|
||||
color: closeMouse.containsMouse ? Qt.rgba(220/255, 38/255, 38/255, 0.15) : "transparent"
|
||||
|
||||
Text {
|
||||
anchors.centerIn: parent
|
||||
text: "×"
|
||||
font.pixelSize: 20
|
||||
font.weight: Font.Bold
|
||||
color: closeMouse.containsMouse ? accentColor : root.textSecondary
|
||||
}
|
||||
|
||||
MouseArea {
|
||||
id: closeMouse
|
||||
anchors.fill: parent
|
||||
hoverEnabled: true
|
||||
cursorShape: Qt.PointingHandCursor
|
||||
onClicked: root.hide()
|
||||
}
|
||||
}
|
||||
titleText: qsTr("Settings")
|
||||
textColor: theme.textPrimary
|
||||
secondaryTextColor: theme.textSecondary
|
||||
closeHoverColor: root.accentColor
|
||||
}
|
||||
|
||||
// 分隔线
|
||||
Rectangle {
|
||||
Layout.fillWidth: true
|
||||
Layout.preferredHeight: 1
|
||||
color: root.lineColor
|
||||
color: theme.lineColor
|
||||
}
|
||||
|
||||
// 内容区域
|
||||
@@ -196,7 +128,7 @@ Window {
|
||||
text: qsTr("Network Interface")
|
||||
font.pixelSize: 13
|
||||
font.weight: Font.Bold
|
||||
color: root.textSecondary
|
||||
color: theme.textSecondary
|
||||
}
|
||||
|
||||
// 接口列表容器：最多显示约 5 行（160px），超出部分垂直滚动
|
||||
@@ -207,10 +139,10 @@ Window {
|
||||
Layout.preferredHeight: networkInterfaces.length > 0
|
||||
? Math.min(ifaceColumn.implicitHeight, 160) + 20
|
||||
: 80
|
||||
color: root.cardBg
|
||||
color: theme.cardBg
|
||||
radius: 10
|
||||
border.width: 1
|
||||
border.color: root.lineColor
|
||||
border.color: theme.lineColor
|
||||
|
||||
// 用 ScrollView 而非裸 Flickable：自带滚轮滚动支持，
|
||||
// 且滚动条显示时自动让出内容宽度，不会遮挡行内文字
|
||||
@@ -235,8 +167,8 @@ Window {
|
||||
implicitWidth: 4
|
||||
radius: 2
|
||||
// 按压/悬停加深、默认稍淡，保证滚动条在卡片背景上可见
|
||||
color: ifaceScrollBar.pressed ? root.textSecondary
|
||||
: (ifaceScrollBar.hovered ? root.textSecondary : root.textTertiary)
|
||||
color: ifaceScrollBar.pressed ? theme.textSecondary
|
||||
: (ifaceScrollBar.hovered ? theme.textSecondary : theme.textTertiary)
|
||||
}
|
||||
}
|
||||
|
||||
@@ -265,7 +197,7 @@ Window {
|
||||
// 背景优先级：选中 > hover；选中行 hover 时稍加深以保留交互反馈
|
||||
color: isActive
|
||||
? (hovered ? root.selBgHover : root.selBg)
|
||||
: (hovered ? root.hoverBg : "transparent")
|
||||
: (hovered ? theme.hoverBg : "transparent")
|
||||
// 选中行加细边框增强视觉；未选中保持透明边框占位，避免切换时出现 1px 抖动
|
||||
border.width: 1
|
||||
border.color: isActive ? root.selBorder : "transparent"
|
||||
@@ -291,9 +223,9 @@ Window {
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
Layout.preferredWidth: 20
|
||||
horizontalAlignment: Text.AlignHCenter
|
||||
text: interfaceIcon(modelData)
|
||||
text: common.interfaceIcon(modelData)
|
||||
font.pixelSize: 14
|
||||
color: ifaceRow.isActive ? ifaceRow.activeColor : root.iconGray
|
||||
color: ifaceRow.isActive ? ifaceRow.activeColor : theme.iconGray
|
||||
}
|
||||
|
||||
// 自绘单选圆点：替代 RadioButton 作纯视觉指示器，
|
||||
@@ -307,7 +239,7 @@ Window {
|
||||
color: "transparent"
|
||||
border.width: 2
|
||||
border.color: ifaceRow.isActive ? ifaceRow.activeColor
|
||||
: (ifaceRow.hovered ? root.textSecondary : root.textTertiary)
|
||||
: (ifaceRow.hovered ? theme.textSecondary : theme.textTertiary)
|
||||
|
||||
Rectangle {
|
||||
anchors.centerIn: parent
|
||||
@@ -326,16 +258,16 @@ Window {
|
||||
text: modelData
|
||||
font.pixelSize: 13
|
||||
font.weight: ifaceRow.isActive ? Font.Medium : Font.Normal
|
||||
color: ifaceRow.isActive ? ifaceRow.activeColor : root.textPrimary
|
||||
color: ifaceRow.isActive ? ifaceRow.activeColor : theme.textPrimary
|
||||
elide: Text.ElideRight
|
||||
}
|
||||
|
||||
// 接口类型描述：右对齐显示，与接口名分居两侧
|
||||
Text {
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
text: interfaceDescription(modelData)
|
||||
text: common.interfaceDescription(modelData)
|
||||
font.pixelSize: 12
|
||||
color: root.textTertiary
|
||||
color: theme.textTertiary
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -348,7 +280,7 @@ Window {
|
||||
anchors.centerIn: parent
|
||||
text: qsTr("No network interface detected")
|
||||
font.pixelSize: 12
|
||||
color: root.textTertiary
|
||||
color: theme.textTertiary
|
||||
visible: networkInterfaces.length === 0
|
||||
}
|
||||
}
|
||||
@@ -360,7 +292,7 @@ Window {
|
||||
text: qsTr("Font Color")
|
||||
font.pixelSize: 13
|
||||
font.weight: Font.Bold
|
||||
color: root.textSecondary
|
||||
color: theme.textSecondary
|
||||
}
|
||||
|
||||
TextColorPicker {
|
||||
@@ -371,6 +303,56 @@ Window {
|
||||
onColorSelected: if (applet) applet.textColor = color
|
||||
}
|
||||
|
||||
// 刷新间隔选择区：1 秒 / 2 秒 / 5 秒
|
||||
// 设计原因：用户可能觉得每秒刷新开销大或过于频繁，提供更长的间隔选项；
|
||||
// 选择结果通过 applet.refreshInterval 持久化并即时生效，
|
||||
// 速度计算基于真实流逝时间（elapsedSec），改变间隔不影响计算正确性
|
||||
Text {
|
||||
text: qsTr("Refresh Interval")
|
||||
font.pixelSize: 13
|
||||
font.weight: Font.Bold
|
||||
color: theme.textSecondary
|
||||
}
|
||||
|
||||
// 三个间隔选项按钮：1 秒 / 2 秒 / 5 秒
|
||||
RowLayout {
|
||||
Layout.fillWidth: true
|
||||
spacing: 8
|
||||
|
||||
Repeater {
|
||||
model: [1000, 2000, 5000]
|
||||
|
||||
Rectangle {
|
||||
id: intervalOption
|
||||
Layout.fillWidth: true
|
||||
Layout.preferredHeight: 34
|
||||
radius: 8
|
||||
// 选中态蓝色填充边框，未选中态卡片背景，hover 态加深
|
||||
color: applet && applet.refreshInterval === modelData
|
||||
? root.selBg : (intervalMouse.containsMouse ? theme.hoverBg : theme.cardBg)
|
||||
border.width: 1
|
||||
border.color: applet && applet.refreshInterval === modelData
|
||||
? root.selBorder : theme.lineColor
|
||||
|
||||
Text {
|
||||
anchors.centerIn: parent
|
||||
text: (modelData / 1000) + "s"
|
||||
font.pixelSize: 13
|
||||
color: applet && applet.refreshInterval === modelData
|
||||
? root.selText : theme.textPrimary
|
||||
}
|
||||
|
||||
MouseArea {
|
||||
id: intervalMouse
|
||||
anchors.fill: parent
|
||||
hoverEnabled: true
|
||||
cursorShape: Qt.PointingHandCursor
|
||||
onClicked: if (applet) applet.refreshInterval = modelData
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Item { Layout.preferredHeight: 4 }
|
||||
|
||||
// 卸载插件按钮：文字可动态切换（复制命令后显示提示）
|
||||
@@ -431,10 +413,10 @@ Window {
|
||||
y: (root.height - height) / 2
|
||||
|
||||
background: Rectangle {
|
||||
color: root.winBg
|
||||
color: theme.winBg
|
||||
radius: 12
|
||||
border.width: 1
|
||||
border.color: root.lineColor
|
||||
border.color: theme.lineColor
|
||||
}
|
||||
|
||||
contentItem: ColumnLayout {
|
||||
@@ -453,7 +435,7 @@ Window {
|
||||
Text {
|
||||
text: qsTr("The following command uninstalls the plugin and restarts dde-shell. Please copy and run it in terminal:")
|
||||
font.pixelSize: 12
|
||||
color: root.textPrimary
|
||||
color: theme.textPrimary
|
||||
Layout.alignment: Qt.AlignHCenter
|
||||
Layout.fillWidth: true
|
||||
horizontalAlignment: Text.AlignHCenter
|
||||
@@ -473,7 +455,7 @@ Window {
|
||||
text: "sudo rm -rf /usr/share/dde-shell/space.jokul.JNetApplet/ && systemctl --user restart dde-shell@DDE"
|
||||
font.pixelSize: 10
|
||||
font.family: "monospace"
|
||||
color: root.textSecondary
|
||||
color: theme.textSecondary
|
||||
wrapMode: Text.WordWrap
|
||||
}
|
||||
}
|
||||
@@ -489,16 +471,16 @@ Window {
|
||||
Rectangle {
|
||||
Layout.fillWidth: true
|
||||
Layout.preferredHeight: 36
|
||||
color: cancelUninstallMouse.containsMouse ? root.hoverBg : root.cardBg
|
||||
color: cancelUninstallMouse.containsMouse ? theme.hoverBg : theme.cardBg
|
||||
radius: 8
|
||||
border.width: 1
|
||||
border.color: root.lineColor
|
||||
border.color: theme.lineColor
|
||||
|
||||
Text {
|
||||
anchors.centerIn: parent
|
||||
text: qsTr("Cancel")
|
||||
font.pixelSize: 13
|
||||
color: root.textPrimary
|
||||
color: theme.textPrimary
|
||||
}
|
||||
|
||||
MouseArea {
|
||||
|
||||
@@ -0,0 +1,99 @@
|
||||
// SPDX-FileCopyrightText: 2026 Jokul
|
||||
//
|
||||
// SPDX-License-Identifier: LGPL-3.0-or-later
|
||||
|
||||
// 独立窗口公共自定义标题栏
|
||||
// 消除 AboutWindow / SettingsWindow / TrafficChartWindow 三个独立顶层窗口之间的
|
||||
// 标题栏样板重复（此前各窗口各持一份"拖动层 + 标题文字 + 圆形关闭按钮"的拷贝）。
|
||||
// 现提取为本组件，各窗口在圆角卡片顶部的 ColumnLayout 中实例化 TitleBar 即可。
|
||||
// 对外能力：
|
||||
// - titleText：标题栏文字
|
||||
// - textColor / secondaryTextColor：标题文字色与关闭按钮默认文字色（取主题色）
|
||||
// - closeHoverColor：关闭按钮 hover 态文字高亮色（accentColor，默认红色）
|
||||
// - 拖动：整栏按住调用 Window.window.startSystemMove() 系统级拖动（frameless
|
||||
// Window 的正确做法，drag.target 对 Window 无效）；拖动层声明在按钮下方，
|
||||
// 不遮挡关闭/额外按钮的点击与 hover
|
||||
// - 关闭按钮：28x28 圆形，hover 时淡红底 + 红色 ×，点击 Window.window.hide()
|
||||
// - extraActions：default property，供子窗口在关闭按钮左侧填充额外按钮
|
||||
// （如 TrafficChartWindow 的"置顶"按钮），其逻辑仍保留在子窗口内
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Window 2.15
|
||||
|
||||
Item {
|
||||
id: titleBar
|
||||
|
||||
// 标题栏文字，由子窗口传入（qsTr 文案在子窗口侧）
|
||||
property string titleText: ""
|
||||
|
||||
// 标题文字颜色：取主题色 textPrimary
|
||||
property color textColor: "#333333"
|
||||
|
||||
// 关闭按钮默认文字色：取主题色 textSecondary
|
||||
property color secondaryTextColor: "#666666"
|
||||
|
||||
// 关闭按钮 hover 态文字高亮色：取子窗口 accentColor（默认红色）
|
||||
property color closeHoverColor: Qt.rgba(220 / 255, 38 / 255, 38 / 255, 1)
|
||||
|
||||
// 额外右侧按钮容器：default property 让子窗口直接把按钮写进标题栏，
|
||||
// 按钮将布局在关闭按钮左侧（用于置顶按钮等）
|
||||
default property alias extraActions: actionHost.data
|
||||
|
||||
implicitHeight: 44
|
||||
|
||||
// 拖动层：声明在关闭/额外按钮之前（位于其下方），避免遮挡按钮点击与 hover
|
||||
// 用 startSystemMove() 系统级窗口拖动，由窗口管理器接管移动，
|
||||
// 这是 frameless Window 的正确做法，pressed 即触发，丝滑无抖动
|
||||
MouseArea {
|
||||
anchors.fill: parent
|
||||
cursorShape: Qt.OpenHandCursor
|
||||
onPressed: Window.window.startSystemMove()
|
||||
}
|
||||
|
||||
// 标题文字
|
||||
Text {
|
||||
anchors.left: parent.left
|
||||
anchors.leftMargin: 16
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
text: titleBar.titleText
|
||||
font.pixelSize: 15
|
||||
font.weight: Font.Bold
|
||||
color: titleBar.textColor
|
||||
}
|
||||
|
||||
// 额外右侧按钮容器：右缘贴关闭按钮左侧，高度与标题栏一致
|
||||
Item {
|
||||
id: actionHost
|
||||
anchors.right: closeButton.left
|
||||
anchors.rightMargin: 4
|
||||
anchors.top: parent.top
|
||||
anchors.bottom: parent.bottom
|
||||
}
|
||||
|
||||
// 关闭按钮：28x28 圆形，hover 时淡红底 + 红色 ×（颜色由 closeHoverColor 决定）
|
||||
Rectangle {
|
||||
id: closeButton
|
||||
anchors.right: parent.right
|
||||
anchors.rightMargin: 12
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
width: 28
|
||||
height: 28
|
||||
radius: 14
|
||||
color: closeMouse.containsMouse ? Qt.rgba(220 / 255, 38 / 255, 38 / 255, 0.15) : "transparent"
|
||||
|
||||
Text {
|
||||
anchors.centerIn: parent
|
||||
text: "×"
|
||||
font.pixelSize: 20
|
||||
font.weight: Font.Bold
|
||||
color: closeMouse.containsMouse ? titleBar.closeHoverColor : titleBar.secondaryTextColor
|
||||
}
|
||||
|
||||
MouseArea {
|
||||
id: closeMouse
|
||||
anchors.fill: parent
|
||||
hoverEnabled: true
|
||||
cursorShape: Qt.PointingHandCursor
|
||||
onClicked: Window.window.hide()
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -2,8 +2,8 @@
|
||||
//
|
||||
// SPDX-License-Identifier: LGPL-3.0-or-later
|
||||
|
||||
// 流量波动图窗口：屏幕居中的独立顶层窗口，展示当前活动接口最近 5 分钟的
|
||||
// 网速趋势（下载/上传双折线图），随 C++ 后端 speedHistoryChanged 信号每秒动态刷新
|
||||
// 流量波动图窗口：屏幕居中的独立顶层窗口，展示当前活动接口最近 1/5/30 分钟（可切换）
|
||||
// 的网速趋势（下载/上传双折线图），随 C++ 后端 speedHistoryChanged 信号每秒动态刷新
|
||||
// 设计要点：
|
||||
// - 视觉风格复用 AboutWindow.qml（圆角卡片 12px、1px 边框、44px 标题栏、
|
||||
// 28x28 圆形关闭按钮 hover 淡红底）；深/浅主题由 isDarkMode 切换
|
||||
@@ -13,6 +13,8 @@
|
||||
// - 数据通过属性注入：applet 即 networkview.qml 的 root.applet（C++ 后端对象），
|
||||
// 为 null 时组件可独立预览（Canvas 显示"暂无历史数据"空状态）
|
||||
// 触发方式：右键菜单"流量波动图" -> show()/raise()/requestActivate()
|
||||
// 公共能力复用：主题色取自 WindowTheme，标题栏（含置顶/关闭按钮）取自 TitleBar，
|
||||
// 消除三窗口样板重复
|
||||
import QtQuick 2.15
|
||||
import QtQuick.Layouts 1.15
|
||||
import QtQuick.Window 2.15
|
||||
@@ -25,6 +27,12 @@ Window {
|
||||
// 与 networkview.qml、NetworkPopup 共享同一份实现，消除跨组件重复定义
|
||||
NetCommon { id: common }
|
||||
|
||||
// 公共主题色：集中定义于 WindowTheme.qml，随 isDarkMode 切换深浅
|
||||
WindowTheme {
|
||||
id: theme
|
||||
isDarkMode: root.isDarkMode
|
||||
}
|
||||
|
||||
// 对外依赖：关闭按钮 hover 态文字高亮色，由父组件传入
|
||||
// 默认值与 networkview.qml 中 root.accentRed 一致，确保独立可用
|
||||
property color accentColor: Qt.rgba(220 / 255, 38 / 255, 38 / 255, 1)
|
||||
@@ -39,16 +47,10 @@ Window {
|
||||
// 默认 false（浅色）保证组件独立预览时与原版视觉一致
|
||||
property bool isDarkMode: false
|
||||
|
||||
// ---- 主题感知颜色：isDarkMode 为 false 时取值与原浅色硬编码完全一致 ----
|
||||
readonly property color winBg: isDarkMode ? "#202020" : "#FFFFFF"
|
||||
readonly property color lineColor: isDarkMode ? "#383838" : "#E8E8E8"
|
||||
readonly property color textPrimary: isDarkMode ? "#E0E0E0" : "#333333"
|
||||
readonly property color textSecondary: isDarkMode ? "#AAAAAA" : "#666666"
|
||||
readonly property color textTertiary: isDarkMode ? "#888888" : "#999999"
|
||||
// 置顶按钮 hover 底色：浅色用淡黑、深色用淡白，保证两种卡片背景上均可见
|
||||
// 置顶按钮 hover 底色（本窗口特有）：浅色用淡黑、深色用淡白，保证两种卡片背景上均可见
|
||||
readonly property color pinHoverBg: isDarkMode ? Qt.rgba(1, 1, 1, 0.10) : Qt.rgba(0, 0, 0, 0.06)
|
||||
|
||||
// 图表绘制色：声明为 string 供 Canvas 2D 上下文直接使用
|
||||
// 图表绘制色（本窗口特有）：声明为 string 供 Canvas 2D 上下文直接使用
|
||||
//（QML color 类型含 alpha 时序列化为 #AARRGGBB，Canvas 无法正确解析，故不用 color 类型）
|
||||
readonly property string gridBaselineColor: isDarkMode ? "#383838" : "#DDDDDD"
|
||||
readonly property string gridLineColor: isDarkMode ? "#2A2A2A" : "#E5E5E5"
|
||||
@@ -65,6 +67,31 @@ Window {
|
||||
// 格式："14:23:05 ↓856.00 KB/s ↑120.00 KB/s"
|
||||
property string hoverHint: ""
|
||||
|
||||
// 时间窗口选择（秒）：60=1分钟, 300=5分钟, 1800=30分钟
|
||||
// 纯 QML 展示层选择——后端已存够 30 分钟历史（MAX_HISTORY_SAMPLES=1800），
|
||||
// 这里仅决定 X 轴绘制范围与标签，不改变后端采集行为
|
||||
property int timeWindowSec: 300
|
||||
|
||||
// 时间窗口选项列表：由 (label, seconds) 键值对组成，供顶部状态条选择器遍历
|
||||
// 及绘制逻辑按 timeWindowSec 反查标签/刻度使用
|
||||
property var timeWindows: [
|
||||
{ label: "1m", seconds: 60 },
|
||||
{ label: "5m", seconds: 300 },
|
||||
{ label: "30m", seconds: 1800 }
|
||||
]
|
||||
|
||||
// 依据当前 timeWindowSec 反查 X 轴刻度标签数组：
|
||||
// 设计原因：不同时间窗口下刻度粒度不同，1 分钟用 15 秒间隔、5 分钟用 1 分钟间隔、
|
||||
// 30 分钟用 5 分钟间隔，保证标签数量适中（5~7 个）且刻度易读
|
||||
readonly property var xAxisLabels: {
|
||||
if (timeWindowSec <= 60) return ["-1m", "-45s", "-30s", "-15s", "now"]
|
||||
if (timeWindowSec <= 300) return ["-5m", "-4m", "-3m", "-2m", "-1m", "now"]
|
||||
return ["-30m", "-25m", "-20m", "-15m", "-10m", "-5m", "now"]
|
||||
}
|
||||
|
||||
// 顶部状态条右侧的时间窗口标签文本（如 "· 5min"），随 timeWindowSec 动态显示
|
||||
readonly property string timeWindowLabel: "· " + (timeWindowSec / 60) + "min"
|
||||
|
||||
// 窗口置顶状态：true 时 flags 附加 Qt.WindowStaysOnTopHint，窗口保持在
|
||||
// 所有非置顶窗口之上（便于边下载大文件边观察曲线）；由标题栏图钉按钮切换
|
||||
property bool pinned: false
|
||||
@@ -148,47 +175,29 @@ Window {
|
||||
// 窗口主体：圆角卡片（背景与边框随 isDarkMode 切换深浅），1px 边框模拟 DTK 窗口描边（与 AboutWindow 一致）
|
||||
Rectangle {
|
||||
anchors.fill: parent
|
||||
color: root.winBg
|
||||
color: theme.winBg
|
||||
radius: 12
|
||||
border.width: 1
|
||||
border.color: root.lineColor
|
||||
border.color: theme.lineColor
|
||||
|
||||
ColumnLayout {
|
||||
anchors.fill: parent
|
||||
spacing: 0
|
||||
|
||||
// 自定义标题栏：左侧"流量波动图"标题 + 右侧置顶/关闭按钮，整栏可拖动窗口
|
||||
Rectangle {
|
||||
// 公共标题栏：标题文字 + 置顶/关闭按钮，整栏可拖动。
|
||||
// 置顶按钮通过 TitleBar 的额外按钮槽（extraActions）注入，逻辑仍在本窗口
|
||||
TitleBar {
|
||||
Layout.fillWidth: true
|
||||
Layout.preferredHeight: 44
|
||||
color: "transparent"
|
||||
|
||||
// 拖动层：声明在关闭/置顶按钮之前（位于其下方），避免遮挡按钮点击与 hover
|
||||
// 注意：drag.target 只对 Item 生效，对 Window 无效（原实现拖动不工作）；
|
||||
// 改用 startSystemMove() 系统级窗口拖动，这是 frameless Window 的正确做法，
|
||||
// pressed 即触发，由窗口管理器接管移动，不干扰按钮的 hover/click
|
||||
MouseArea {
|
||||
anchors.fill: parent
|
||||
cursorShape: Qt.OpenHandCursor
|
||||
onPressed: root.startSystemMove()
|
||||
}
|
||||
|
||||
Text {
|
||||
anchors.left: parent.left
|
||||
anchors.leftMargin: 16
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
text: qsTr("Traffic Chart")
|
||||
font.pixelSize: 15
|
||||
font.weight: Font.Bold
|
||||
color: root.textPrimary
|
||||
}
|
||||
titleText: qsTr("Traffic Chart")
|
||||
textColor: theme.textPrimary
|
||||
secondaryTextColor: theme.textSecondary
|
||||
closeHoverColor: root.accentColor
|
||||
|
||||
// 置顶按钮：28x28 圆形（与关闭按钮一致），位于关闭按钮左侧
|
||||
// 三态视觉：未置顶=灰色图钉轮廓；置顶=deepin 蓝填充 + 淡蓝底；
|
||||
// hover=淡灰底（置顶时淡蓝底优先）
|
||||
Rectangle {
|
||||
anchors.right: chartCloseButton.left
|
||||
anchors.rightMargin: 4
|
||||
anchors.right: parent.right
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
width: 28
|
||||
height: 28
|
||||
@@ -256,34 +265,6 @@ Window {
|
||||
onClicked: root.pinned = !root.pinned
|
||||
}
|
||||
}
|
||||
|
||||
// 关闭按钮：28x28 圆形，hover 时淡红底 + 红色 ×（颜色由 accentColor 决定）
|
||||
Rectangle {
|
||||
id: chartCloseButton
|
||||
anchors.right: parent.right
|
||||
anchors.rightMargin: 12
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
width: 28
|
||||
height: 28
|
||||
radius: 14
|
||||
color: chartCloseMouse.containsMouse ? Qt.rgba(220 / 255, 38 / 255, 38 / 255, 0.15) : "transparent"
|
||||
|
||||
Text {
|
||||
anchors.centerIn: parent
|
||||
text: "×"
|
||||
font.pixelSize: 20
|
||||
font.weight: Font.Bold
|
||||
color: chartCloseMouse.containsMouse ? root.accentColor : root.textSecondary
|
||||
}
|
||||
|
||||
MouseArea {
|
||||
id: chartCloseMouse
|
||||
anchors.fill: parent
|
||||
hoverEnabled: true
|
||||
cursorShape: Qt.PointingHandCursor
|
||||
onClicked: root.hide()
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 顶部状态条：实时下行/上行速度（箭头颜色与折线一致，兼作图例）
|
||||
@@ -306,7 +287,7 @@ Window {
|
||||
// applet 为空时兜底为 0，保证独立预览不报错
|
||||
text: common.formatSpeed(root.applet ? root.applet.downloadSpeed : 0)
|
||||
font.pixelSize: 12
|
||||
color: root.textPrimary
|
||||
color: theme.textPrimary
|
||||
}
|
||||
|
||||
Item { Layout.preferredWidth: 10 }
|
||||
@@ -321,16 +302,62 @@ Window {
|
||||
Text {
|
||||
text: common.formatSpeed(root.applet ? root.applet.uploadSpeed : 0)
|
||||
font.pixelSize: 12
|
||||
color: root.textPrimary
|
||||
color: theme.textPrimary
|
||||
}
|
||||
|
||||
Item { Layout.fillWidth: true }
|
||||
|
||||
// 时间窗口选择器：三个小按钮 1m / 5m / 30m，当前选中项用 accentBlue 高亮
|
||||
// 设计原因：时间窗口切换是图表最常用的操作，直接置于顶部状态条便于快速切换；
|
||||
// 用比接口 chip 更小的尺寸（22x18）避免挤占状态条空间
|
||||
Repeater {
|
||||
model: root.timeWindows
|
||||
|
||||
Rectangle {
|
||||
required property var modelData
|
||||
property bool isSelected: root.timeWindowSec === modelData.seconds
|
||||
|
||||
width: 24
|
||||
height: 18
|
||||
radius: 4
|
||||
// 选中态：蓝色填充+白字；未选中态：透明背景+浅边框，hover 边框变蓝
|
||||
color: isSelected ? common.accentBlue : "transparent"
|
||||
border.width: 1
|
||||
border.color: isSelected
|
||||
? common.accentBlue
|
||||
: (mouse.containsMouse ? common.accentBlue : theme.lineColor)
|
||||
|
||||
Text {
|
||||
anchors.centerIn: parent
|
||||
text: modelData.label
|
||||
font.pixelSize: 10
|
||||
font.weight: isSelected ? Font.Bold : Font.Normal
|
||||
color: isSelected ? "white" : (mouse.containsMouse ? common.accentBlue : theme.textSecondary)
|
||||
}
|
||||
|
||||
MouseArea {
|
||||
id: mouse
|
||||
anchors.fill: parent
|
||||
cursorShape: Qt.PointingHandCursor
|
||||
hoverEnabled: true
|
||||
onClicked: {
|
||||
if (root.timeWindowSec !== modelData.seconds) {
|
||||
root.timeWindowSec = modelData.seconds
|
||||
// 时间窗口变化后：清空 Hover（坐标系已变），并重绘图表
|
||||
root.hoverIndex = -1
|
||||
root.hoverHint = ""
|
||||
canvas.requestPaint()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Text {
|
||||
text: (root.applet && root.applet.activeInterface
|
||||
? root.applet.activeInterface : "—") + " · 5min"
|
||||
? root.applet.activeInterface : "—") + " " + root.timeWindowLabel
|
||||
font.pixelSize: 12
|
||||
color: root.textTertiary
|
||||
color: theme.textTertiary
|
||||
}
|
||||
}
|
||||
|
||||
@@ -366,11 +393,12 @@ Window {
|
||||
var n = dl.length
|
||||
|
||||
// ---- Y 轴上限计算（动态适应最近活动）----
|
||||
// 使用最近 60 秒的数据计算 Y 轴上限，而非全量 5 分钟缓冲。
|
||||
// 使用最近 60 秒的数据计算 Y 轴上限，而非全量历史缓冲。
|
||||
// 设计原因：若使用全量缓冲，当历史中存在大流量峰值（如 12MB/s 下载）时，
|
||||
// 即使当前网速已降至 KB/s 级别，Y 轴仍保持高位，导致当前曲线被压到底部
|
||||
// 无法观察波动。改用 60 秒窗口后，峰值滑出窗口时 Y 轴自动缩小，
|
||||
// 始终为当前活动提供合适的显示比例。
|
||||
// 始终为当前活动提供合适的显示比例。30 分钟视图下 60 秒窗口仍合理
|
||||
//（关注近期活动），故不随 timeWindowSec 变化。
|
||||
var vMax = 0
|
||||
var i
|
||||
var recentWindow = 60 // 秒，Y 轴基于最近 1 分钟的活动计算
|
||||
@@ -379,7 +407,9 @@ Window {
|
||||
if (dl[i].y > vMax) vMax = dl[i].y
|
||||
if (i < ul.length && ul[i].y > vMax) vMax = ul[i].y
|
||||
}
|
||||
var yMax = vMax <= 0 ? 1024 : root.niceCeil(vMax * 1.2)
|
||||
// Y 轴下限 8KB：纯空闲时微小波动也有 KB 级刻度可辨，
|
||||
// 避免一格都撑不满；8KB 兼顾空闲可读性与小流量不溢出
|
||||
var yMax = vMax <= 0 ? 8192 : Math.max(8192, root.niceCeil(vMax * 1.2))
|
||||
var unit = root.axisUnit(yMax)
|
||||
|
||||
// ---- 水平网格线与 Y 轴刻度（[0, yMax] 均分 4 段）----
|
||||
@@ -402,10 +432,11 @@ Window {
|
||||
ctx.fillText(root.formatAxisValue(yMax * g / 4, unit), pl - 8, gy)
|
||||
}
|
||||
|
||||
// ---- X 轴刻度：每分钟一个标签，均布于绘图区 ----
|
||||
// 5 分钟窗口用 -5m/-4m/-3m/-2m/-1m/now 共 6 个标签，比 4 个三分点
|
||||
// 的 -3m20s/-1m40s 更易读；循环按数组长度参数化，两端左/右对齐
|
||||
var xLabels = ["-5m", "-4m", "-3m", "-2m", "-1m", "now"]
|
||||
// ---- X 轴刻度：按时间窗口参数化，均布于绘图区 ----
|
||||
// 标签数组由 root.xAxisLabels 依据 timeWindowSec 动态生成
|
||||
// （1 分钟用 15 秒间隔 5 个标签，5 分钟用 1 分钟间隔 6 个，
|
||||
// 30 分钟用 5 分钟间隔 7 个）；循环按数组长度参数化，两端左/右对齐
|
||||
var xLabels = root.xAxisLabels
|
||||
ctx.fillStyle = root.axisTextColor
|
||||
ctx.textBaseline = "alphabetic"
|
||||
for (i = 0; i < xLabels.length; i++) {
|
||||
@@ -426,15 +457,16 @@ Window {
|
||||
}
|
||||
|
||||
// ---- 折线绘制 ----
|
||||
// X 轴固定为 5 分钟窗口 [tMax-300, tMax]：右缘始终对齐"now"，
|
||||
// 数据不足 5 分钟时曲线从右侧向左生长，左侧留空网格。
|
||||
// X 轴为可配置窗口 [tMax-timeWindowSec, tMax]：右缘始终对齐"now"，
|
||||
// 数据不足时间窗口时曲线从右侧向左生长，左侧留空网格。
|
||||
// 设计原因：若按实际数据范围 [dl[0].x, tMax] 映射，刚启动时仅有
|
||||
// 几秒数据会被拉伸到整个绘图宽度，X 轴标签 -5m/-4m/... 与实际范围
|
||||
// 严重不符，用户看到的是"几秒趋势图"而非"5 分钟趋势图"。
|
||||
// 300 = 5 分钟 × 60 秒，与 C++ MAX_HISTORY_SAMPLES 一致
|
||||
// 几秒数据会被拉伸到整个绘图宽度，X 轴标签与实际范围严重不符，
|
||||
// 用户看到的是"几秒趋势图"而非"时间窗口趋势图"。
|
||||
// tRange 取 timeWindowSec（60/300/1800），对应 1/5/30 分钟窗口，
|
||||
// 与 C++ MAX_HISTORY_SAMPLES（1800）保证 30 分钟窗口下数据充足
|
||||
var tMax = dl[n - 1].x
|
||||
var tMin = tMax - 300
|
||||
var tRange = 300
|
||||
var tRange = root.timeWindowSec
|
||||
var tMin = tMax - tRange
|
||||
|
||||
// 单点边界：只有 1 个采样点时无法连线，画一个圆点。
|
||||
// 固定窗口下单点对齐 now（右缘），而非居中
|
||||
@@ -451,6 +483,16 @@ Window {
|
||||
// 绘制一条序列折线：先填充线下淡色区域增强可读性，再描边 2px 主线
|
||||
// lineCap/lineJoin 用 round 使折线端点与转角圆润
|
||||
// 注意每次 stroke/fill 前必须 beginPath()，避免与上一段路径串连
|
||||
// 5 点滑动平均（±2 样本）：抑制 1 秒采样的亚秒混叠尖峰，
|
||||
// 使曲线反映趋势而非瞬时脉冲；hover 提示仍显示原始值供诊断
|
||||
function smoothY(data, idx) {
|
||||
var sum = 0, cnt = 0
|
||||
for (var k = Math.max(0, idx - 2); k <= Math.min(data.length - 1, idx + 2); k++) {
|
||||
sum += data[k].y
|
||||
cnt++
|
||||
}
|
||||
return cnt > 0 ? sum / cnt : data[idx].y
|
||||
}
|
||||
function drawSeries(data, colorCss, fillCss) {
|
||||
var m = data.length
|
||||
if (m === 0) return
|
||||
@@ -459,7 +501,7 @@ Window {
|
||||
ctx.beginPath()
|
||||
for (j = 0; j < m; j++) {
|
||||
px = pl + ((data[j].x - tMin) / tRange) * pw
|
||||
py = pt + ph - (data[j].y / yMax) * ph
|
||||
py = pt + ph - (smoothY(data, j) / yMax) * ph
|
||||
if (j === 0) ctx.moveTo(px, py)
|
||||
else ctx.lineTo(px, py)
|
||||
}
|
||||
@@ -472,7 +514,7 @@ Window {
|
||||
ctx.beginPath()
|
||||
for (j = 0; j < m; j++) {
|
||||
px = pl + ((data[j].x - tMin) / tRange) * pw
|
||||
py = pt + ph - (data[j].y / yMax) * ph
|
||||
py = pt + ph - (smoothY(data, j) / yMax) * ph
|
||||
if (j === 0) ctx.moveTo(px, py)
|
||||
else ctx.lineTo(px, py)
|
||||
}
|
||||
@@ -519,7 +561,7 @@ Window {
|
||||
|
||||
// Hover 交互层：横向移动时按 mouseX 反查最近采样点
|
||||
// 设计原因：采样点按时间均匀分布（1Hz），先由 X 坐标线性反推时间戳，
|
||||
// 再线性扫描找最近点；300 点上限下扫描开销可忽略，无需二分
|
||||
// 再线性扫描找最近点；1800 点上限下扫描开销仍可忽略，无需二分
|
||||
MouseArea {
|
||||
id: chartHover
|
||||
anchors.fill: parent
|
||||
@@ -533,11 +575,11 @@ Window {
|
||||
var pl = root.chartMarginLeft
|
||||
var pw = width - pl - root.chartMarginRight
|
||||
if (pw <= 0) return
|
||||
// X 轴用与绘制一致的固定 5 分钟窗口 [tMax-300, tMax] 反推时间戳，
|
||||
// X 轴用与绘制一致的可配置窗口 [tMax-timeWindowSec, tMax] 反推时间戳，
|
||||
// 保证 Hover 辅助线与折线上的采样点严格对齐
|
||||
var tMax = dl[n - 1].x
|
||||
var tMin = tMax - 300
|
||||
var tRange = 300
|
||||
var tRange = root.timeWindowSec
|
||||
var tMin = tMax - tRange
|
||||
// 将 mouseX 限制在绘图区内，再线性反推时间戳
|
||||
var clampedX = Math.max(pl, Math.min(mouse.x, pl + pw))
|
||||
var target = tMin + (clampedX - pl) / pw * tRange
|
||||
@@ -580,7 +622,7 @@ Window {
|
||||
text: root.hoverHint.length > 0
|
||||
? root.hoverHint : qsTr("Hover over the curve for details")
|
||||
font.pixelSize: 11
|
||||
color: root.hoverHint.length > 0 ? root.textPrimary : root.textTertiary
|
||||
color: root.hoverHint.length > 0 ? theme.textPrimary : theme.textTertiary
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -0,0 +1,51 @@
|
||||
// SPDX-FileCopyrightText: 2026 Jokul
|
||||
//
|
||||
// SPDX-License-Identifier: LGPL-3.0-or-later
|
||||
|
||||
// 独立窗口公共主题色提供者
|
||||
// 消除 AboutWindow / SettingsWindow / TrafficChartWindow 三个独立顶层窗口之间的
|
||||
// 主题颜色样板重复（此前各窗口各持一份 isDarkMode ? 深 : 浅 的颜色定义，
|
||||
// 改一处需同步多处）。现集中到本文件，各窗口实例化 WindowTheme { id: theme } 后
|
||||
// 统一经 theme.xxx 访问，仅需向 theme.isDarkMode 传入深色模式标记。
|
||||
// 设计原因：
|
||||
// - 深/浅主题由 networkview.qml 依据 DockPalette 检测任务栏深浅后通过 isDarkMode 传入，
|
||||
// 浅色取值与原各窗口硬编码完全一致，保证独立预览时视觉不变。
|
||||
// - 个别窗口存在差异值（如 SettingsWindow 的 winBg 浅色为 #F5F5F5、lineColor 为
|
||||
// #E0E0E0），因此每个颜色拆成 light/dark 一对可覆盖属性，派生色由它们计算，
|
||||
// 差异窗口仅需覆盖对应浅/深值即可，无需整体重写。
|
||||
import QtQuick 2.15
|
||||
|
||||
QtObject {
|
||||
id: theme
|
||||
|
||||
// 输入：深色模式标记，由父窗口从 networkview.qml 传入
|
||||
property bool isDarkMode: false
|
||||
|
||||
// ---- 浅色/深色取色对（默认值与 AboutWindow/TrafficChartWindow 一致，个别窗口可覆盖差异值）----
|
||||
property color lightWinBg: "#FFFFFF"
|
||||
property color darkWinBg: "#202020"
|
||||
property color lightCardBg: "#FFFFFF"
|
||||
property color darkCardBg: "#2A2A2A"
|
||||
property color lightLineColor: "#E8E8E8"
|
||||
property color darkLineColor: "#383838"
|
||||
property color lightTextPrimary: "#333333"
|
||||
property color darkTextPrimary: "#E0E0E0"
|
||||
property color lightTextSecondary: "#666666"
|
||||
property color darkTextSecondary: "#AAAAAA"
|
||||
property color lightTextTertiary: "#999999"
|
||||
property color darkTextTertiary: "#888888"
|
||||
property color lightIconGray: "#777777"
|
||||
property color darkIconGray: "#AAAAAA"
|
||||
property color lightHoverBg: "#F0F0F0"
|
||||
property color darkHoverBg: "#353535"
|
||||
|
||||
// ---- 派生主题色：isDarkMode 为 false 时取值与原浅色硬编码完全一致 ----
|
||||
readonly property color winBg: isDarkMode ? darkWinBg : lightWinBg
|
||||
readonly property color cardBg: isDarkMode ? darkCardBg : lightCardBg
|
||||
readonly property color lineColor: isDarkMode ? darkLineColor : lightLineColor
|
||||
readonly property color textPrimary: isDarkMode ? darkTextPrimary : lightTextPrimary
|
||||
readonly property color textSecondary: isDarkMode ? darkTextSecondary : lightTextSecondary
|
||||
readonly property color textTertiary: isDarkMode ? darkTextTertiary : lightTextTertiary
|
||||
readonly property color iconGray: isDarkMode ? darkIconGray : lightIconGray
|
||||
readonly property color hoverBg: isDarkMode ? darkHoverBg : lightHoverBg
|
||||
}
|
||||
+61
-5
@@ -77,6 +77,23 @@ AppletItem {
|
||||
}
|
||||
}
|
||||
|
||||
// 拆分速度字符串为整数部分：formatSpeedShort("194.07K") -> "194"
|
||||
// 用于任务栏双行数值小数点对齐：整数部分右对齐，小数部分左对齐，
|
||||
// 整数位数不同时小数点仍垂直对齐
|
||||
function formatSpeedIntPart(bytesPerSec) {
|
||||
var str = formatSpeedShort(bytesPerSec)
|
||||
var idx = str.indexOf('.')
|
||||
return idx < 0 ? str : str.substring(0, idx)
|
||||
}
|
||||
|
||||
// 拆分速度字符串为小数+单位部分：formatSpeedShort("194.07K") -> ".07K"
|
||||
// 与 formatSpeedIntPart 配合，分别渲染实现小数点对齐
|
||||
function formatSpeedDecimalPart(bytesPerSec) {
|
||||
var str = formatSpeedShort(bytesPerSec)
|
||||
var idx = str.indexOf('.')
|
||||
return idx < 0 ? "" : str.substring(idx)
|
||||
}
|
||||
|
||||
// 带单位的速度/总量格式化函数（formatSpeed / formatTotal）已移至 NetCommon，
|
||||
// 本文件未直接使用；弹窗与图表窗口经 common.formatSpeed / common.formatTotal 调用
|
||||
|
||||
@@ -99,17 +116,31 @@ AppletItem {
|
||||
// 用户主动选色后覆盖，空串回退到 primaryText 保持自适应
|
||||
readonly property color speedTextColor: (applet && applet.textColor.length > 0) ? applet.textColor : primaryText
|
||||
|
||||
// 任务栏图标区：双行紧凑数值，箭头与数值紧贴、左对齐
|
||||
// 设计原因：箭头与数值作为一组固定在左侧，数值左对齐紧贴箭头；
|
||||
// 任务栏图标区：双行紧凑数值，箭头与数值紧贴
|
||||
// 设计原因：箭头与数值作为一组固定在左侧；
|
||||
// 不给每行固定高度，让 RowLayout 按内容自然高度排列，
|
||||
// 整组垂直居中于 dock 区域，避免两行间出现过大间隙
|
||||
// 小数点对齐：整数部分右对齐到两行最大整数宽度，小数部分左对齐，
|
||||
// 整数位数不同时小数点仍垂直对齐；箭头与数值间距固定不随位数变化
|
||||
Column {
|
||||
id: horizontalSpeed
|
||||
visible: !root.isVerticalDock
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
anchors.left: parent.left
|
||||
anchors.leftMargin: 4
|
||||
anchors.right: parent.right
|
||||
anchors.rightMargin: 4
|
||||
spacing: 0
|
||||
|
||||
// 两行整数部分的最大字符数：动态计算，整数短的行补占位到此宽度
|
||||
property int maxIntDigits: Math.max(
|
||||
root.formatSpeedIntPart(root.downloadSpeed).length,
|
||||
root.formatSpeedIntPart(root.uploadSpeed).length
|
||||
)
|
||||
// 整数部分固定宽度：按最大字符数 × 单字符宽度估算
|
||||
// 单字符宽度约为 dockSize * 0.14（数值字号的 ~55%）
|
||||
property real intPartWidth: maxIntDigits * root.dockSize * 0.14
|
||||
|
||||
// 下载速度行
|
||||
RowLayout {
|
||||
spacing: 2
|
||||
@@ -121,8 +152,20 @@ AppletItem {
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
}
|
||||
|
||||
// 整数部分：右对齐到两行最大整数宽度，短的补占位
|
||||
Text {
|
||||
text: root.formatSpeedShort(root.downloadSpeed)
|
||||
text: root.formatSpeedIntPart(root.downloadSpeed)
|
||||
font.pixelSize: root.dockSize * 0.25
|
||||
font.weight: Font.Medium
|
||||
color: root.speedTextColor
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
Layout.preferredWidth: horizontalSpeed.intPartWidth
|
||||
horizontalAlignment: Text.AlignRight
|
||||
}
|
||||
|
||||
// 小数+单位部分：左对齐，紧跟整数部分
|
||||
Text {
|
||||
text: root.formatSpeedDecimalPart(root.downloadSpeed)
|
||||
font.pixelSize: root.dockSize * 0.25
|
||||
font.weight: Font.Medium
|
||||
color: root.speedTextColor
|
||||
@@ -142,8 +185,20 @@ AppletItem {
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
}
|
||||
|
||||
// 整数部分：右对齐到两行最大整数宽度，短的补占位
|
||||
Text {
|
||||
text: root.formatSpeedShort(root.uploadSpeed)
|
||||
text: root.formatSpeedIntPart(root.uploadSpeed)
|
||||
font.pixelSize: root.dockSize * 0.25
|
||||
font.weight: Font.Medium
|
||||
color: root.speedTextColor
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
Layout.preferredWidth: horizontalSpeed.intPartWidth
|
||||
horizontalAlignment: Text.AlignRight
|
||||
}
|
||||
|
||||
// 小数+单位部分：左对齐，紧跟整数部分
|
||||
Text {
|
||||
text: root.formatSpeedDecimalPart(root.uploadSpeed)
|
||||
font.pixelSize: root.dockSize * 0.25
|
||||
font.weight: Font.Medium
|
||||
color: root.speedTextColor
|
||||
@@ -264,7 +319,7 @@ AppletItem {
|
||||
// 弹窗内容由 NetworkPopup.qml 提供，传入 applet，内部自行派生颜色和数据
|
||||
PanelPopup {
|
||||
id: networkPopup
|
||||
width: 360
|
||||
width: 330
|
||||
height: 320
|
||||
popupX: DockPanelPositioner.x
|
||||
popupY: DockPanelPositioner.y
|
||||
@@ -280,6 +335,7 @@ AppletItem {
|
||||
NetworkPopup {
|
||||
id: popupContent
|
||||
applet: root.applet
|
||||
common: common
|
||||
anchors.fill: parent
|
||||
}
|
||||
|
||||
|
||||
+306
-19
@@ -17,6 +17,7 @@
|
||||
#include <QTranslator>
|
||||
#include <QLocale>
|
||||
#include <QCoreApplication>
|
||||
#include <QProcess>
|
||||
|
||||
DS_BEGIN_NAMESPACE
|
||||
|
||||
@@ -30,9 +31,22 @@ NetworkMonitorApplet::NetworkMonitorApplet(QObject *parent)
|
||||
, m_uploadSpeed(0)
|
||||
, m_totalDownload(0)
|
||||
, m_totalUpload(0)
|
||||
, m_rxPackets(0)
|
||||
, m_txPackets(0)
|
||||
, m_rxErrors(0)
|
||||
, m_txErrors(0)
|
||||
, m_rxDropped(0)
|
||||
, m_txDropped(0)
|
||||
, m_linkSpeed(0)
|
||||
, m_refreshInterval(1000)
|
||||
, m_tcpConnections(0)
|
||||
, m_wifiSignal(0)
|
||||
, m_lowFreqCounter(4)
|
||||
, m_ipDetectCounter(4)
|
||||
, m_ready(false)
|
||||
, m_firstUpdate(true)
|
||||
, m_textColor()
|
||||
, m_historyDirty(true)
|
||||
{
|
||||
// 从独立配置文件读取持久化的字体颜色
|
||||
// 设计原因：使用独立配置文件避免污染 dde-shell 的共享配置，
|
||||
@@ -55,6 +69,14 @@ NetworkMonitorApplet::NetworkMonitorApplet(QObject *parent)
|
||||
if (settings.contains(QStringLiteral("activeInterface"))) {
|
||||
m_activeInterface = settings.value(QStringLiteral("activeInterface")).toString();
|
||||
}
|
||||
|
||||
// 从配置文件读取持久化的刷新间隔（毫秒），仅接受 1/2/5 秒合法值
|
||||
if (settings.contains(QStringLiteral("refreshInterval"))) {
|
||||
const int iv = settings.value(QStringLiteral("refreshInterval")).toInt();
|
||||
if (iv == 1000 || iv == 2000 || iv == 5000) {
|
||||
m_refreshInterval = iv;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
NetworkMonitorApplet::~NetworkMonitorApplet()
|
||||
@@ -84,7 +106,8 @@ bool NetworkMonitorApplet::init()
|
||||
// 启动定时刷新
|
||||
m_refreshTimer = new QTimer(this);
|
||||
connect(m_refreshTimer, &QTimer::timeout, this, &NetworkMonitorApplet::refresh);
|
||||
m_refreshTimer->start(1000); // 每秒刷新一次
|
||||
// 用持久化的刷新间隔启动（默认 1000ms = 1 秒）
|
||||
m_refreshTimer->start(m_refreshInterval);
|
||||
|
||||
// 初始读取
|
||||
readNetworkStats();
|
||||
@@ -139,6 +162,53 @@ QString NetworkMonitorApplet::ipv6Address() const
|
||||
return m_ipv6Address;
|
||||
}
|
||||
|
||||
// ---- 活动接口包统计 getter（累计值，自开机起）----
|
||||
// 供弹窗接口信息区展示收发包/错误/丢包数
|
||||
quint64 NetworkMonitorApplet::rxPackets() const { return m_rxPackets; }
|
||||
quint64 NetworkMonitorApplet::txPackets() const { return m_txPackets; }
|
||||
quint64 NetworkMonitorApplet::rxErrors() const { return m_rxErrors; }
|
||||
quint64 NetworkMonitorApplet::txErrors() const { return m_txErrors; }
|
||||
quint64 NetworkMonitorApplet::rxDropped() const { return m_rxDropped; }
|
||||
quint64 NetworkMonitorApplet::txDropped() const { return m_txDropped; }
|
||||
|
||||
// 返回活动接口的链路协商速率（Mbps），0 表示不可用
|
||||
int NetworkMonitorApplet::linkSpeed() const { return m_linkSpeed; }
|
||||
|
||||
// 返回刷新间隔（毫秒）
|
||||
int NetworkMonitorApplet::refreshInterval() const { return m_refreshInterval; }
|
||||
|
||||
// 设置刷新间隔（毫秒），校验后持久化并即时生效
|
||||
// 设计原因：仅接受 1/2/5 秒，避免非法值破坏刷新频率；
|
||||
// 速度计算基于真实流逝时间（elapsedSec），改变间隔不影响计算正确性
|
||||
void NetworkMonitorApplet::setRefreshInterval(int ms)
|
||||
{
|
||||
if (ms != 1000 && ms != 2000 && ms != 5000) {
|
||||
return;
|
||||
}
|
||||
if (m_refreshInterval == ms) {
|
||||
return;
|
||||
}
|
||||
m_refreshInterval = ms;
|
||||
if (m_refreshTimer) {
|
||||
m_refreshTimer->start(m_refreshInterval);
|
||||
}
|
||||
|
||||
// 持久化到独立配置文件，重启后仍生效
|
||||
const QString configPath = QStandardPaths::writableLocation(QStandardPaths::ConfigLocation)
|
||||
+ QStringLiteral("/jnetapplet/settings.ini");
|
||||
QSettings settings(configPath, QSettings::IniFormat);
|
||||
settings.setValue(QStringLiteral("refreshInterval"), m_refreshInterval);
|
||||
settings.sync();
|
||||
|
||||
emit refreshIntervalChanged();
|
||||
}
|
||||
|
||||
// 返回当前活动接口的 TCP ESTABLISHED 连接数
|
||||
int NetworkMonitorApplet::tcpConnections() const { return m_tcpConnections; }
|
||||
|
||||
// 返回活动接口的 WiFi 信号强度（dBm），0 表示不可用
|
||||
int NetworkMonitorApplet::wifiSignal() const { return m_wifiSignal; }
|
||||
|
||||
// 返回插件版本号，从 dde-shell 插件元数据（metadata.json）读取
|
||||
// 版本唯一源为 CMakeLists.txt 的 project(VERSION)，经 configure_file 写入 metadata.json，
|
||||
// dde-shell 加载时存入 DPluginMetaData，此处通过继承自 DApplet 的 pluginMetaData() 读取
|
||||
@@ -191,34 +261,42 @@ void NetworkMonitorApplet::setTextColor(const QString &color)
|
||||
}
|
||||
|
||||
// 返回当前活动接口的下行速度历史，转换为 QVariantList of QPointF 供 QML 使用
|
||||
// 设计原因：QPointF 仅携带 x/y 两个值，上传与下载分别对应两个列表
|
||||
// 设计原因：QPointF 仅携带 x/y 两个值，上传与下载分别对应两个列表；
|
||||
// 结果缓存于成员变量，仅当 m_historyDirty 时重建，避免 QML 每次读取都重新构造 300 个点
|
||||
QVariantList NetworkMonitorApplet::speedHistoryDownload() const
|
||||
{
|
||||
QVariantList list;
|
||||
if (m_activeInterface.isEmpty() || !m_speedHistory.contains(m_activeInterface)) {
|
||||
return list;
|
||||
if (m_historyDirty) {
|
||||
rebuildHistoryCache();
|
||||
}
|
||||
const QVector<SpeedSample> &samples = m_speedHistory[m_activeInterface];
|
||||
list.reserve(samples.size());
|
||||
for (const SpeedSample &s : samples) {
|
||||
list.append(QPointF(s.timestamp, s.downloadSpeed));
|
||||
}
|
||||
return list;
|
||||
return m_cachedHistoryDl;
|
||||
}
|
||||
|
||||
// 返回当前活动接口的上行速度历史，结构同 speedHistoryDownload
|
||||
QVariantList NetworkMonitorApplet::speedHistoryUpload() const
|
||||
{
|
||||
QVariantList list;
|
||||
if (m_activeInterface.isEmpty() || !m_speedHistory.contains(m_activeInterface)) {
|
||||
return list;
|
||||
if (m_historyDirty) {
|
||||
rebuildHistoryCache();
|
||||
}
|
||||
return m_cachedHistoryUpload;
|
||||
}
|
||||
|
||||
// 重建上下行历史缓存（一次遍历同时填充两个列表）
|
||||
// 仅当 dirty 时由两个 getter 调用，避免重复构建；
|
||||
// 单 dirty 标记 + 一次重建双缓存，保证先后读取两个列表时数据一致
|
||||
void NetworkMonitorApplet::rebuildHistoryCache() const
|
||||
{
|
||||
m_cachedHistoryDl.clear();
|
||||
m_cachedHistoryUpload.clear();
|
||||
if (!m_activeInterface.isEmpty() && m_speedHistory.contains(m_activeInterface)) {
|
||||
const QVector<SpeedSample> &samples = m_speedHistory[m_activeInterface];
|
||||
list.reserve(samples.size());
|
||||
m_cachedHistoryDl.reserve(samples.size());
|
||||
m_cachedHistoryUpload.reserve(samples.size());
|
||||
for (const SpeedSample &s : samples) {
|
||||
list.append(QPointF(s.timestamp, s.uploadSpeed));
|
||||
m_cachedHistoryDl.append(QPointF(s.timestamp, s.downloadSpeed));
|
||||
m_cachedHistoryUpload.append(QPointF(s.timestamp, s.uploadSpeed));
|
||||
}
|
||||
return list;
|
||||
}
|
||||
m_historyDirty = false;
|
||||
}
|
||||
|
||||
void NetworkMonitorApplet::refresh()
|
||||
@@ -240,6 +318,19 @@ void NetworkMonitorApplet::setActiveInterface(const QString &interface)
|
||||
m_activeInterface = interface;
|
||||
m_firstUpdate = true;
|
||||
|
||||
// 接口切换后历史数据变化，标记脏缓存让趋势图立即重建
|
||||
m_historyDirty = true;
|
||||
|
||||
// 接口切换后包统计指向新接口，旧值不再有效，重置并通知 QML
|
||||
// 设计原因：包统计为各接口独立的累计值，切换后应显示新接口的数据
|
||||
m_rxPackets = 0;
|
||||
m_txPackets = 0;
|
||||
m_rxErrors = 0;
|
||||
m_txErrors = 0;
|
||||
m_rxDropped = 0;
|
||||
m_txDropped = 0;
|
||||
emit packetStatsChanged();
|
||||
|
||||
// 持久化到配置文件，下次启动自动加载用户选择的网卡
|
||||
// 设计原因：弹窗 chip 和设置窗口都调用此方法，统一持久化保证两处选择一致
|
||||
const QString configPath = QStandardPaths::writableLocation(QStandardPaths::ConfigLocation)
|
||||
@@ -253,6 +344,8 @@ void NetworkMonitorApplet::setActiveInterface(const QString &interface)
|
||||
emit speedHistoryChanged();
|
||||
// 接口切换后立即检测新接口的 IP 地址
|
||||
detectIpAddress();
|
||||
// 接口切换后立即读取新接口的链路速率与 WiFi 信号
|
||||
detectLowFreqStats();
|
||||
}
|
||||
}
|
||||
|
||||
@@ -276,7 +369,8 @@ void NetworkMonitorApplet::readNetworkStats()
|
||||
if (line.isEmpty()) continue;
|
||||
|
||||
// 格式: "interface: rx_bytes rx_packets rx_errors rx_dropped ... tx_bytes tx_packets tx_errors tx_dropped ..."
|
||||
QRegularExpression re("^([^:]+):\\s+(\\d+)\\s+(\\d+)\\s+(\\d+)\\s+(\\d+)\\s+\\d+\\s+\\d+\\s+\\d+\\s+\\d+\\s+(\\d+)\\s+(\\d+)\\s+(\\d+)\\s+(\\d+)");
|
||||
// static const 仅首次调用时编译正则一次，后续复用，避免每秒对每行重复编译
|
||||
static const QRegularExpression re("^([^:]+):\\s+(\\d+)\\s+(\\d+)\\s+(\\d+)\\s+(\\d+)\\s+\\d+\\s+\\d+\\s+\\d+\\s+\\d+\\s+(\\d+)\\s+(\\d+)\\s+(\\d+)\\s+(\\d+)");
|
||||
QRegularExpressionMatch match = re.match(line);
|
||||
|
||||
if (match.hasMatch()) {
|
||||
@@ -357,9 +451,19 @@ void NetworkMonitorApplet::readNetworkStats()
|
||||
}
|
||||
|
||||
calculateSpeed();
|
||||
// 每次刷新都检测 IP，以应对 DHCP 续约等 IP 变更场景
|
||||
// IP 地址变化频率极低（DHCP 续约/网络切换等），降频至每 5 秒检测一次，
|
||||
// 减少每秒 QNetworkInterface::interfaceFromName 的系统查询开销
|
||||
// 计数器每次 refresh 递增，达到 5 时归零并执行检测
|
||||
if (++m_ipDetectCounter >= 5) {
|
||||
m_ipDetectCounter = 0;
|
||||
detectIpAddress();
|
||||
}
|
||||
// 链路速率与 WiFi 信号同样变化频率低，每 5 秒检测一次
|
||||
if (++m_lowFreqCounter >= 5) {
|
||||
m_lowFreqCounter = 0;
|
||||
detectLowFreqStats();
|
||||
}
|
||||
}
|
||||
|
||||
void NetworkMonitorApplet::calculateSpeed()
|
||||
{
|
||||
@@ -369,6 +473,13 @@ void NetworkMonitorApplet::calculateSpeed()
|
||||
const double elapsedSec = (nowMs - m_lastTimestampMs) / 1000.0;
|
||||
m_lastTimestampMs = nowMs;
|
||||
|
||||
// 记录旧值用于 dirty 比较：网络空闲时速度/总量可能不变，
|
||||
// 仅在真正变化时才发射信号，避免 QML 每秒无效重绘
|
||||
const double oldDownload = m_downloadSpeed;
|
||||
const double oldUpload = m_uploadSpeed;
|
||||
const qint64 oldTotalDownload = m_totalDownload;
|
||||
const qint64 oldTotalUpload = m_totalUpload;
|
||||
|
||||
// ---- 活动接口速度计算（用于任务栏显示和总量累加）----
|
||||
if (m_firstUpdate) {
|
||||
// 首次更新或接口切换后：仅记录基线，不计算速度
|
||||
@@ -393,6 +504,34 @@ void NetworkMonitorApplet::calculateSpeed()
|
||||
m_lastTxBytes = currentTxBytes;
|
||||
}
|
||||
|
||||
// ---- 活动接口包统计（累计值，自开机起）----
|
||||
// 直接从当前活动接口读取收发包/错误/丢包计数，任一值变化时发射 packetStatsChanged
|
||||
if (!m_activeInterface.isEmpty() && m_interfaces.contains(m_activeInterface)) {
|
||||
const NetworkInterface &iface = m_interfaces[m_activeInterface];
|
||||
if (m_rxPackets != static_cast<quint64>(iface.rxPackets)
|
||||
|| m_txPackets != static_cast<quint64>(iface.txPackets)
|
||||
|| m_rxErrors != static_cast<quint64>(iface.rxErrors)
|
||||
|| m_txErrors != static_cast<quint64>(iface.txErrors)
|
||||
|| m_rxDropped != static_cast<quint64>(iface.rxDropped)
|
||||
|| m_txDropped != static_cast<quint64>(iface.txDropped)) {
|
||||
m_rxPackets = static_cast<quint64>(iface.rxPackets);
|
||||
m_txPackets = static_cast<quint64>(iface.txPackets);
|
||||
m_rxErrors = static_cast<quint64>(iface.rxErrors);
|
||||
m_txErrors = static_cast<quint64>(iface.txErrors);
|
||||
m_rxDropped = static_cast<quint64>(iface.rxDropped);
|
||||
m_txDropped = static_cast<quint64>(iface.txDropped);
|
||||
emit packetStatsChanged();
|
||||
}
|
||||
}
|
||||
|
||||
// ---- TCP 连接数（每秒统计）----
|
||||
// /proc/net/tcp 与 tcp6 文件很小，遍历开销低；仅在连接数变化时发射信号
|
||||
const int conns = countTcpConnections();
|
||||
if (m_tcpConnections != conns) {
|
||||
m_tcpConnections = conns;
|
||||
emit tcpConnectionsChanged();
|
||||
}
|
||||
|
||||
// ---- 为所有接口采集速度历史（非仅活动接口）----
|
||||
// 设计原因：原仅采集活动接口，切换到非活动接口时趋势图为空需等待数分钟。
|
||||
// 改为遍历所有接口计算各自速度并追加历史，切换接口时趋势图立即有数据。
|
||||
@@ -426,12 +565,19 @@ void NetworkMonitorApplet::calculateSpeed()
|
||||
m_lastRxBytesByIface[name] = iface.rxBytes;
|
||||
m_lastTxBytesByIface[name] = iface.txBytes;
|
||||
}
|
||||
// 历史采样点已追加，标记脏缓存，QML 下次读取时重建
|
||||
m_historyDirty = true;
|
||||
emit speedHistoryChanged();
|
||||
}
|
||||
|
||||
// 仅在速度/总量实际变化时发射信号，避免空闲时每秒触发 QML 无效重绘
|
||||
if (m_downloadSpeed != oldDownload || m_uploadSpeed != oldUpload) {
|
||||
emit speedChanged();
|
||||
}
|
||||
if (m_totalDownload != oldTotalDownload || m_totalUpload != oldTotalUpload) {
|
||||
emit totalChanged();
|
||||
}
|
||||
}
|
||||
|
||||
void NetworkMonitorApplet::detectInterfaces()
|
||||
{
|
||||
@@ -509,6 +655,147 @@ void NetworkMonitorApplet::detectIpAddress()
|
||||
}
|
||||
}
|
||||
|
||||
// 低频统计检测：链路速率与 WiFi 信号（每 5 秒或接口切换时），变化时发射对应信号
|
||||
// 设计原因：这两项数据变化频率极低（协商速率/信号强度基本稳定），
|
||||
// 无需每秒读取，降频降低系统调用与文件读取开销
|
||||
void NetworkMonitorApplet::detectLowFreqStats()
|
||||
{
|
||||
if (!m_activeInterface.isEmpty()) {
|
||||
const int speed = detectLinkSpeed(m_activeInterface);
|
||||
if (m_linkSpeed != speed) {
|
||||
m_linkSpeed = speed;
|
||||
emit linkSpeedChanged();
|
||||
}
|
||||
const int sig = detectWifiSignal(m_activeInterface);
|
||||
if (m_wifiSignal != sig) {
|
||||
m_wifiSignal = sig;
|
||||
emit wifiSignalChanged();
|
||||
}
|
||||
} else {
|
||||
// 无活动接口时归零，避免显示上一接口的残留数据
|
||||
if (m_linkSpeed != 0) {
|
||||
m_linkSpeed = 0;
|
||||
emit linkSpeedChanged();
|
||||
}
|
||||
if (m_wifiSignal != 0) {
|
||||
m_wifiSignal = 0;
|
||||
emit wifiSignalChanged();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 读取指定接口的链路协商速率（Mbps）
|
||||
// 有线：直接读 /sys/class/net/<iface>/speed（Mbps）
|
||||
// 无线：speed 文件常返回错误（EINVAL），降级执行 `iw dev <iface> link` 解析 bitrate
|
||||
// 任何一步失败都返回 0（表示不可用），不抛出不记录
|
||||
int NetworkMonitorApplet::detectLinkSpeed(const QString &iface)
|
||||
{
|
||||
// 尝试 /sys/class/net/<iface>/speed
|
||||
QFile f(QStringLiteral("/sys/class/net/%1/speed").arg(iface));
|
||||
if (f.open(QIODevice::ReadOnly | QIODevice::Text)) {
|
||||
const QString val = QString::fromLatin1(f.readAll()).trimmed();
|
||||
f.close();
|
||||
bool ok = false;
|
||||
const int speed = val.toInt(&ok);
|
||||
if (ok && speed >= 0) {
|
||||
return speed;
|
||||
}
|
||||
}
|
||||
|
||||
// 无线网卡降级：解析 iw dev link 的 bitrate
|
||||
if (iface.startsWith("wlp") || iface.startsWith("wlan")) {
|
||||
QProcess proc;
|
||||
proc.start(QStringLiteral("iw"), {QStringLiteral("dev"), iface, QStringLiteral("link")});
|
||||
if (proc.waitForFinished(1000)) {
|
||||
const int br = parseIwBitrate(QString::fromUtf8(proc.readAllStandardOutput()));
|
||||
if (br > 0) {
|
||||
return br;
|
||||
}
|
||||
}
|
||||
}
|
||||
return 0;
|
||||
}
|
||||
|
||||
// 解析 `iw dev <iface> link` 输出中的 bitrate（Mbps），失败返回 0
|
||||
// 输出形如 " bitrate: 866.7 MBit/s"，也兼容 "Gbit/s"（换算为 Mbps）
|
||||
int NetworkMonitorApplet::parseIwBitrate(const QString &output) const
|
||||
{
|
||||
static const QRegularExpression re("bitrate:\\s*([\\d.]+)\\s*(M|G)bit/s");
|
||||
QRegularExpressionMatch m = re.match(output);
|
||||
if (!m.hasMatch()) {
|
||||
return 0;
|
||||
}
|
||||
const double val = m.captured(1).toDouble();
|
||||
const bool isGigabit = m.captured(2) == QLatin1String("G");
|
||||
return isGigabit ? qRound(val * 1000.0) : qRound(val);
|
||||
}
|
||||
|
||||
// 统计 /proc/net/tcp 与 /proc/net/tcp6 中 ESTABLISHED（状态 01）的连接数
|
||||
// 文件第 4 列（st）为连接状态码，01 表示 ESTABLISHED；
|
||||
// 任一文件读取失败时跳过，不因单个文件缺失而失败
|
||||
int NetworkMonitorApplet::countTcpConnections() const
|
||||
{
|
||||
int count = 0;
|
||||
const QStringList paths = {QStringLiteral("/proc/net/tcp"), QStringLiteral("/proc/net/tcp6")};
|
||||
for (const QString &path : paths) {
|
||||
QFile f(path);
|
||||
if (!f.open(QIODevice::ReadOnly | QIODevice::Text)) {
|
||||
continue;
|
||||
}
|
||||
QTextStream stream(&f);
|
||||
// 跳过标题行
|
||||
stream.readLine();
|
||||
while (!stream.atEnd()) {
|
||||
const QString line = stream.readLine().trimmed();
|
||||
if (line.isEmpty()) {
|
||||
continue;
|
||||
}
|
||||
const QStringList parts = line.split(QRegularExpression("\\s+"), Qt::SkipEmptyParts);
|
||||
if (parts.size() > 3 && parts[3] == QLatin1String("01")) {
|
||||
++count;
|
||||
}
|
||||
}
|
||||
f.close();
|
||||
}
|
||||
return count;
|
||||
}
|
||||
|
||||
// 读取指定接口的 WiFi 信号强度（dBm）
|
||||
// 仅无线接口（wlp/wlan）有效；/proc/net/wireless 桌面环境可能不存在（返回 0）
|
||||
// 该文件每行形如 "wlp3s0: 60. -65. -256 0 ..."，level（dBm）为第 3 个数值字段
|
||||
int NetworkMonitorApplet::detectWifiSignal(const QString &iface)
|
||||
{
|
||||
if (!iface.startsWith("wlp") && !iface.startsWith("wlan")) {
|
||||
return 0;
|
||||
}
|
||||
QFile f(QStringLiteral("/proc/net/wireless"));
|
||||
if (!f.open(QIODevice::ReadOnly | QIODevice::Text)) {
|
||||
return 0;
|
||||
}
|
||||
QTextStream stream(&f);
|
||||
// 跳过前两行标题
|
||||
stream.readLine();
|
||||
stream.readLine();
|
||||
int sig = 0;
|
||||
while (!stream.atEnd()) {
|
||||
const QString line = stream.readLine().trimmed();
|
||||
if (line.isEmpty()) {
|
||||
continue;
|
||||
}
|
||||
const QStringList parts = line.split(QRegularExpression("\\s+"), Qt::SkipEmptyParts);
|
||||
if (parts.size() > 3 && parts[0].startsWith(iface)) {
|
||||
bool ok = false;
|
||||
const double level = parts[3].toDouble(&ok);
|
||||
if (ok) {
|
||||
sig = qRound(level);
|
||||
}
|
||||
break;
|
||||
}
|
||||
}
|
||||
f.close();
|
||||
return sig;
|
||||
}
|
||||
|
||||
// 判断是否为物理网卡
|
||||
// 物理网卡前缀：无线 wlp/wlan/wifi，有线 enp/eth
|
||||
// 虚拟接口（Meta/tun/tap/docker/veth/br-）返回 false，
|
||||
|
||||
@@ -57,6 +57,23 @@ class NetworkMonitorApplet : public DApplet
|
||||
Q_PROPERTY(QString ipAddress READ ipAddress NOTIFY ipAddressChanged)
|
||||
// 活动接口的 IPv6 全球地址（已过滤 link-local 和 loopback），供 QML 显示
|
||||
Q_PROPERTY(QString ipv6Address READ ipv6Address NOTIFY ipv6AddressChanged)
|
||||
// 活动接口的收发包/错误/丢包累计统计（自开机起累计值），供弹窗接口信息区展示
|
||||
// 全部用 quint64 类型，QML 侧可直接读取；任一值变化时统一发射 packetStatsChanged
|
||||
Q_PROPERTY(quint64 rxPackets READ rxPackets NOTIFY packetStatsChanged)
|
||||
Q_PROPERTY(quint64 txPackets READ txPackets NOTIFY packetStatsChanged)
|
||||
Q_PROPERTY(quint64 rxErrors READ rxErrors NOTIFY packetStatsChanged)
|
||||
Q_PROPERTY(quint64 txErrors READ txErrors NOTIFY packetStatsChanged)
|
||||
Q_PROPERTY(quint64 rxDropped READ rxDropped NOTIFY packetStatsChanged)
|
||||
Q_PROPERTY(quint64 txDropped READ txDropped NOTIFY packetStatsChanged)
|
||||
// 活动接口的链路协商速率（Mbps）：有线读 /sys/class/net/<iface>/speed，
|
||||
// 无线读失败时降级解析 `iw dev link` 的 bitrate；0 表示不可用
|
||||
Q_PROPERTY(int linkSpeed READ linkSpeed NOTIFY linkSpeedChanged)
|
||||
// 刷新间隔（毫秒），默认 1000，用户在设置窗口选择后持久化并即时生效
|
||||
Q_PROPERTY(int refreshInterval READ refreshInterval WRITE setRefreshInterval NOTIFY refreshIntervalChanged)
|
||||
// 当前活动接口的 TCP ESTABLISHED 连接数，供弹窗展示
|
||||
Q_PROPERTY(int tcpConnections READ tcpConnections NOTIFY tcpConnectionsChanged)
|
||||
// 活动接口的 WiFi 信号强度（dBm，负值如 -65），非无线接口或不可用时为 0
|
||||
Q_PROPERTY(int wifiSignal READ wifiSignal NOTIFY wifiSignalChanged)
|
||||
// 插件版本号，从 dde-shell 元数据读取，版本唯一源为 CMakeLists.txt project(VERSION)
|
||||
Q_PROPERTY(QString version READ version CONSTANT)
|
||||
// 任务栏网速数值字体颜色，空串表示跟随系统主题（由 QML 回退到 primaryText），
|
||||
@@ -84,6 +101,23 @@ public:
|
||||
QString activeInterface() const;
|
||||
QString ipAddress() const;
|
||||
QString ipv6Address() const;
|
||||
// 返回活动接口的收发包/错误/丢包累计值（自开机起），供弹窗接口信息区展示
|
||||
quint64 rxPackets() const;
|
||||
quint64 txPackets() const;
|
||||
quint64 rxErrors() const;
|
||||
quint64 txErrors() const;
|
||||
quint64 rxDropped() const;
|
||||
quint64 txDropped() const;
|
||||
// 返回活动接口的链路协商速率（Mbps），0 表示不可用
|
||||
int linkSpeed() const;
|
||||
// 返回刷新间隔（毫秒）
|
||||
int refreshInterval() const;
|
||||
// 设置刷新间隔（毫秒），校验后持久化并即时生效
|
||||
void setRefreshInterval(int ms);
|
||||
// 返回当前活动接口的 TCP ESTABLISHED 连接数
|
||||
int tcpConnections() const;
|
||||
// 返回活动接口的 WiFi 信号强度（dBm），0 表示不可用
|
||||
int wifiSignal() const;
|
||||
// 返回当前活动接口的下行速度历史（QPointF 列表），供 QML 趋势图绘制
|
||||
QVariantList speedHistoryDownload() const;
|
||||
// 返回当前活动接口的上行速度历史（QPointF 列表），供 QML 趋势图绘制
|
||||
@@ -108,6 +142,16 @@ signals:
|
||||
void activeInterfaceChanged();
|
||||
void ipAddressChanged();
|
||||
void ipv6AddressChanged();
|
||||
// 活动接口包统计（收发包/错误/丢包）变化时通知 QML 更新
|
||||
void packetStatsChanged();
|
||||
// 活动接口链路速率变化时通知 QML 更新
|
||||
void linkSpeedChanged();
|
||||
// 刷新间隔变化时通知 QML 更新
|
||||
void refreshIntervalChanged();
|
||||
// TCP ESTABLISHED 连接数变化时通知 QML 更新
|
||||
void tcpConnectionsChanged();
|
||||
// WiFi 信号强度变化时通知 QML 更新
|
||||
void wifiSignalChanged();
|
||||
void speedHistoryChanged();
|
||||
// 任务栏网速字体颜色变化时通知 QML 更新
|
||||
void textColorChanged();
|
||||
@@ -118,6 +162,16 @@ private:
|
||||
void detectInterfaces();
|
||||
// 检测活动接口的 IPv4 与 IPv6 地址，变化时分别发射对应信号
|
||||
void detectIpAddress();
|
||||
// 低频统计检测：链路速率与 WiFi 信号（每 5 秒），变化时发射对应信号
|
||||
void detectLowFreqStats();
|
||||
// 读取指定接口的链路协商速率（Mbps），无线读 speed 失败时降级解析 iw bitrate
|
||||
int detectLinkSpeed(const QString &iface);
|
||||
// 解析 `iw dev <iface> link` 输出中的 bitrate（Mbps），失败返回 0
|
||||
int parseIwBitrate(const QString &output) const;
|
||||
// 统计 /proc/net/tcp 与 tcp6 中 ESTABLISHED（状态 01）的连接数
|
||||
int countTcpConnections() const;
|
||||
// 读取指定接口的 WiFi 信号强度（dBm），非无线接口或不可用时返回 0
|
||||
int detectWifiSignal(const QString &iface);
|
||||
// 判断是否为物理网卡（无线 wlp/wlan，有线 enp/eth），
|
||||
// 用于自动选择时优先真实网卡而非虚拟代理接口（如 Meta/tun0）
|
||||
bool isPhysicalInterface(const QString &name) const;
|
||||
@@ -148,6 +202,31 @@ private:
|
||||
qint64 m_totalDownload;
|
||||
qint64 m_totalUpload;
|
||||
|
||||
// 活动接口包统计缓存（自开机起累计值），供弹窗接口信息区展示
|
||||
// 设计原因：/proc/net/dev 已解析包计数但此前直接丢弃，现缓存并暴露给 QML
|
||||
quint64 m_rxPackets;
|
||||
quint64 m_txPackets;
|
||||
quint64 m_rxErrors;
|
||||
quint64 m_txErrors;
|
||||
quint64 m_rxDropped;
|
||||
quint64 m_txDropped;
|
||||
|
||||
// IP 地址检测降频计数器：IP 变化频率极低，每 5 次 refresh 才检测一次
|
||||
// 初始化 4 使首次 refresh 立即检测，避免启动后 IP 显示延迟
|
||||
int m_ipDetectCounter;
|
||||
|
||||
// 活动接口链路协商速率（Mbps），0 表示不可用
|
||||
int m_linkSpeed;
|
||||
// 刷新间隔（毫秒），默认 1000，可配置并持久化
|
||||
int m_refreshInterval;
|
||||
// 当前活动接口的 TCP ESTABLISHED 连接数
|
||||
int m_tcpConnections;
|
||||
// 活动接口的 WiFi 信号强度（dBm），0 表示不可用
|
||||
int m_wifiSignal;
|
||||
// 低频统计检测计数器：链路速率/WiFi 信号每 5 次 refresh 检测一次
|
||||
// 初始化 4 使首次 refresh 立即检测
|
||||
int m_lowFreqCounter;
|
||||
|
||||
bool m_ready;
|
||||
bool m_firstUpdate;
|
||||
// 任务栏网速字体颜色，空串表示跟随系统主题
|
||||
@@ -158,8 +237,21 @@ private:
|
||||
// 速度历史环形缓冲：每个接口独立维护一份，key 为接口名
|
||||
// 设计原因：接口切换时趋势图不出现跳变，切回时仍能看到该接口历史
|
||||
QHash<QString, QVector<SpeedSample>> m_speedHistory;
|
||||
// 每个接口最多保留的采样点数：5 分钟 × 60 秒 = 300
|
||||
static constexpr int MAX_HISTORY_SAMPLES = 300;
|
||||
// 每个接口最多保留的采样点数：30 分钟 × 60 秒 = 1800
|
||||
// 设计原因：流量波动图支持 1/5/30 分钟时间窗口切换，需在展示层选择显示范围，
|
||||
// 故后端需存够 30 分钟的历史数据；时间窗口选择是纯 QML 展示层行为，后端只需
|
||||
// 提供足够长的历史缓冲，无需新增 Q_PROPERTY
|
||||
static constexpr int MAX_HISTORY_SAMPLES = 1800;
|
||||
|
||||
// 历史 QVariantList 缓存：避免 QML 每次读取都重新构造 300 个 QPointF
|
||||
// 设计原因：Canvas 每秒读取一次 + hover 时也读取，逐个 append 开销可观；
|
||||
// 用 dirty 标记懒重建，仅当追加采样点或切换接口后重建一次
|
||||
// 注意：getter 为 const，故缓存与 dirty 标记声明为 mutable
|
||||
mutable QVariantList m_cachedHistoryDl;
|
||||
mutable QVariantList m_cachedHistoryUpload;
|
||||
mutable bool m_historyDirty;
|
||||
// 重建历史缓存：仅当 m_historyDirty 时由两个 getter 调用
|
||||
void rebuildHistoryCache() const;
|
||||
};
|
||||
|
||||
DS_END_NAMESPACE
|
||||
@@ -53,33 +53,96 @@
|
||||
</message>
|
||||
<message>
|
||||
<location filename="../package/components/NetworkPopup.qml" line="129"/>
|
||||
<source>IPv4: </source>
|
||||
<translation>IPv4：</translation>
|
||||
<source>No network interface detected</source>
|
||||
<translation>未检测到网络接口</translation>
|
||||
</message>
|
||||
<message>
|
||||
<location filename="../package/components/NetworkPopup.qml" line="138"/>
|
||||
<source>IPv6: </source>
|
||||
<translation>IPv6：</translation>
|
||||
<location filename="../package/components/NetworkPopup.qml" line="181"/>
|
||||
<source>IPv4</source>
|
||||
<translation>IPv4</translation>
|
||||
</message>
|
||||
<message>
|
||||
<location filename="../package/components/NetworkPopup.qml" line="190"/>
|
||||
<location filename="../package/components/NetworkPopup.qml" line="242"/>
|
||||
<source>IPv6</source>
|
||||
<translation>IPv6</translation>
|
||||
</message>
|
||||
<message>
|
||||
<location filename="../package/components/NetworkPopup.qml" line="324"/>
|
||||
<source>Download</source>
|
||||
<translation>下载</translation>
|
||||
</message>
|
||||
<message>
|
||||
<location filename="../package/components/NetworkPopup.qml" line="247"/>
|
||||
<location filename="../package/components/NetworkPopup.qml" line="373"/>
|
||||
<source>Upload</source>
|
||||
<translation>上传</translation>
|
||||
</message>
|
||||
<message>
|
||||
<location filename="../package/components/NetworkPopup.qml" line="282"/>
|
||||
<location filename="../package/components/NetworkPopup.qml" line="427"/>
|
||||
<source>Total</source>
|
||||
<translation>总计</translation>
|
||||
<translation>流量总计</translation>
|
||||
</message>
|
||||
<message>
|
||||
<location filename="../package/components/NetworkPopup.qml" line="459"/>
|
||||
<source>No network interface detected</source>
|
||||
<translation>未检测到网络接口</translation>
|
||||
<location filename="../package/components/NetworkPopup.qml" line="474"/>
|
||||
<source>Packets</source>
|
||||
<translation>包统计</translation>
|
||||
</message>
|
||||
<message>
|
||||
<location filename="../package/components/NetworkPopup.qml" line="483"/>
|
||||
<source>Errors</source>
|
||||
<translation>错误</translation>
|
||||
</message>
|
||||
<message>
|
||||
<location filename="../package/components/NetworkPopup.qml" line="494"/>
|
||||
<source>Dropped</source>
|
||||
<translation>丢包</translation>
|
||||
</message>
|
||||
</context>
|
||||
<context>
|
||||
<name>NetCommon</name>
|
||||
<message>
|
||||
<location filename="../package/components/NetCommon.qml" line="102"/>
|
||||
<source>Loopback</source>
|
||||
<translation>本地回环</translation>
|
||||
</message>
|
||||
<message>
|
||||
<location filename="../package/components/NetCommon.qml" line="103"/>
|
||||
<source>Virtual Interface</source>
|
||||
<translation>虚拟接口</translation>
|
||||
</message>
|
||||
<message>
|
||||
<location filename="../package/components/NetCommon.qml" line="104"/>
|
||||
<source>Wired Network</source>
|
||||
<translation>有线网络</translation>
|
||||
</message>
|
||||
<message>
|
||||
<location filename="../package/components/NetCommon.qml" line="105"/>
|
||||
<source>Wireless Network</source>
|
||||
<translation>无线网络</translation>
|
||||
</message>
|
||||
<message>
|
||||
<location filename="../package/components/NetCommon.qml" line="106"/>
|
||||
<source>Container Network</source>
|
||||
<translation>容器网络</translation>
|
||||
</message>
|
||||
<message>
|
||||
<location filename="../package/components/NetCommon.qml" line="107"/>
|
||||
<source>Bridge</source>
|
||||
<translation>桥接</translation>
|
||||
</message>
|
||||
<message>
|
||||
<location filename="../package/components/NetCommon.qml" line="108"/>
|
||||
<source>VPN</source>
|
||||
<translation>VPN</translation>
|
||||
</message>
|
||||
<message>
|
||||
<location filename="../package/components/NetCommon.qml" line="109"/>
|
||||
<source>Virtual Bridge</source>
|
||||
<translation>虚拟桥接</translation>
|
||||
</message>
|
||||
<message>
|
||||
<location filename="../package/components/NetCommon.qml" line="110"/>
|
||||
<source>Other</source>
|
||||
<translation>其他</translation>
|
||||
</message>
|
||||
</context>
|
||||
<context>
|
||||
@@ -91,51 +154,6 @@
|
||||
<source>Uninstall Plugin</source>
|
||||
<translation>卸载插件</translation>
|
||||
</message>
|
||||
<message>
|
||||
<location filename="../package/components/SettingsWindow.qml" line="73"/>
|
||||
<source>Loopback</source>
|
||||
<translation>本地回环</translation>
|
||||
</message>
|
||||
<message>
|
||||
<location filename="../package/components/SettingsWindow.qml" line="74"/>
|
||||
<source>Virtual Interface</source>
|
||||
<translation>虚拟接口</translation>
|
||||
</message>
|
||||
<message>
|
||||
<location filename="../package/components/SettingsWindow.qml" line="75"/>
|
||||
<source>Wired Network</source>
|
||||
<translation>有线网络</translation>
|
||||
</message>
|
||||
<message>
|
||||
<location filename="../package/components/SettingsWindow.qml" line="76"/>
|
||||
<source>Wireless Network</source>
|
||||
<translation>无线网络</translation>
|
||||
</message>
|
||||
<message>
|
||||
<location filename="../package/components/SettingsWindow.qml" line="77"/>
|
||||
<source>Container Network</source>
|
||||
<translation>容器网络</translation>
|
||||
</message>
|
||||
<message>
|
||||
<location filename="../package/components/SettingsWindow.qml" line="78"/>
|
||||
<source>Bridge</source>
|
||||
<translation>桥接</translation>
|
||||
</message>
|
||||
<message>
|
||||
<location filename="../package/components/SettingsWindow.qml" line="79"/>
|
||||
<source>VPN</source>
|
||||
<translation>VPN</translation>
|
||||
</message>
|
||||
<message>
|
||||
<location filename="../package/components/SettingsWindow.qml" line="80"/>
|
||||
<source>Virtual Bridge</source>
|
||||
<translation>虚拟桥接</translation>
|
||||
</message>
|
||||
<message>
|
||||
<location filename="../package/components/SettingsWindow.qml" line="81"/>
|
||||
<source>Other</source>
|
||||
<translation>其他</translation>
|
||||
</message>
|
||||
<message>
|
||||
<location filename="../package/components/SettingsWindow.qml" line="142"/>
|
||||
<source>Settings</source>
|
||||
|
||||
Reference in New Issue
Block a user