Skip to content

New Feature: Vertical Scroll#736

Open
adnan29979 wants to merge 5 commits intoquran:mainfrom
adnan29979:VerticalScrollAttempt3B
Open

New Feature: Vertical Scroll#736
adnan29979 wants to merge 5 commits intoquran:mainfrom
adnan29979:VerticalScrollAttempt3B

Conversation

@adnan29979
Copy link
Contributor

QuranVerticalPaginationView.swift for vertical scrolling in translation mode.
MoreMenuScrollDirection.swift for toggle between horizontal and vertical scrolling

notes:
loadedRange always starts from page 0 so that it can only only expand downward. This avoids a jarring scroll jump bug.

When ContentTranslationViewBody is loading (the items are empty), it shows a ProgressView with a very light/transparent background. At the same time, QuranVerticalPaginationView always draws PageMiddleSeparator() between pages. Because of that, you could see white vertical lines appear while the pages were loading. Just a small user experience bug.
So we gave the loading state a proper background color (matching the app theme) so those separators stay hidden until the content is ready.

Please feel free to ask for changes if required. I have tested this vigorously, and there are no issues from my testing so far.

adnan29979 and others added 5 commits December 10, 2025 05:52
@codecov
Copy link

codecov bot commented Dec 10, 2025

Codecov Report

❌ Patch coverage is 0% with 197 lines in your changes missing coverage. Please review.
✅ Project coverage is 36.47%. Comparing base (d9fc366) to head (87b6070).
⚠️ Report is 80 commits behind head on main.

Files with missing lines Patch % Lines
...uranPagesFeature/QuranVerticalPaginationView.swift 0.00% 108 Missing ⚠️
...oreMenuFeature/views/MoreMenuScrollDirection.swift 0.00% 28 Missing ⚠️
...ranTranslationFeature/ContentTranslationView.swift 0.00% 23 Missing ⚠️
...oorUI/Features/Quran/AdaptiveImageScrollView.swift 0.00% 21 Missing ⚠️
...eatures/QuranContentFeature/ContentViewModel.swift 0.00% 7 Missing ⚠️
...atures/QuranPagesFeature/QuranPaginationView.swift 0.00% 6 Missing ⚠️
Features/QuranContentFeature/PagesView.swift 0.00% 2 Missing ⚠️
Features/MoreMenuFeature/views/MoreMenuView.swift 0.00% 1 Missing ⚠️
Features/QuranViewFeature/QuranInteractor.swift 0.00% 1 Missing ⚠️
Additional details and impacted files
@@            Coverage Diff             @@
##             main     #736      +/-   ##
==========================================
- Coverage   40.92%   36.47%   -4.46%     
==========================================
  Files         525      554      +29     
  Lines       20880    21286     +406     
==========================================
- Hits         8546     7764     -782     
- Misses      12334    13522    +1188     

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.

@adnan29979
Copy link
Contributor Author

#691

@mohamede1945
Copy link
Collaborator

I think the biggest problem is the 2 cascaded scroll views. The experience will not be optimal when the users can reach the end of the page, they have to lift their finger and then scroll again to go to the next page rather than having just a single continuous scroll for all the ayat

@adnan29979
Copy link
Contributor Author

I may be misunderstanding your concern, because continuous scrolling is already implemented. In vertical mode, we set scrollingEnabled = false on each page, which makes ContentTranslationView use a plain LazyVStack instead of a List.

Since LazyVStack has no scrolling of its own, there's only one ScrollView (in QuranVerticalPaginationView) that handles all scrolling. Users should be able to scroll continuously through all ayat without lifting their finger.

Could you kindly clarify what you are experiencing?

@mohamede1945
Copy link
Collaborator

mohamede1945 commented Dec 15, 2025

Oh, I didn't notice that. My apologies! This is actually a brilliant idea. I'll download the code and start playing with/testing the app

@adnan29979
Copy link
Contributor Author

adnan29979 commented Dec 19, 2025

Assalamualaikum. Thanks. Any feedback you'd like to kindly share after testing?

@mohamede1945
Copy link
Collaborator

We alikum elsalam we rahamat Allah we barakatoh, I had a chance to test it today, please take a look at the attached recording.

First of all, the settings control looks amazing mashaa'Allah way better than the previous unreleased one and I like the small directional icons too.

Unfortunately, I think the navigation to a specific verse is not working. When I navigate to a surah, sometimes it goes correctly to the first verse of the surah, sometimes it goes to a different verse in a different page (I think it is usually the previous page, but didn't confirm with every navigation). Then even when it goes to the correct surah, as soon as I tap on the page to dismiss the bars, it automatically scrolls, sometimes it does the scroll and goes back to the same verse and sometimes it goes to a completely different verse. I also tested the navigation from the search screen.

I haven't tested it on a real device, but I expect performance issue with the use of ScrollView and LazyVStack since LazyVStack accumulates views in memory as the user scrolls vs List where it properly reuses views.

My suggestion is to create a single List and directly have the verses as children to that List.

Simulator.Screen.Recording.-.iPhone.16.-.2025-12-20.at.11.52.59.mov

@mohamede1945 mohamede1945 self-requested a review December 20, 2025 19:16
@adnan29979
Copy link
Contributor Author

Thank you very much. For some reason, in my mobile phone's testing, this issue wasn't there, and it was working perfectly. Interesting! Thanks a lot for pointing it out. I will get to the core of it and solve it. Thanks.
Apologies for the inconvenience.

@RayanSaeed
Copy link

RayanSaeed commented Feb 9, 2026

Any update on this @adnan29979 ?

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.

3 participants