Skip to content

Commit 5902e29

Browse files
juzzlinjuzzlin
committed
QML performance improvements
- Optimized Volume Meter triggering - LineNumberColums as ListView's - SongView as a ListView
1 parent faf5ab6 commit 5902e29

5 files changed

Lines changed: 84 additions & 108 deletions

File tree

‎src/view/qml/Editor/LineNumberColumn.qml‎

Lines changed: 18 additions & 42 deletions
Original file line numberDiff line numberDiff line change
@@ -4,57 +4,36 @@ import ".."
44
Rectangle {
55
id: rootItem
66
color: Constants.lineNumberColumnBackgroundColor
7-
property var _lines: []
8-
property int _scrollOffset: 0
7+
clip: true
98
function resize(width, height) {
109
rootItem.width = width;
1110
rootItem.height = height;
12-
_resizeLines();
1311
}
12+
property int _currentLine: -1
1413
function setPosition(position) {
15-
_lines.forEach(line => {
16-
line.updateLineNumber();
17-
});
14+
if (_currentLine !== position.line) {
15+
_currentLine = position.line;
16+
if (listView) {
17+
listView.positionViewAtIndex(position.line, ListView.Beginning);
18+
}
19+
}
1820
}
1921
function updateData() {
20-
_createLines();
2122
}
2223
function _lineHeight() {
2324
const lineCount = settingsService.visibleLines;
2425
return rootItem.height / lineCount;
2526
}
26-
function _createLines() {
27-
_lines.forEach(line => {
28-
line.destroy();
29-
});
30-
_lines = [];
31-
const lineCount = editorService.lineCount(editorService.currentPattern);
32-
const lineHeight = _lineHeight();
33-
for (let lineIndex = 0; lineIndex < lineCount; lineIndex++) {
34-
const line = textComponent.createObject(rootItem, {
35-
"index": lineIndex,
36-
"lineNumber": editorService.lineNumberAtViewLine(lineIndex),
37-
"width": rootItem.width,
38-
"height": lineHeight,
39-
"x": 0,
40-
"y": lineHeight * lineIndex
41-
});
42-
_lines.push(line);
43-
}
44-
}
45-
function _resizeLines() {
46-
const lineCount = editorService.currentLineCount;
47-
const lineHeight = _lineHeight();
48-
_lines.forEach(line => {
49-
line.y = lineHeight * (line.index + _scrollOffset);
50-
line.width = width;
51-
line.height = lineHeight;
52-
});
53-
}
54-
Component {
55-
id: textComponent
56-
LineNumberDelegate {
27+
ListView {
28+
id: listView
29+
anchors.fill: parent
30+
model: editorService.currentLineCount + settingsService.visibleLines
31+
delegate: LineNumberDelegate {
32+
width: rootItem.width
33+
height: _lineHeight()
34+
index: model.index
5735
}
36+
interactive: false
5837
}
5938
Rectangle {
6039
id: borderRectangle
@@ -64,7 +43,4 @@ Rectangle {
6443
anchors.fill: parent
6544
z: 2
6645
}
67-
Component.onCompleted: {
68-
settingsService.visibleLinesChanged.connect(_resizeLines);
69-
}
70-
}
46+
}

‎src/view/qml/Editor/LineNumberDelegate.qml‎

Lines changed: 5 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -2,18 +2,14 @@ import QtQuick 2.15
22
import ".."
33

44
Rectangle {
5-
color: lineNumber < 0 ? "transparent" : Constants.lineNumberColumnCellBackgroundColor
5+
color: lineNumber < 0 || lineNumber >= editorService.currentLineCount ? "transparent" : Constants.lineNumberColumnCellBackgroundColor
66
border.color: Constants.lineNumberColumnCellBorderColor
77
border.width: 1
88
property int index
9-
property int lineNumber
10-
function updateLineNumber() {
11-
lineNumber = editorService.lineNumberAtViewLine(index);
12-
}
9+
readonly property int lineNumber: index - editorService.positionBarLine()
10+
readonly property int _wrappedLineNumber: (lineNumber % editorService.currentLineCount + editorService.currentLineCount) % editorService.currentLineCount
1311
function _formattedLineNumber() {
14-
const lineCount = editorService.currentLineCount;
15-
const formattedLineNumber = Math.abs(lineNumber) % lineCount;
16-
return formattedLineNumber < 10 ? `0${formattedLineNumber}` : formattedLineNumber;
12+
return _wrappedLineNumber < 10 ? `0${_wrappedLineNumber}` : _wrappedLineNumber;
1713
}
1814
Text {
1915
color: lineNumber < 0 || lineNumber >= editorService.currentLineCount ? Constants.lineNumberColumnOverflowTextColor : Constants.lineNumberColumnTextColor
@@ -24,6 +20,6 @@ Rectangle {
2420
}
2521
IndexHighlight {
2622
anchors.fill: parent
27-
index: lineNumber
23+
index: _wrappedLineNumber
2824
}
2925
}

‎src/view/qml/Editor/NoteColumn_LineContainer.qml‎

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -74,9 +74,11 @@ Item {
7474
rootItem.mouseMoved(effectiveLineIndex, _getGlobalX(delegate, mouse), _getGlobalY(delegate, mouse));
7575
}
7676
function setPosition(position: var): void {
77-
_scrollOffset = position.line;
78-
_scrollLines();
79-
_triggerVolumeMeterAtPosition(position);
77+
if (_scrollOffset !== position.line) {
78+
_scrollOffset = position.line;
79+
_scrollLines();
80+
_triggerVolumeMeterAtPosition(position);
81+
}
8082
}
8183
function _scrollLines(): void {
8284
if (_listView) {
@@ -86,7 +88,9 @@ Item {
8688
function _triggerVolumeMeterAtPosition(position: var): void {
8789
if (UiService.isPlaying() && mixerService.shouldColumnPlay(_trackIndex, _index)) {
8890
const velocity = editorService.velocityAtPosition(position.pattern, _trackIndex, _index, position.line);
89-
volumeMeter.trigger(mixerService.effectiveVelocity(_trackIndex, _index, velocity) / 127);
91+
if (velocity > 0) {
92+
volumeMeter.trigger(mixerService.effectiveVelocity(_trackIndex, _index, velocity) / 127);
93+
}
9094
}
9195
}
9296
Component {

‎src/view/qml/Editor/NoteColumn_LineDelegate.qml‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ Rectangle {
1111
font.pixelSize: parent.height * 0.8
1212
font.family: "monospace"
1313
anchors.centerIn: parent
14-
text: note ? `${model.note} ${model.velocity.padStart(3, "-")}` : ""
14+
text: note ? note + " " + velocity : ""
1515
color: note && note !== "---" ? "#ffffff" : "#888888"
1616
}
1717
Rectangle {

‎src/view/qml/Editor/SongView.qml‎

Lines changed: 52 additions & 52 deletions
Original file line numberDiff line numberDiff line change
@@ -9,65 +9,65 @@ Rectangle {
99
RowLayout {
1010
anchors.fill: parent
1111
spacing: 2
12-
ScrollView {
13-
id: songScrollView
12+
ListView {
13+
id: songListView
1414
Layout.fillWidth: true
1515
Layout.fillHeight: true
16-
ScrollBar.vertical.policy: ScrollBar.AlwaysOff
17-
ScrollBar.horizontal.policy: ScrollBar.AsNeeded
18-
Row {
19-
id: patternRow
20-
spacing: 2
21-
property real patternSize: rootItem.height
22-
property real contentWidth: patternSize * editorService.songLength + spacing * (editorService.songLength - 1)
23-
width: contentWidth
24-
height: rootItem.height
25-
Repeater {
26-
model: editorService.songLength
27-
delegate: Rectangle {
28-
id: patternRect
29-
width: patternRow.patternSize
30-
height: patternRow.patternSize
31-
color: index % 4 < 2 ? "#4A4A4A" : "#5A5A5A"
32-
border.color: "#888888"
33-
border.width: 1
34-
Text {
35-
id: textField
36-
anchors.centerIn: parent
37-
text: editorService.patternAtSongPosition(index)
38-
color: editorService.songPosition === index ? "orange" : "white"
39-
font.pixelSize: 14
40-
font.bold: true
41-
}
42-
MouseArea {
43-
id: patternMouseArea
44-
anchors.fill: parent
45-
hoverEnabled: true
46-
cursorShape: Qt.PointingHandCursor
47-
onClicked: if (!UiService.isPlaying()) {
48-
editorService.setSongPosition(index);
16+
orientation: ListView.Horizontal
17+
spacing: 2
18+
model: editorService.songLength
19+
clip: true
20+
currentIndex: editorService.songPosition
21+
onCurrentIndexChanged: {
22+
if (songListView.currentIndex >= 0) {
23+
songListView.positionViewAtIndex(songListView.currentIndex, ListView.Contain);
24+
}
25+
}
26+
delegate: Rectangle {
27+
id: patternRect
28+
width: songListView.height
29+
height: songListView.height
30+
color: index % 4 < 2 ? "#4A4A4A" : "#5A5A5A"
31+
border.color: "#888888"
32+
border.width: 1
33+
Text {
34+
id: textField
35+
anchors.centerIn: parent
36+
text: editorService.patternAtSongPosition(index)
37+
color: editorService.songPosition === index ? "orange" : "white"
38+
font.pixelSize: 14
39+
font.bold: true
40+
}
41+
MouseArea {
42+
id: patternMouseArea
43+
anchors.fill: parent
44+
hoverEnabled: true
45+
cursorShape: Qt.PointingHandCursor
46+
onClicked: if (!UiService.isPlaying()) {
47+
editorService.setSongPosition(index);
48+
}
49+
states: [
50+
State {
51+
when: patternMouseArea.containsMouse
52+
PropertyChanges {
53+
target: patternRect
54+
color: "#777777"
4955
}
50-
states: [
51-
State {
52-
when: patternMouseArea.containsMouse
53-
PropertyChanges {
54-
target: patternRect
55-
color: "#777777"
56-
}
57-
}
58-
]
5956
}
60-
Connections {
61-
target: editorService
62-
function onPatternAtCurrentSongPositionChanged() {
63-
if (editorService.songPosition === index) {
64-
textField.text = editorService.patternAtSongPosition(index);
65-
}
66-
}
57+
]
58+
}
59+
Connections {
60+
target: editorService
61+
function onPatternAtCurrentSongPositionChanged() {
62+
if (editorService.songPosition === index) {
63+
textField.text = editorService.patternAtSongPosition(index);
6764
}
6865
}
6966
}
7067
}
68+
ScrollBar.horizontal: ScrollBar {
69+
policy: ScrollBar.AsNeeded
70+
}
7171
}
7272
Rectangle {
7373
Layout.preferredWidth: rootItem.height
@@ -93,4 +93,4 @@ Rectangle {
9393
ToolTip.timeout: Constants.toolTipTimeout
9494
}
9595
}
96-
}
96+
}

0 commit comments

Comments
 (0)