QML: Add poor-mans scrolling waveforms using overviews

mixxxdj · Oct 1, 2021 · 49138f9 · 49138f9
1 parent 8b1ed1b
commit 49138f9
Show file tree

Hide file tree

Showing 2 changed files with 144 additions and 0 deletions.
diff --git a/res/qml/WaveformRow.qml b/res/qml/WaveformRow.qml
@@ -0,0 +1,88 @@
+import Mixxx 0.1 as Mixxx
+import QtQuick 2.12
+import QtQuick.Shapes 1.12
+
+Item {
+    id: root
+
+    required property string group
+
+    Item {
+        id: waveformContainer
+
+        property real duration: samplesControl.value / sampleRateControl.value
+
+        anchors.fill: parent
+        clip: true
+
+        Mixxx.ControlProxy {
+            id: samplesControl
+
+            group: root.group
+            key: "track_samples"
+        }
+
+        Mixxx.ControlProxy {
+            id: sampleRateControl
+
+            group: root.group
+            key: "track_samplerate"
+        }
+
+        Mixxx.ControlProxy {
+            id: playPositionControl
+
+            group: root.group
+            key: "playposition"
+        }
+
+        Mixxx.ControlProxy {
+            id: rateRatioControl
+
+            group: root.group
+            key: "rate_ratio"
+        }
+
+        Mixxx.ControlProxy {
+            id: zoomControl
+
+            group: root.group
+            key: "waveform_zoom"
+        }
+
+        Mixxx.WaveformOverview {
+            id: waveform
+
+            width: waveformContainer.duration * 10 * rateRatioControl.value * zoomControl.value
+            height: parent.height
+            x: 0.5 * waveformContainer.width - playPositionControl.value * waveform.width
+            player: Mixxx.PlayerManager.getPlayer(root.group)
+        }
+
+    }
+
+    Shape {
+        id: playMarkerShape
+
+        anchors.fill: parent
+
+        ShapePath {
+            id: playMarkerPath
+
+            startX: parent.width / 2
+            startY: 0
+            strokeColor: "white"
+            strokeWidth: 1
+
+            PathLine {
+                id: marker
+
+                x: playMarkerPath.startX
+                y: playMarkerShape.height
+            }
+
+        }
+
+    }
+
+}
diff --git a/res/qml/main.qml b/res/qml/main.qml
@@ -79,6 +79,62 @@ ApplicationWindow {
 
         }
 
+        WaveformRow {
+            id: deck3waveform
+
+            group: "[Channel3]"
+            width: root.width
+            height: 60
+            visible: root.show4decks && !root.maximizeLibrary
+
+            FadeBehavior on visible {
+                fadeTarget: deck3waveform
+            }
+
+        }
+
+        WaveformRow {
+            id: deck1waveform
+
+            group: "[Channel1]"
+            width: root.width
+            height: 60
+            visible: !root.maximizeLibrary
+
+            FadeBehavior on visible {
+                fadeTarget: deck1waveform
+            }
+
+        }
+
+        WaveformRow {
+            id: deck2waveform
+
+            group: "[Channel2]"
+            width: root.width
+            height: 60
+            visible: !root.maximizeLibrary
+
+            FadeBehavior on visible {
+                fadeTarget: deck2waveform
+            }
+
+        }
+
+        WaveformRow {
+            id: deck4waveform
+
+            group: "[Channel4]"
+            width: root.width
+            height: 60
+            visible: root.show4decks && !root.maximizeLibrary
+
+            FadeBehavior on visible {
+                fadeTarget: deck4waveform
+            }
+
+        }
+
         Skin.DeckRow {
             id: decks12