Sicherhaven/Eventify-frontend
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

perf: fix scroll lag on profile/contribute, unpin calendar gradient

Browse Source 
profile_screen: SingleChildScrollView + Column eagerly built every event
card (all images, shadows, tiles) at once even when off-screen. Replaced
with CustomScrollView + SliverList so only visible tiles are built per
frame. Also switches to BouncingScrollPhysics for natural momentum.

contribute_screen: Each _formCard wrapped in RepaintBoundary so form
cards are isolated render layers — one card's repaint doesn't invalidate
its siblings. Added BouncingScrollPhysics to the form SingleChildScrollView.

calendar_screen: Blue gradient banner was Positioned(top:0) making it
sticky even as the user scrolled. Removed the fixed Positioned layer and
moved the gradient inside the CustomScrollView as the first sliver in a
Stack alongside the calendar card (which keeps its y=110 visual overlap).
Now the entire page — gradient, calendar, events — scrolls as one unit.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Sicherhaven
2026-03-18 17:16:38 +05:30
parent 48f143399d
commit 9dcd5bae16
3 changed files with 118 additions and 41 deletions
Download Patch File Download Diff File Expand all files Collapse all files

50
lib/screens/calendar_screen.dart
View File

@@ -569,28 +569,11 @@ class _CalendarScreenState extends State<CalendarScreen> {
}
// MOBILE layout
// Stack: extended gradient panel (below appbar) that visually extends behind the calendar.
return Scaffold(
backgroundColor: theme.scaffoldBackgroundColor,
body: Stack(
children: [
// Extended blue gradient panel behind calendar (matches reference)
Positioned(
top: 0,
left: 0,
right: 0,
child: Container(
height: 260, // controls how much gradient shows behind calendar
decoration: AppDecoration.blueGradient.copyWith(
borderRadius: const BorderRadius.only(bottomLeft: Radius.circular(30), bottomRight: Radius.circular(30)),
boxShadow: [const BoxShadow(color: Colors.black12, blurRadius: 12, offset: Offset(0, 6))],
),
// leave child empty — title and bell are placed above
child: const SizedBox.shrink(),
),
),
// TOP APP BAR (title centered + notification at top-right) - unchanged placement
// TOP APP BAR stays fixed (title + bell icon)
Positioned(
top: 0,
left: 0,
@@ -637,15 +620,34 @@ class _CalendarScreenState extends State<CalendarScreen> {
),
),
// CONTENT: whole page scrolls as one — calendar + summary + events
// CONTENT: gradient + calendar card scroll together as one unit
CustomScrollView(
physics: const BouncingScrollPhysics(),
slivers: [
// Space for app bar + gradient top
const SliverToBoxAdapter(child: SizedBox(height: 110)),
// Calendar card
SliverToBoxAdapter(child: _calendarCard(context)),
// Gradient + calendar card in one scrollable Stack
// Gradient scrolls away with content; app bar remains fixed above
SliverToBoxAdapter(
child: Stack(
children: [
// Blue gradient banner — scrolls with content
Container(
height: 260,
decoration: AppDecoration.blueGradient.copyWith(
borderRadius: const BorderRadius.only(
bottomLeft: Radius.circular(30),
bottomRight: Radius.circular(30),
),
boxShadow: const [BoxShadow(color: Colors.black12, blurRadius: 12, offset: Offset(0, 6))],
),
),
// Calendar card starts at y=110 (after app bar), overlapping gradient
Padding(
padding: const EdgeInsets.only(top: 110),
child: _calendarCard(context),
),
],
),
),
// Selected date summary
SliverToBoxAdapter(child: _selectedDateSummary(context)),