feat(YouTube - Swipe controls): Add option for vertical progress bar

[MarcaDian]

This pull request introduces a new vertical swipe overlay style for the Swipe controls, along with several enhancements to improve user experience and customization.
Also closes #4669 and #4571

Changes

1. New Vertical Swipe Overlay Style:

   • Added a new vertical overlay style (VERTICAL and VERTICAL_MINIMAL).
   • During brightness gestures, the overlay appears on the right side of the screen; for volume gestures, it appears on the left side, ensuring visibility.
   • Implemented an indent from the screen edge to prevent interference with camera cutouts.

2. Screen Size Adaptation:

   • Adapted all overlay variables (e.g., sizes, positions, margins) to scale dynamically based on the user's screen size.
   • Improves compatibility across devices with varying resolutions and aspect ratios.

3. Overlay Style Selection in Settings:

   • Added a list option in the settings UI to allow users to select their preferred swipe overlay style (e.g., HORIZONTAL, CIRCULAR, VERTICAL, or their minimal variants).

4. Progress Bar Color Customization:

   • Introduced a new setting to allow users to change the progress bar color in the overlay.

5. Overlay Text Adjustment:

   • Restored the ability to adjust the overlay text size, with a range of 1 to 30 dp (default: 14 dp).
   • Restored localization for the word "Auto" in the brightness overlay (displayed as "А" in vertical overlay style).
   • Overlay adapts dynamically to content, improving readability and consistency.

---

[MarcaDian]

I noticed here that in fullscreen portrait mode the horizontal progress bar is slightly covered by the front camera.
Maybe need to lower the layout a bit, or maybe it can only be lowered in this mode. Or leave it as is?

[LisoUseInAIKyrios]

I think that only affects thru hole punch cameras.

You could adjust the location based on WindowInsets.getDisplayCutout() if the display cutout bounds overlap the swipe UI overlay.

See https://developer.android.com/develop/ui/views/layout/display-cutout

[MarcaDian]

for some reason, in fullscreen mode only safeInsetTop is used for all orientations
safeInsetLeft and safeInsetRight not used

and when I add a margin for the camera cutout, everything is fine in fullscreen portrait mode, but in landscape fullscreen mode, these margins are also preserved, which should not be the case.

It's bad that there's no variable for fullscreen portrait mode, that would solve the problem quickly, but now need to think how solve this problem.

[LisoUseInAIKyrios]

What about the window display frame?

    Window window = getActivity().getWindow();
    window.getDecorView().getWindowVisibleDisplayFrame(rectangle);
    int statusBarHeight = rectangle.top;

[MarcaDian]

Not sure if this will work, as the status bar is hidden in fullscreen mode.
Can try it and see what happens.

Or do you mean to determine which side the status bar is on and add a inset?

[LisoUseInAIKyrios]

I meant to check if just the status bar is visible using the window frame

I don't think the left/right insets are needed to adjust for the camera hole. When in landscape fullscreen the 'top' inset will be the correct side (and not the unrotated top/bottom side of the screen).

[MarcaDian]

I think can leave a 20f topMargin as a solution of the problem.
I just checked, the 2x speed overlay is also almost completely covered by the camera cutout in fullscreen portrait.

[LisoUseInAIKyrios]

Anything todo before merging?

[MarcaDian]

Everything seems fine, ready to merge.

[MarcaDian]

I don't understand what you're talking about, the swipe behavior hasn't changed.

[MarcaDian]

I understand that you misread.

The swipe behavior has not changed, brightness on the left, volume on the right.

The changes you are confusing only apply to the vertical swipe style. This is done for convenience, because when swiping from the left, the swipe overlay will be hidden under your finger, so I decided to show it opposite, on the right.

Also, icons and values ​​should now display correctly according to screen density without increasing padding.

If everything is correct, you should see something like the screenshot above.