Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Tweaking Pattern and Song editor #1544

Conversation

theGreatWhiteShark
Copy link
Contributor

I did refine mostly UI but also UX of the SongEditor and PatternEditor. Mostly little graphical things to ensure those parts of the GUI pick up and use the colors of the color theme as well and fine-tuned presentation. The changes in the UX are mostly minor and are intended to align the UX of the different editors. Some features seem to have grown naturally at some places but not in others where it feels odd that they are missing. Only the stuff concerning the tags are major UX changes. I really hated that one can only access them via mid-click on the position ruler which makes them somewhat a hidden feature. Everything is of course up for discussion.

tweaked_editor

UX changes SongEditor

  • Tags have been moved into Timeline (next to the Tempo Markers) in order to make room to accommodate the cursor in the ruler to highlight the current position
  • Tags can be inserted by left-clicking the bottom area of the Timeline (above the ruler). The area is highlighted when hovered. This both hints to the user that something is happening when clicking as well as keeps the part of the Timeline used to add a Tempo Marker apart from the one dedicated for tags. Inserting tags using middle mouse click is still supported and can be now done for the whole height of the ruler
  • Clicking the ruler is now always possible and automatically switches transport into Song Mode.
  • Full-size playhead (supersedes Show a full-height cursor for song position #1107)
  • The icons in the pattern list indicating whether a pattern is playing in stacked pattern mode are now colored and can have four different states: on, off, off next (pattern is played till the end and then turned off), and on next (pattern is played as soon as transport is looped again) (supersedes Pattern indicators #482)

UX changes PatternEditor

  • Relocating transport by clicking the ruler is now supported (like in the SongEditor) and automatically switches transport into Pattern Mode.
  • Full-size playhead
  • The ruler was decoupled from the currently selected pattern. It always has the size of the largest playing pattern and always shows the transport position using a playhead. Whether or not the current pattern is played back is indicated by a full-height cursor.
  • All note properties except of the note key can now be altered in both the drum pattern editor and the piano roll editor by right-clicking and dragging a note.
  • All notes of the currently playing patterns will be hinted in stacked pattern mode. Even those exceeding the length of the current pattern.

For the full list of changes please see the commit messages. (I know, not a nice move. But they are just way too many.)

P.S. If you are already on master you probably need to import the update theme.
P.P.S These are most probably the last big UI/UX changes I'll do before 1.2. But there is still a very long list of todos and odd stuff to look into. Let's hope they don't lead down too deep into tweak-rabbit hole.

- a new button for locking the PatternEditor to show the Pattern recorded notes will be inserted into while in Song mode was introduced
- the draw and select buttons have been fused into a single one
- the buttons to move a pattern up and down and to add a new one in the SongEditorPanel have been shrinked a couple of pixels to allow for the three ones to the right to be bigger and more pronounced
- some wrapper functions in the Hydrogen class have been introduced guard against segfaults in case a button is pressed while no song is set yet. Well, just in case.
- if in song mode and the patternEditor locked button was checked in the SongEditorPanel, the PatternEditor does now follow the pattern new notes will be introduced into. (Note that this is not perfectly working right now. After merging the reworked AudioEngine it will be so much easier and cleaner to implement and thus patched later)
- the GUI was made more resilent against no pattern being selected (happens whenever there is an empty column in the SongEditor while the PatternEditor is locked)
- buttons of SongEditorPanel have been resized. Those for moving patterns up and down are now located on top of each other which allowed to enlarge the all others in order to make their icons more pronounced.
- right-clicking a row in the SongEditorPatternList does now highlight it with a border like other widgets. This highlight persists until the associated dialog window is closed.
- highlighting a list item when right-clicking is now supported and behaves the same in both the pattern list of the SongEditor and the instrument list of the PatternEditor
- both pattern list and instrument list are now drawn within Qt instead of rendering a shipped .png file. In addition, they give optical feedback when hovered
- background color, alternate row color, and selected row color are now properly supported in both PatternEditor and SongEditor. It felt quite natural to rework the design of the pattern grid in the SongEditor when having alternating colors. But it is a quick fix to change it back to the old design
- reworking the default colors for Song and PatternEditor
- button can now be toggled in both song and pattern mode (in pattern mode there is no change in behavior depending on its state. So, it does no harm)
- in pattern mode the locked button is unchecked while in song mode it is checked (grey background vs. blue one). This hints that the locking only takes effect in song mode
- when left clicking on a pattern name while the PatternEditor is locked, the lock button flashes red (changes its background for a short amount of time). This should hint why nothing did happened when clicking.
- highlight the selected instrument in PatternEditor if no pattern is selected. The grid will remain disabled. This way it is more obvious we deal with a no pattern.
- display transport position in PatternEditor even if no pattern is selected in case the PatternEditor is locked
- fix boundary colors and mark fill area in PatternEditorRuler stretching further out than the current pattern in a more greyish color (there was a different color used previously too. But it was so similar to the actual one I never took notice of this)
- instrument name label in InstrumentEditor, Timeline grid lines, SongEditorPositionRuler grid lines and numbers are now highlighted when hovered. (I know that there is a "too much" in highlighting and I might already crossed the line with the SongEditorPositionRuler. I try to get a feel while using it. But for some elements in Hydrogen I did not expect to find them interactive at the beginning.)
- The PatternEditorInstrumentList is now immediately updated if another instrument gets selected in the DrumPatternEditor (not using the eventqueue but using the DPE itself). The reason was a visual lag between the highlighted rows when navigating in the pattern editor using keyboard
- PatternEditorInstrumentList is now using the eventqueue to react on changes in the selected instrument. However, we are not there yet to abandon the timer-based update yet. There are a number of instrument-related changes not covered by events
- Updating all lines in PatternEditorInstrumentList is now done "more lazily" by checking each instrument parameter before updating the corresponding InstrumentLine. But there is still room for more optimization without being premature.
- fix background creation in Skin class
- move list rows by one pixel to align dark shadow at the bottom with gridlines in the corresponding editor
- show cursor
- the cursor position is now shown in the SongEditorPositionRuler as well as in the PatternEditorRuler as soon as the cursor is shown in the corresponding editors or a note properties ruler. Same holds for the instrument and pattern list
- the layout of the numbers and ticks in the SEPR has been redesigned to accomodate the cursor
- tags have been moved the in the upper row of the SEPR to keep things clean and distinct. They are not drawn as a mid size letter "T" but a very small "T" surrounded by a colored rectangle
- the lower part of the upper row in the SEPR is now reserved for tags. Left-clicking this region opens the tag editor. In the previous implementation tags were a somewhat hidden feature as one needed to press the middle mouse button to insert them
- hovering highlights in the upper column indicate whether a tempo marker or a tag will be added/modified at the current cursor position
- selected pattern in SE have now properly highlighted borders regardless of adjacent patterns
- align selection colors in SE and PE
in the pattern list of the song editor and the instrument list of the pattern editor
- the updating of the ruler of the SongEditor and PatternEditor is now done more efficiently. Previously, they redraw every X milliseconds. Now, they only do so in case the transport is rolling. A new event, RELOCATION_EVENT, was introduced to still keep them in sync in case transport is located to a different position with playback stopped
- hovering over the rulers does now show a cursor with alpha value at the position the transport will be located to in case the user clicks. This hints way better what is going on then highlighting the column number
- clicking the ruler of the pattern editor does now locate transport at the clicked tick exactly as done in the song editor
- clicking either the ruler of pattern or song editor switched Hydrogen into pattern or song mode. No need to click an extra button as the intention to play a specific part of a pattern/song should be rather strong
- a glitch in the font weight of the instrument list labels in the pattern editor was fixed
- the design of the playhead was altered. But this is still a draft and not the final one
- the background of the DrumPatternEditor was not cached as most of the other (parts of the) editors
- DrumPatternEditor, PianoRollEditor, and NotePropertiesRuler are now redrawn including their background in case the pixel ratio changes (moved to another monitor device)
- PianoRollEditor was not properly updated on horizontal scrolls
when setting the a song the Timeline was not activated right away causing the songs bpm not being stored in the default bpm
this allows to call the function simple as ->toQString()
whenever the AudioEngine was reset, m_nPatternStartTick is set to -1. But this one was also used in the calculation of the pattern tick position causing it to be 1 when relocating to the very beginning of the song/pattern
The playhead is now extended to cover the SongEditor as well as the PatternEditor and the NotePropertiesRuler as well. It comes with its own color, which can be customize in the Preferences.

In addition there are two UX changes:
- clicking the song editor ruler is now alway possible. By doing so transport is relocated to a specific column and transport mode is changed into Song::Mode::Song
- clicking the pattern editor ruler is now also supported. It will relocate transport to a specific tick within the pattern and changes transport mode into Song::Mode::Pattern

All common rendering details of the playhead have been moved into the Skin class and the playhead is now rendered within Qt instead of being drawn using a pixmap. Also, the margin of the PatternEditor was converted to a static constexpr. This way all classes and not just inherited ones can access it during initialization during which PatternEditorPanel is not fully initialized yet.

(Playhead might not be the proper term for the full-sized thingy. But there is already a cursor. So, I will just continue calling it playhead until something better shows up)
Apart from that it makes the rendering of the playhead in the SongEditor a little bit more efficient by calculating the tick position in just one function and not in several paintEvents
the tick position of the playhead is only calculated once and not within every single editor
also the colors of the automation path line and nodes have been moved to the SongEditor node of the color theme and the background color was exposed as well.
the border of selected patterns and notes do now use the same color (the one from the preferences). Also, the color of the selection lasso can now be altered as well.

As switching between active and inactive selection color was not working in the DrumPatternEditor as focus moved in and out of the widget, both the general structure of the background caching and the focusIn and focusOut policy was moved into the parent PatternEditor class.
even for the default colors some velocities were barely visible. Changing the background colors further might render the whole thing hard to use. Therefore, the colors note velocities 1.0, 0.8, 0.5 and 0.0 can now be customized in the preferences. For all velocities inbetween the neighboring colors will be interpolated
way to much logic was done in the GUI and at some point it did mess things up. Toggling is now done in the core and the GUI just reacts to an event.
Instead of rendering a pixmap, the stacked mode indicator is now drawn directly and the colors used to fill the triangles is exposed in the Preferences.

I have no strong opinion on the default colors and used hydrogen-music#482 as a reference.
and ensure they are shown on all property changes that involve one note
This commit moves the logic for editing and undoing note property changes via right mouse press and drag into the parent PatternEditor class. Now, it is possible in both the DrumPatternEditor and the PianoRollEditor to alter properties which makes their UX much more similar.

It also fixes a bug where undoing a property changed in the PRE was only possible if the pattern containing the note was selected
testSongSizeChanged produced some false positives. The test does not fail anymore in case all notes in the songNoteQueue are already flushed and there is nothing to compare.
ensure the playhead is visible in song mode after opening a song
@cme
Copy link
Contributor

cme commented Mar 23, 2022

This is looking great! Wee issue with hi-dpi displays on the pattern editor:

image

@cme
Copy link
Contributor

cme commented Mar 23, 2022

Actually, also looks like a there's a couple of 1-pixel gaps (half-pixel on regular display so invisible) between rulers that aren't repainted?

@theGreatWhiteShark
Copy link
Contributor Author

Wee issue with hi-dpi displays on the pattern editor:

Should be fixed now.

Actually, also looks like a there's a couple of 1-pixel gaps (half-pixel on regular display so invisible) between rulers that aren't repainted?

The devil's in the detail. I could also produce this gap when setting QT_SCALE_FACTOR on my device. While at it I fine-tuned a number of pixel stuff. But some things just won't align. The grid of the song editor and the one of it's ruler is apart a tiny bit. But the corresponding x values as well as the parent widgets geometry do match. It's just when painting a 2 pixel line at position 0 in the ruler, I see a line of 1px width and when doing exactly the same in the SongEditor, it's 2px wide. No idea why. But it's just a tiny detail and probably not worth worth too much time

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants