All work

2024

Infinite Scroll BLoC

A Flutter learning project that loads a paginated post feed with BLoC-driven state, scroll-triggered fetches, and concurrency control.

Role
Flutter Developer
Categories
Mobile

Problem

Long feeds need to load additional content as people scroll without repeatedly requesting the same page, losing existing items, or leaving the interface in an unclear loading or error state. This project explores that behaviour as a focused Flutter and BLoC implementation.

Approach

The app requests posts from the JSONPlaceholder API in pages of 20. A ScrollController watches the list position and dispatches a fetch event when the reader reaches 90% of the available scroll distance.

PostBloc owns the loading lifecycle: it tracks initial loading, successful results, request failure, the accumulated post list, and whether there are no more pages. Its fetch events use a throttled, droppable transformer, preventing rapid scroll activity from starting overlapping requests. Equatable state values and a BlocObserver make transitions and failures easier to inspect during development.

The Flutter view renders the appropriate feedback for the initial load, empty feed, failure, loaded posts, and bottom loading state.

Outcome

The result is a compact reference implementation for building an incremental, API-backed list in Flutter. It demonstrates pagination, state accumulation, scroll thresholds, and request-concurrency handling with BLoC. The repository is a learning project and does not claim user-facing product metrics.

Responsibilities

  • Built the Flutter post-list interface and reusable post and loading widgets.
  • Implemented paginated HTTP fetching from JSONPlaceholder and mapped responses into Equatable post models.
  • Modelled fetch status, accumulated results, and end-of-list state in PostBloc.
  • Added scroll-based fetch triggering and throttled, droppable event handling to control concurrent requests.
  • Added BLoC transition and error observation for development diagnostics.