Skip to content

Conversation

@Julian-Florez
Copy link

Overview

This PR implements infinite canvas functionality for notes, resolving issue #88. It introduces two new concepts: Infinite Notes and Dynamic Page Expansion.

What's New

1. Infinite Notes

  • A new note type that uses a single expandable canvas instead of multiple fixed-size pages
  • Created via a new "New infinite note" button in the home screen
  • The canvas starts at a reasonable size (4000x4000) to keep memory usage efficient
  • Infinite notes are persisted with a boolean flag 'inf' in the file format
  • Visual pattern scaling is controlled by infinitePatternFactor (default 1.25), persisted as 'ipf'

2. Dynamic Page Expansion

When drawing in an infinite note, the canvas automatically expands as needed:

Expansion Triggers:

  • When the pointer gets within 200px of the right, bottom, or left edge
  • Expands by 800px in the detected direction
  • Uses flags (_hasExpandedLeft, _hasExpandedRight, _hasExpandedDown) to prevent multiple expansions during a single stroke

Smart Expansion Behavior:

  • Right/Down expansion: Simple - just increases page size
  • Left expansion: More complex - expands the page width AND shifts all existing content to the right, maintaining visual continuity
  • Animation controller provides smooth 400ms easing for size changes
  • Transform suppression prevents camera jumps during expansion
  • The current stroke is automatically ended and re-applied after expansion

Visual Implementation:

  • Uses AnimatedSize with Alignment.topLeft anchor for smooth transitions
  • Removes FittedBox for infinite pages to prevent unwanted zoom changes during expansion
  • Canvas gesture detector disables automatic transform adjustments during expansion

3. Whitespace Trimming

Before saving, infinite pages automatically trim unused space:

  • trimWhitespace() calculates content bounds using getContentBounds()
  • Removes empty margins while maintaining a 50px buffer around content
  • Shifts strokes and images if trimming from left/top edges
  • Ensures saved files don't waste space with unnecessary empty canvas

4. Page Management

  • Infinite notes always maintain at least one page (createPage checks isInfinite)
  • Excess pages are never removed from infinite notes (removeExcessPages returns early)
  • Stroke bounding box calculations ensure final strokes fit within expanded canvas

Technical Details

Key Files Modified

  • lib/pages/editor/editor.dart - Main expansion logic, gesture handling, animation
  • lib/data/editor/editor_core_info.dart - Persistence of isInfinite and infinitePatternFactor
  • lib/data/editor/page.dart - Added trimWhitespace() and getContentBounds() methods
  • lib/components/canvas/canvas.dart - Conditional rendering for infinite vs normal pages
  • lib/components/canvas/canvas_gesture_detector.dart - Initial zoom handling for infinite notes
  • lib/components/canvas/inner_canvas.dart - Pattern scaling with infinitePatternFactor
  • lib/components/home/new_note_button.dart - New button to create infinite notes

File Format Changes

Two new optional fields added to the .sbn2 format:

  • 'inf' (boolean) - Marks note as infinite canvas
  • 'ipf' (double) - Pattern visual scale factor for infinite notes

User Experience

  1. Users can create a new infinite note from the home screen
  2. When drawing near edges, the canvas smoothly expands automatically
  3. Visual feedback through AnimatedSize makes expansion feel natural
  4. Content is never lost or shifted unexpectedly during expansion
  5. Saved files are optimized by trimming unused whitespace

Closes

Fixes #88

@adil192
Copy link
Member

adil192 commented Jan 8, 2026

Can you expand on how AI was used in this pull request?

@Julian-Florez
Copy link
Author

I used AI for debugging and to help write this pull request, as English is not my first language. I apologize if the use of AI is discouraged or frowned upon, as I couldn’t find any guidance about it in the documentation.

@adil192
Copy link
Member

adil192 commented Jan 12, 2026

Please can you fix the existing tests, and add new sbn tests for the infinite canvas

@ValentinoSpirito
Copy link

Do you guys know when the infinite canvas feature is to be expected in the final app?

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.

Pageless mode

3 participants