-
-
Notifications
You must be signed in to change notification settings - Fork 1.1k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #1989 from alicevision/mug/sequencePlayer
[ui] 2D viewer: image sequence player
- Loading branch information
Showing
6 changed files
with
392 additions
and
56 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,262 @@ | ||
| import QtQuick 2.15 | ||
| import QtQuick.Controls 2.15 | ||
| import QtQuick.Layouts 1.11 | ||
|
|
||
| import Controls 1.0 | ||
| import MaterialIcons 2.2 | ||
| import Utils 1.0 | ||
|
|
||
| /** | ||
| * The Sequence Player is a UI for manipulating | ||
| * the currently selected (and displayed) viewpoint | ||
| * in an ordered set of viewpoints (i.e. a sequence). | ||
| * | ||
| * The viewpoint manipulation process can be manual | ||
| * (for example by dragging a slider to change the current frame) | ||
| * or automatic | ||
| * (by playing the sequence, i.e. incrementing the current frame at a given time rate). | ||
| */ | ||
| FloatingPane { | ||
| id: root | ||
|
|
||
| // Exposed properties | ||
| property var sortedViewIds: [] | ||
| property var viewer: null | ||
|
|
||
| function updateReconstructionView() { | ||
| if (_reconstruction && m.frame >= 0 && m.frame < sortedViewIds.length) { | ||
| if (m.syncSelected) { | ||
| _reconstruction.selectedViewId = sortedViewIds[m.frame]; | ||
| } else { | ||
| _reconstruction.pickedViewId = sortedViewIds[m.frame]; | ||
| } | ||
| } | ||
| } | ||
|
|
||
| // Sequence player model: | ||
| // - current frame | ||
| // - data related to automatic sequence playing | ||
| QtObject { | ||
| id: m | ||
|
|
||
| property int frame: 0 | ||
| property bool syncSelected: true | ||
| property bool playing: false | ||
| property bool repeat: false | ||
| property real fps: 1 | ||
|
|
||
| onFrameChanged: { | ||
| updateReconstructionView(); | ||
| } | ||
|
|
||
| onSyncSelectedChanged: { | ||
| updateReconstructionView(); | ||
| } | ||
|
|
||
| onPlayingChanged: { | ||
| syncSelected = !playing; | ||
| } | ||
| } | ||
|
|
||
| // Update the frame property | ||
| // when the selected view ID is changed externally | ||
| Connections { | ||
| target: _reconstruction | ||
| function onSelectedViewIdChanged() { | ||
| for (let idx = 0; idx < sortedViewIds.length; idx++) { | ||
| if (_reconstruction.selectedViewId === sortedViewIds[idx] && (m.frame != idx)) { | ||
| m.frame = idx; | ||
| } | ||
| } | ||
| } | ||
| } | ||
|
|
||
| // In play mode | ||
| // we use a timer to increment the frame property | ||
| // at a given time rate (defined by the fps property) | ||
| Timer { | ||
| id: timer | ||
|
|
||
| repeat: true | ||
| running: m.playing | ||
| interval: 1000 / m.fps | ||
|
|
||
| onTriggered: { | ||
| let nextIndex = m.frame + 1; | ||
| if (nextIndex == sortedViewIds.length) { | ||
| if (m.repeat) { | ||
| m.frame = 0; | ||
| return; | ||
| } | ||
| else { | ||
| m.playing = false; | ||
| return; | ||
| } | ||
| } | ||
| m.frame = nextIndex; | ||
| } | ||
| } | ||
|
|
||
| // Widgets: | ||
| // - "Previous Frame" button | ||
| // - "Play - Pause" button | ||
| // - "Next Frame" button | ||
| // - frame label | ||
| // - frame slider | ||
| // - FPS spin box | ||
| // - "Repeat" button | ||
| RowLayout { | ||
|
|
||
| anchors.fill: parent | ||
|
|
||
| MaterialToolButton { | ||
| id: prevButton | ||
|
|
||
| text: MaterialIcons.skip_previous | ||
| ToolTip.text: "Previous Frame" | ||
|
|
||
| onClicked: { | ||
| m.frame -= 1; | ||
| } | ||
| } | ||
|
|
||
| MaterialToolButton { | ||
| id: playButton | ||
|
|
||
| checkable: true | ||
| checked: false | ||
| text: checked ? MaterialIcons.pause : MaterialIcons.play_arrow | ||
| ToolTip.text: checked ? "Pause Player" : "Play Sequence" | ||
|
|
||
| onCheckedChanged: { | ||
| m.playing = checked; | ||
| } | ||
|
|
||
| Connections { | ||
| target: m | ||
| function onPlayingChanged() { | ||
| playButton.checked = m.playing; | ||
| } | ||
| } | ||
| } | ||
|
|
||
| MaterialToolButton { | ||
| id: nextButton | ||
|
|
||
| text: MaterialIcons.skip_next | ||
| ToolTip.text: "Next Frame" | ||
|
|
||
| onClicked: { | ||
| m.frame += 1; | ||
| } | ||
| } | ||
|
|
||
| Label { | ||
| id: frameLabel | ||
|
|
||
| text: m.frame | ||
| Layout.preferredWidth: frameMetrics.width | ||
| } | ||
|
|
||
| Slider { | ||
| id: frameSlider | ||
|
|
||
| Layout.fillWidth: true | ||
|
|
||
| stepSize: 1 | ||
| snapMode: Slider.SnapAlways | ||
| live: true | ||
|
|
||
| from: 0 | ||
| to: sortedViewIds.length - 1 | ||
|
|
||
| onValueChanged: { | ||
| m.frame = value; | ||
| } | ||
|
|
||
| onPressedChanged: { | ||
| m.syncSelected = !pressed; | ||
| } | ||
|
|
||
| Connections { | ||
| target: m | ||
| function onFrameChanged() { | ||
| frameSlider.value = m.frame; | ||
| } | ||
| } | ||
|
|
||
| background: Rectangle { | ||
| x: frameSlider.leftPadding | ||
| y: frameSlider.topPadding + frameSlider.height / 2 - height / 2 | ||
| width: frameSlider.availableWidth | ||
| height: 4 | ||
| radius: 2 | ||
| color: Colors.grey | ||
|
|
||
| Repeater { | ||
| id: cacheView | ||
|
|
||
| model: viewer ? viewer.cachedFrames : [] | ||
| property real frameLength: sortedViewIds.length > 0 ? frameSlider.width / sortedViewIds.length : 0 | ||
|
|
||
| Rectangle { | ||
| x: modelData.x * cacheView.frameLength | ||
| y: 0 | ||
| width: cacheView.frameLength * (modelData.y - modelData.x + 1) | ||
| height: 4 | ||
| radius: 2 | ||
| color: Colors.blue | ||
| } | ||
| } | ||
| } | ||
| } | ||
|
|
||
| RowLayout { | ||
| Label { | ||
| text: "FPS:" | ||
| ToolTip.text: "Frame Per Second" | ||
| } | ||
|
|
||
| SpinBox { | ||
| id: fpsSpinBox | ||
|
|
||
| Layout.preferredWidth: fpsMetrics.width + up.implicitIndicatorWidth | ||
|
|
||
| from: 1 | ||
| to: 60 | ||
| stepSize: 1 | ||
|
|
||
| onValueChanged: { | ||
| m.fps = value; | ||
| } | ||
| } | ||
| } | ||
|
|
||
| MaterialToolButton { | ||
| id: repeatButton | ||
|
|
||
| checkable: true | ||
| checked: false | ||
| text: MaterialIcons.replay | ||
| ToolTip.text: "Repeat" | ||
|
|
||
| onCheckedChanged: { | ||
| m.repeat = checked; | ||
| } | ||
| } | ||
| } | ||
|
|
||
| TextMetrics { | ||
| id: frameMetrics | ||
|
|
||
| font: frameLabel.font | ||
| text: "10000" | ||
| } | ||
|
|
||
| TextMetrics { | ||
| id: fpsMetrics | ||
|
|
||
| font: fpsSpinBox.font | ||
| text: "100" | ||
| } | ||
| } |
Oops, something went wrong.