mirror of
https://github.com/AvengeMedia/DankMaterialShell.git
synced 2026-01-27 15:02:50 -05:00
91 lines
2.9 KiB
Markdown
91 lines
2.9 KiB
Markdown
# System Monitor Widgets Usage Example
|
|
|
|
## Installation Complete
|
|
|
|
The CPU and RAM monitor widgets have been successfully created and integrated into your quickshell project:
|
|
|
|
### Files Created:
|
|
- `/Widgets/CpuMonitorWidget.qml` - CPU usage monitor with progress bar and percentage
|
|
- `/Widgets/RamMonitorWidget.qml` - RAM usage monitor with progress bar and percentage
|
|
- `/Services/SystemMonitorService.qml` - Backend service for system monitoring
|
|
|
|
### Files Updated:
|
|
- `/Widgets/qmldir` - Added widget exports
|
|
- `/Services/qmldir` - Added service export
|
|
|
|
## Usage in TopBar
|
|
|
|
To add the system monitor widgets to your TopBar, add them to the right section alongside the BatteryWidget:
|
|
|
|
```qml
|
|
// In TopBar.qml, around line 716 after BatteryWidget
|
|
BatteryWidget {
|
|
anchors.verticalCenter: parent.verticalCenter
|
|
}
|
|
|
|
// Add these new widgets:
|
|
CpuMonitorWidget {
|
|
anchors.verticalCenter: parent.verticalCenter
|
|
showPercentage: true
|
|
showIcon: true
|
|
}
|
|
|
|
RamMonitorWidget {
|
|
anchors.verticalCenter: parent.verticalCenter
|
|
showPercentage: true
|
|
showIcon: true
|
|
}
|
|
```
|
|
|
|
## Widget Features
|
|
|
|
### CpuMonitorWidget:
|
|
- **Real-time CPU usage monitoring** (updates every 2 seconds)
|
|
- **Visual progress bar** with color coding:
|
|
- Green: < 60% usage
|
|
- Orange: 60-80% usage
|
|
- Red: > 80% usage
|
|
- **Tooltip** showing CPU usage, core count, and frequency
|
|
- **Material Design CPU icon** ()
|
|
- **Configurable properties:**
|
|
- `showPercentage: bool` - Show/hide percentage text
|
|
- `showIcon: bool` - Show/hide CPU icon
|
|
|
|
### RamMonitorWidget:
|
|
- **Real-time RAM usage monitoring** (updates every 3 seconds)
|
|
- **Visual progress bar** with color coding:
|
|
- Blue: < 75% usage
|
|
- Orange: 75-90% usage
|
|
- Red: > 90% usage
|
|
- **Tooltip** showing memory usage, used/total memory in GB/MB
|
|
- **Material Design memory icon** ()
|
|
- **Configurable properties:**
|
|
- `showPercentage: bool` - Show/hide percentage text
|
|
- `showIcon: bool` - Show/hide RAM icon
|
|
|
|
### SystemMonitorService:
|
|
- **Centralized system monitoring** backend service
|
|
- **CPU monitoring:** usage, core count, frequency, temperature
|
|
- **Memory monitoring:** usage percentage, total/used/free memory
|
|
- **Automatic updates** with configurable intervals
|
|
- **Helper functions** for formatting and color coding
|
|
|
|
## Widget Customization
|
|
|
|
Both widgets inherit your theme colors and styling:
|
|
- Uses `Theme.cornerRadius` for rounded corners
|
|
- Uses `Theme.primary/secondary` colors for progress bars
|
|
- Uses `Theme.error/warning` for alert states
|
|
- Uses `Theme.surfaceText` for text color
|
|
- Consistent hover effects matching other widgets
|
|
|
|
## System Requirements
|
|
|
|
The widgets use standard Linux system commands:
|
|
- `/proc/stat` for CPU usage
|
|
- `/proc/meminfo` via `free` command for memory info
|
|
- `/proc/cpuinfo` for CPU details
|
|
- Works on most Linux distributions
|
|
|
|
The widgets are designed to integrate seamlessly with your existing quickshell material design theme and provide essential system monitoring information at a glance.
|