Skip to content

EffectLyrics render above tab staff and create excessive top spacing with no below-staff option #2728

@AvaTheArchitect

Description

@AvaTheArchitect

Is there an existing issue for this?

  • I have searched the existing issues

Current Behavior

When rendering tab-only notation, alphaTab places EffectLyrics above the tab staff. This creates a large amount of extra vertical space above the staff, even though the lyrics visually belong underneath the tab in this layout.

In my testing, lyric rows were noticeably taller when native EffectLyrics rendered above the staff. For example, one lyric row measured around 176px high with native lyrics enabled, but dropped closer to 136–141px when EffectLyrics was disabled. This suggests the above-staff lyric lane is adding significant headroom to the rendered SVG/system.

Image

Another example where this becomes more noticeable is a track with both lyrics and guitar technique notation above the staff.

In a Stevie Ray Vaughan “Pride and Joy” test file, the lyrics render above the tab staff, but the same row also has technique/performance markings above the staff. This appears to push the lyric lane even higher and creates a very large amount of headroom above the actual tab staff.

So the issue is not only that lyrics are above the tab staff. The problem becomes more severe when EffectLyrics competes with other above-staff notation lanes roughly like lane 2 or lane 3, such as bends, vibrato markings, FX text, or technique labels.

In a tab-only layout, this makes the rendered system much taller than expected and leaves the lyrics visually far away from the tab staff. A native below-staff placement option would avoid this by putting lyrics in a dedicated basement lane instead of stacking them into the already-crowded upper notation area.

When EffectLyrics is disabled, the affected rows collapse noticeably, which makes it clear that the native lyric lane is responsible for much of the added vertical height.

Here are a few more less dramatic examples but all those the same consistent issue on the majority of GP files I have tested and when the lyrics render above staff.

Image

Image

Image

Expected Behavior

It would be useful to have an option to render EffectLyrics below the tab staff, especially when standard notation is not displayed.

A setting such as lyricsPosition: "above" | "below" or similar would allow tab-only renderers to avoid the ballooned upper lyric lane and better match Guitar Pro / Other Player below tab-only lyric placement.

Here is a tutorial using Guitar Pro that someone recorded and may be useful:

https://youtu.be/LCdrAqYTkf8?si=yb1rsvHTWrfenJWk

Steps To Reproduce

  1. Load a Guitar Pro file that contains lyrics on a tab track.
  2. Use a tab-only layout where standard notation is not displayed.
  3. Render the file with EffectLyrics enabled.
  4. Observe that the lyrics render above the tab staff.
  5. Test a file/track that also has guitar technique markings above the staff, such as bends, vibrato/FX text, or performance markings.
  6. Notice that the lyrics are pushed even farther upward because they are sharing the upper notation area with other above-staff elements.
  7. Disable or hide EffectLyrics and render again.
  8. Compare the row/system height. The same rows collapse significantly when the lyric lane is removed, showing that the above-staff lyric lane is adding extra headroom.

Link to jsFiddle, CodePen, Project

No response

Version and Environment

AlphaTab v1.8.1
Webpack V1.8.1
Chrome Browser Desktop

Platform

Web

Anything else?

I also tested manually moving lyrics below the staff after render. That can visually move the text down, but it does not expand the SVG/system basement at the bottom. As a result, the lyrics can hang outside the row area or overlap the next system/loop highlight area.

So the issue seems to be more than just text position. A native below-staff lyric placement option would likely need to allocate bottom/basement space as part of the layout, instead of only shifting the rendered lyric text.

For reference, Guitar Pro can do this for both standard + tab and also tab-only layouts can place lyrics beneath the tab staff, which avoids the large unused top lane. There are some other players like Ultimate-Guitar and several others that default to below tab only. I think incorporating something like Guitar Pro does will solve this issue...just not sure about the basement spacing under the Staff as there should be I would estimate about 14px under the lyrics that would also allow for any Loop highlight system that highlights notation as well as the staff, 14px then allows for those Loop highlight systems 7px at the top and 7px at the bottom for a total of 14px... so perhaps even a 10px padding for lyrics under staff if we are to add the option to move them would be ideal. As right now the lyrics are creating way more than 14px above the lyrics above staff now.

Image

Metadata

Metadata

Assignees

Labels

Type

No type
No fields configured for issues without a type.

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions