Add Previewer to NoteEditor #18724

Haz3-jolt · 2025-06-30T21:37:15Z

Purpose / Description

Rename NoteEditor to NoteEditorFragment
Introduce NoteEditor Activity which launches NoteEditorFragment into a FragmentContainerView
Fold the intent in NoteEditorLauncher to use NoteEditor (Activity) instead of a single fragment activity
Add previewer into a FragmentContainerView of NoteEditor with a 1 second refresh delay
Introduce a tab layout to switch between cards generated
Refresh Previewer when text changed, notetype changed, and note saved
Use ResizablePaneManager to make the layout resizable

Fixes

For GSoC 2025: Tablet & Chromebook UI

Approach

NoteEditor is now a activity which uses NoteEditorFragment,and PreviewerFrgment in X-Large Screens
Add previewer into a FragmentContainerView with a 1 second refresh delay
Introduce a tab layout to switch between cards generated
Refresh Previewer when text changed, notetype changed, and note saved
Use ResizablePaneManager to make the layout resizable

How Has This Been Tested?

Tested on the following Android Emulators:
Pixel Tablet API 36
Large Desktop API 34

Screenshots of affected screen in different themes:

Black Theme:
Plain Theme:
Default Light Theme:
Default Dark Theme:

Emulator Video:
t4.webm

Checklist

Please, go through these checks before submitting the PR.

You have a descriptive commit message with a short title (first line, max 50 chars).
You have commented your code, particularly in hard-to-understand areas
You have performed a self-review of your own code
UI changes: include screenshots of all affected screens (in particular showing any new or changed strings)
UI Changes: You have tested your change using the Google Accessibility Scanner

Arthur-Milchior · 2025-07-01T23:30:20Z

I don't have time to do a code review now, but I really like the look of it!

Haz3-jolt · 2025-07-02T20:12:22Z

I don't have time to do a code review now, but I really like the look of it!

Thanks! But david gave some feedback and it was decided that some re architecting is required!
So this might take a while to get merged!

david-allison

Is there any way this can be split into a separate commit (or probably in a separate Pull Request), there's a lot to review here, and I worry this will slow things down getting anything moving

Haz3-jolt · 2025-07-08T18:56:06Z

Is there any way this can be split into a separate commit (or probably in a separate Pull Request), there's a lot to review here, and I worry this will slow things down getting anything moving

I'll do a separate PR.

Haz3-jolt · 2025-07-09T20:04:51Z

One of the tests might still fail, I'll try to fix by tomorrow

AnkiDroid/src/main/AndroidManifest.xml

david-allison

I can understand the logical structure now. Great progress!

As commented, this feels like it should be 3 PRs (borderline feasible for this PR to consist of the 3 commits, no concern with trying that if you want)

The main blocker is the hard dependency on NoteEditor, which will need to be removed, I feel the rest will be nitpicks.

AnkiDroid/src/main/java/com/ichi2/anki/NoteEditor.kt

AnkiDroid/src/main/java/com/ichi2/anki/NoteEditorFragment.kt

david-allison · 2025-07-09T21:27:26Z

PS: I'd recommend adding a GitHub issue, and moving most of the labels which are currently applied to this PR there

Arthur-Milchior

I really like what I'm seeing when I execute the code. But I agree with David wholeheartedly about the fact that this should be multiple PR and that the architecture is too coupled.

If it's not clear what we mean here, please don't hesitate to ask question or discord, or event let us know if you want a call to discuss it, so that you can ask all questiuons that may be relevant and help you understand why we want it

AnkiDroid/src/main/java/com/ichi2/anki/NoteEditor.kt

Arthur-Milchior · 2025-07-10T01:11:19Z

AnkiDroid/src/main/java/com/ichi2/anki/NoteEditor.kt

+                refreshPreviewerFragmentRunnable?.let { refreshPreviewerFragmentHandler.removeCallbacks(it) }
+                val updateRunnable =
+                    Runnable {
+                        loadNoteEditorPreviewer()


Screen_recording_20250710_030629.webm

I admit that I'm not very fan of having to reload the fragment and the webview. Because it means the webview is always at the top after reloading.

This video recording is admittedly absurd. But I can easily imagine that I've a big image, or a complex mathjax formula at the top of the note, and that I want to edit the text/formula below, and that it'll become frustrating to always scroll back at the bottom.

I'd prefer either:

that we keep the same webview and change its content, if the scroll position is not changed with this or

that we recall where the scroll was and put it back at the same absolute location

I must note that on anki, the template previewer has the behavior I want. As there is no editor previewer, I can't really compare

that we keep the same webview and change its content, if the scroll position is not changed with this

Isn't really possible since we need to update the tab layout properly.

that we recall where the scroll was and put it back at the same absolute location

I think I'll work on this, but I will prolly push this out a bit since I am working on toggle-able hints rn

AnkiDroid/src/main/java/com/ichi2/anki/NoteEditorFragment.kt

AnkiDroid/src/main/java/com/ichi2/anki/NoteEditor.kt

sanjaysargam · 2025-07-10T06:42:10Z

@Haz3-jolt on edit note mode, previewer icon is showing

sanjaysargam · 2025-07-10T06:51:09Z

I am not able to resize layout. @Haz3-jolt Will you check from your side once ?
resize.webm

AnkiDroid/src/main/java/com/ichi2/anki/previewer/TemplatePreviewerFragment.kt

david-allison

One question on the de-conflict, the rest looks great!

AnkiDroid/src/main/java/com/ichi2/anki/previewer/TemplatePreviewerFragment.kt

AnkiDroid/src/main/java/com/ichi2/anki/NoteEditorFragment.kt

sanjaysargam

Add option to disable/enable split-pane on xlarge devices.
Settings -> Developer Options

AnkiDroid/src/main/java/com/ichi2/anki/NoteEditorActivity.kt

david-allison

Looks awesome, cheers! 🥳🥳🥳🥳

One request, but treat this as 'pending merge' after it's addressed

AnkiDroid/src/main/java/com/ichi2/anki/NoteEditorActivity.kt

…d tags The TemplatePreviewerArguments is a data class that only stores the data - it doesn't need to mutate the lists

…ions

- Introduce two-pane NoteEditor layout (editor + previewer) for xlarge screens - Add NoteEditorFragmentDelegate to notify host activity of editor events (ready, text changes, save, type change) so preview can stay in sync - Implement previewer loading in NoteEditorActivity using TemplatePreviewerFragment with tab navigation for multiple card templates - Retains tab position on text change - Rename allowSaveAndPreview(): - allowSaveAction() – controls when note can be saved - allowPreviewAction() – controls when preview menu item is shown (disabled in split mode since previewer is always visible) - Added method to update existing card being previewer updateContent() without full fragment reloading and while retaining currently selected card - Added method to get safe ord for Cloze card refresh

david-allison · 2025-12-28T02:17:08Z

THANK YOU SO MUCH!!!!!

Haz3-jolt added UI Note Editor Addition, editing & note type changes Tablet ChromeOS Needs Review GSoC Pull requests authored by a Google Summer of Code participant [Candidate/Selected], for GSoC mentors labels Jun 30, 2025

Haz3-jolt force-pushed the GSoC-NoteEditor branch from a84112d to 0c2b1c0 Compare June 30, 2025 21:49

Haz3-jolt marked this pull request as draft July 2, 2025 20:11

Haz3-jolt force-pushed the GSoC-NoteEditor branch from 0c2b1c0 to 5e5e6d4 Compare July 8, 2025 17:43

david-allison reviewed Jul 8, 2025

View reviewed changes

Haz3-jolt mentioned this pull request Jul 9, 2025

Rename NoteEditor to NoteEditorFragment #18823

Merged

5 tasks

github-actions bot added the Has Conflicts label Jul 9, 2025

Haz3-jolt force-pushed the GSoC-NoteEditor branch 2 times, most recently from f95706f to 442acc4 Compare July 9, 2025 20:03

Haz3-jolt removed the Has Conflicts label Jul 9, 2025

david-allison reviewed Jul 9, 2025

View reviewed changes

AnkiDroid/src/main/AndroidManifest.xml Show resolved Hide resolved

david-allison requested changes Jul 9, 2025

View reviewed changes

Arthur-Milchior reviewed Jul 10, 2025

View reviewed changes

Haz3-jolt removed UI Note Editor Addition, editing & note type changes Tablet ChromeOS labels Jul 10, 2025

sanjaysargam reviewed Jul 10, 2025

View reviewed changes

AnkiDroid/src/main/java/com/ichi2/anki/NoteEditor.kt Outdated Show resolved Hide resolved

david-allison reviewed Dec 20, 2025

View reviewed changes

AnkiDroid/src/main/java/com/ichi2/anki/previewer/TemplatePreviewerFragment.kt Show resolved Hide resolved

david-allison requested changes Dec 20, 2025

View reviewed changes

david-allison added the Needs Author Reply Waiting for a reply from the original author label Dec 20, 2025

Haz3-jolt force-pushed the GSoC-NoteEditor branch from 4f8f5d0 to dbdfa30 Compare December 20, 2025 20:25

Haz3-jolt requested a review from david-allison December 20, 2025 20:25

Haz3-jolt removed the Needs Author Reply Waiting for a reply from the original author label Dec 20, 2025

sanjaysargam reviewed Dec 21, 2025

View reviewed changes

AnkiDroid/src/main/java/com/ichi2/anki/NoteEditorActivity.kt Outdated Show resolved Hide resolved

david-allison approved these changes Dec 22, 2025

View reviewed changes

AnkiDroid/src/main/java/com/ichi2/anki/NoteEditorActivity.kt Outdated Show resolved Hide resolved

david-allison mentioned this pull request Dec 22, 2025

refactoring: Create NoteIntentParser #19895

Closed

Haz3-jolt force-pushed the GSoC-NoteEditor branch from dbdfa30 to 73916b9 Compare December 22, 2025 19:24

Haz3-jolt removed the Needs Author Reply Waiting for a reply from the original author label Dec 22, 2025

github-actions bot added the Has Conflicts label Dec 26, 2025

Haz3-jolt added 2 commits December 27, 2025 09:30

refactor(TemplatePreviewer): change MutableList to List for fields an…

2cf580c

…d tags The TemplatePreviewerArguments is a data class that only stores the data - it doesn't need to mutate the lists

NF(NoteEditor): split noteEditor performPreview operations into funct…

e4484ad

…ions

Haz3-jolt force-pushed the GSoC-NoteEditor branch from 73916b9 to 652010c Compare December 27, 2025 09:36

Haz3-jolt removed the Has Conflicts label Dec 27, 2025

Haz3-jolt force-pushed the GSoC-NoteEditor branch from 652010c to 6dbf592 Compare December 27, 2025 09:50

Haz3-jolt added the Next version Changes to be merged in the next version, to keep the current release stable. label Dec 27, 2025

david-allison added this pull request to the merge queue Dec 28, 2025

david-allison removed the Next version Changes to be merged in the next version, to keep the current release stable. label Dec 28, 2025

Merged via the queue into ankidroid:main with commit 0f4f87e Dec 28, 2025
15 checks passed

github-actions bot added this to the 2.24 release milestone Dec 28, 2025

github-actions bot removed the Pending Merge Things with approval that are waiting future merge (e.g. targets a future release, CI wait, etc) label Dec 28, 2025

Uh oh!

Add Previewer to NoteEditor #18724

Add Previewer to NoteEditor #18724

Uh oh!

Conversation

Haz3-jolt commented Jun 30, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Purpose / Description

Fixes

Approach

How Has This Been Tested?

Checklist

Uh oh!

Arthur-Milchior commented Jul 1, 2025

Uh oh!

Haz3-jolt commented Jul 2, 2025

Uh oh!

david-allison left a comment

Choose a reason for hiding this comment

Uh oh!

Haz3-jolt commented Jul 8, 2025

Uh oh!

Haz3-jolt commented Jul 9, 2025

Uh oh!

Uh oh!

david-allison left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

david-allison commented Jul 9, 2025

Uh oh!

Arthur-Milchior left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Arthur-Milchior Jul 10, 2025

Choose a reason for hiding this comment

Uh oh!

Haz3-jolt Jul 19, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

sanjaysargam commented Jul 10, 2025

Uh oh!

sanjaysargam commented Jul 10, 2025

Uh oh!

Uh oh!

david-allison left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

sanjaysargam left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

david-allison left a comment • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

david-allison commented Dec 28, 2025

Uh oh!

Uh oh!

Reviewers

Haz3-jolt commented Jun 30, 2025 •

edited

Loading

Haz3-jolt Jul 19, 2025 •

edited

Loading

david-allison left a comment •

edited

Loading