diff --git a/Modules/Audio/CircularSpectrum.qml b/Modules/Audio/CircularSpectrum.qml deleted file mode 100644 index e4d1754..0000000 --- a/Modules/Audio/CircularSpectrum.qml +++ /dev/null @@ -1,54 +0,0 @@ -import QtQuick -import qs.Commons -import qs.Services - -// Not used ATM and need rework -Item { - id: root - property int innerRadius: 32 * scaling - property int outerRadius: 64 * scaling - property color fillColor: Color.mPrimary - property color strokeColor: Color.mOnSurface - property int strokeWidth: 0 * scaling - property var values: [] - property int usableOuter: 64 - - width: usableOuter * 2 - height: usableOuter * 2 - - Repeater { - model: root.values.length - Rectangle { - property real value: root.values[index] - property real angle: (index / root.values.length) * 360 - width: Math.max(2 * scaling, (root.innerRadius * 2 * Math.PI) / root.values.length - 4 * scaling) - height: value * (usableOuter - root.innerRadius) - radius: width / 2 - color: root.fillColor - border.color: root.strokeColor - border.width: root.strokeWidth - antialiasing: true - - x: root.width / 2 - width / 2 * Math.cos(Math.PI / 2 + 2 * Math.PI * index / root.values.length) - width / 2 - y: root.height / 2 - height - - transform: [ - Rotation { - origin.x: width / 2 - origin.y: height - //angle: (index / root.values.length) * 360 - }, - Translate { - x: root.innerRadius * Math.cos(2 * Math.PI * index / root.values.length) - y: root.innerRadius * Math.sin(2 * Math.PI * index / root.values.length) - } - ] - - Behavior on height { - SmoothedAnimation { - duration: Style.animationFast - } - } - } - } -} diff --git a/Modules/Audio/MirroredSpectrum.qml b/Modules/Audio/MirroredSpectrum.qml new file mode 100644 index 0000000..72b3645 --- /dev/null +++ b/Modules/Audio/MirroredSpectrum.qml @@ -0,0 +1,42 @@ +import QtQuick +import qs.Commons + +Item { + id: root + property color fillColor: Color.mPrimary + property color strokeColor: Color.mOnSurface + property int strokeWidth: 0 + property var values: [] + + // Pre-compute mirroring + readonly property int valuesCount: values.length + readonly property int totalBars: valuesCount * 2 + readonly property real barSlotWidth: totalBars > 0 ? width / totalBars : 0 + + readonly property real centerY: height / 2 + + Repeater { + model: root.totalBars + + Rectangle { + // The first half of bars are a mirror image (reversed values array). + // The second half of bars are in normal order. + property int valueIndex: index < root.valuesCount ? root.valuesCount - 1 - index // Mirrored half + : index - root.valuesCount // Normal half + + property real amp: root.values[valueIndex] + + property real barHeight: root.height * amp + + color: root.fillColor + border.color: root.strokeColor + border.width: root.strokeWidth + antialiasing: true + + width: root.barSlotWidth * 0.8 // Creates a small gap between bars + height: Math.max(1, barHeight) + x: index * root.barSlotWidth + y: root.centerY - (barHeight / 2) + } + } +} \ No newline at end of file diff --git a/Modules/Audio/WaveSpectrum.qml b/Modules/Audio/WaveSpectrum.qml index 596e735..f508d95 100644 --- a/Modules/Audio/WaveSpectrum.qml +++ b/Modules/Audio/WaveSpectrum.qml @@ -48,18 +48,22 @@ Item { ctx.beginPath() // Draw the top half of the waveform from left to right - ctx.moveTo(0, centerY - (mirroredValues[0] * amplitude)) // Move to the first point + // Use the calculated offset for the first point + var yOffset = Math.max(1, mirroredValues[0] * amplitude) + ctx.moveTo(0, centerY - yOffset) + for (var i = 1; i < count; i++) { const x = i * stepX - const y = centerY - (mirroredValues[i] * amplitude) + yOffset = Math.max(1, mirroredValues[i] * amplitude) + const y = centerY - yOffset ctx.lineTo(x, y) } // Draw the bottom half of the waveform from right to left to create a closed shape for (var i = count - 1; i >= 0; i--) { const x = i * stepX - const y = centerY + (mirroredValues[i] * amplitude) - // Mirrored across the center + yOffset = Math.max(1, mirroredValues[i] * amplitude) + const y = centerY + yOffset // Mirrored across the center ctx.lineTo(x, y) } @@ -74,4 +78,4 @@ Item { } } } -} +} \ No newline at end of file diff --git a/Modules/SettingsPanel/Tabs/AudioTab.qml b/Modules/SettingsPanel/Tabs/AudioTab.qml index d9d8199..5211e40 100644 --- a/Modules/SettingsPanel/Tabs/AudioTab.qml +++ b/Modules/SettingsPanel/Tabs/AudioTab.qml @@ -232,11 +232,16 @@ ColumnLayout { ListElement { key: "linear" name: "Linear" + } + ListElement { + key: "mirrored" + name: "Mirrored" } ListElement { key: "wave" name: "Wave" } + } currentKey: Settings.data.audio.visualizerType onSelected: function (key) { diff --git a/Modules/SidePanel/Cards/MediaCard.qml b/Modules/SidePanel/Cards/MediaCard.qml index 620d615..e690415 100644 --- a/Modules/SidePanel/Cards/MediaCard.qml +++ b/Modules/SidePanel/Cards/MediaCard.qml @@ -345,6 +345,19 @@ NBox { } } + Loader { + active: Settings.data.audio.visualizerType == "mirrored" + Layout.alignment: Qt.AlignHCenter + + sourceComponent: MirroredSpectrum { + width: 300 * scaling + height: 80 * scaling + values: CavaService.values + fillColor: Color.mPrimary + Layout.alignment: Qt.AlignHCenter + } + } + Loader { active: Settings.data.audio.visualizerType == "wave" Layout.alignment: Qt.AlignHCenter @@ -357,5 +370,10 @@ NBox { Layout.alignment: Qt.AlignHCenter } } + + + + + } }