improve bottom sheet fps

This commit is contained in:
Fabian Freund
2026-07-31 06:59:40 +02:00
parent 376fc7d4bb
commit 5b83a62a4f
6 changed files with 299 additions and 372 deletions
@@ -21,7 +21,6 @@
import 'dart:async'; import 'dart:async';
import 'dart:convert'; import 'dart:convert';
import 'package:fading_scroll/fading_scroll.dart';
import 'package:fast_equatable/fast_equatable.dart'; import 'package:fast_equatable/fast_equatable.dart';
import 'package:file_picker/file_picker.dart'; import 'package:file_picker/file_picker.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
@@ -134,12 +133,8 @@ class _BrowserMenuSheet extends HookConsumerWidget {
// Scrollable content // Scrollable content
Expanded( Expanded(
child: FadingScroll( child: ListView(
controller: scrollController, controller: scrollController,
fadingSize: 25,
builder: (context, controller) {
return ListView(
controller: controller,
padding: const EdgeInsets.symmetric( padding: const EdgeInsets.symmetric(
horizontal: 16, horizontal: 16,
vertical: 8, vertical: 8,
@@ -168,9 +163,7 @@ class _BrowserMenuSheet extends HookConsumerWidget {
], ],
// Quick links grid // Quick links grid
_QuickLinksGrid( _QuickLinksGrid(showContainerUi: settings.showContainerUi),
showContainerUi: settings.showContainerUi,
),
const SizedBox(height: 16), const SizedBox(height: 16),
// Connection (Tor + proxy profiles) // Connection (Tor + proxy profiles)
@@ -185,8 +178,6 @@ class _BrowserMenuSheet extends HookConsumerWidget {
const _SettingsCard(), const _SettingsCard(),
const SizedBox(height: 24), const SizedBox(height: 24),
], ],
);
},
), ),
), ),
@@ -50,26 +50,7 @@ class DraggableScrollableHeader extends StatefulWidget {
_DraggableScrollableHeaderState(); _DraggableScrollableHeaderState();
} }
class _DraggableScrollableHeaderState extends State<DraggableScrollableHeader> class _DraggableScrollableHeaderState extends State<DraggableScrollableHeader> {
with TickerProviderStateMixin {
late AnimationController _animationController;
late Animation<double>? _animation;
@override
void initState() {
super.initState();
_animationController = AnimationController(
vsync: this,
duration: widget.animationDuration,
);
}
@override
void dispose() {
_animationController.dispose();
super.dispose();
}
Future<void> _animateToPosition( Future<void> _animateToPosition(
double targetSize, { double targetSize, {
Duration? customDuration, Duration? customDuration,
@@ -79,34 +60,17 @@ class _DraggableScrollableHeaderState extends State<DraggableScrollableHeader>
return; return;
} }
if (customDuration != null) { await widget.controller.animateTo(
_animationController.duration = customDuration; targetSize,
} else { duration: customDuration ?? widget.animationDuration,
_animationController.duration = widget.animationDuration;
}
_animation = Tween<double>(begin: widget.controller.size, end: targetSize)
.animate(
CurvedAnimation(
parent: _animationController,
curve: widget.animationCurve, curve: widget.animationCurve,
),
); );
_animationController.reset();
await _animationController.forward();
_animation!.addListener(() {
widget.controller.jumpTo(_animation!.value);
});
} }
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return GestureDetector( return GestureDetector(
onVerticalDragUpdate: (details) { onVerticalDragUpdate: (details) {
_animationController.stop();
// Apply drag sensitivity // Apply drag sensitivity
final adjustedDelta = details.delta.dy * widget.dragSensitivity; final adjustedDelta = details.delta.dy * widget.dragSensitivity;
@@ -18,7 +18,6 @@
* along with this program. If not, see <http://www.gnu.org/licenses/>. * along with this program. If not, see <http://www.gnu.org/licenses/>.
*/ */
import 'package:fading_scroll/fading_scroll.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter_hooks/flutter_hooks.dart'; import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart'; import 'package:hooks_riverpod/hooks_riverpod.dart';
@@ -144,13 +143,9 @@ class ViewTabSheetWidget extends HookConsumerWidget {
), ),
), ),
], ],
body: FadingScroll( body: ListView(
fadingSize: 15,
controller: sheetScrollController,
builder: (context, controller) {
return ListView(
padding: EdgeInsets.zero, padding: EdgeInsets.zero,
controller: controller, controller: sheetScrollController,
physics: const ClampingScrollPhysicsWithoutImplicit(), physics: const ClampingScrollPhysicsWithoutImplicit(),
children: [ children: [
// Tracking Protection Section // Tracking Protection Section
@@ -184,8 +179,6 @@ class ViewTabSheetWidget extends HookConsumerWidget {
), ),
const SizedBox(height: 16.0), const SizedBox(height: 16.0),
], ],
);
},
), ),
); );
} }
@@ -20,7 +20,6 @@
import 'dart:async'; import 'dart:async';
import 'dart:math' as math; import 'dart:math' as math;
import 'package:fading_scroll/fading_scroll.dart';
import 'package:fast_equatable/fast_equatable.dart'; import 'package:fast_equatable/fast_equatable.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter_hooks/flutter_hooks.dart'; import 'package:flutter_hooks/flutter_hooks.dart';
@@ -328,16 +327,12 @@ class _TabGridView extends HookConsumerWidget {
return Padding( return Padding(
padding: const EdgeInsets.symmetric(horizontal: 4.0), padding: const EdgeInsets.symmetric(horizontal: 4.0),
child: FadingScroll( child: !reorderEnabled
fadingSize: 5,
controller: scrollController,
builder: (context, controller) {
return !reorderEnabled
? _TabGrid( ? _TabGrid(
key: ValueKey(crossAxisCount), key: ValueKey(crossAxisCount),
crossAxisCount: crossAxisCount, crossAxisCount: crossAxisCount,
itemCount: displayItemCount, itemCount: displayItemCount,
scrollController: controller, scrollController: scrollController,
itemBuilder: (widget, _) { itemBuilder: (widget, _) {
if (widget is CustomDraggable) { if (widget is CustomDraggable) {
if (widget.data case final TabDragData dragData) { if (widget.data case final TabDragData dragData) {
@@ -360,7 +355,7 @@ class _TabGridView extends HookConsumerWidget {
: ReorderableBuilder.builder( : ReorderableBuilder.builder(
//Rebuild when cross axis count changes //Rebuild when cross axis count changes
key: ValueKey(crossAxisCount), key: ValueKey(crossAxisCount),
scrollController: controller, scrollController: scrollController,
itemCount: displayItemCount, itemCount: displayItemCount,
onDragStarted: (index) { onDragStarted: (index) {
ref.read(willAcceptDropProvider.notifier).clear(); ref.read(willAcceptDropProvider.notifier).clear();
@@ -406,7 +401,7 @@ class _TabGridView extends HookConsumerWidget {
return _TabGrid( return _TabGrid(
crossAxisCount: crossAxisCount, crossAxisCount: crossAxisCount,
itemCount: displayItemCount, itemCount: displayItemCount,
scrollController: controller, scrollController: scrollController,
itemBuilder: (widget, index) { itemBuilder: (widget, index) {
// Wrap with context menu before passing to reorderable // Wrap with context menu before passing to reorderable
Widget wrapped = widget; Widget wrapped = widget;
@@ -432,8 +427,6 @@ class _TabGridView extends HookConsumerWidget {
onClose: onClose, onClose: onClose,
); );
}, },
);
},
), ),
); );
} }
@@ -20,7 +20,6 @@
import 'dart:async'; import 'dart:async';
import 'dart:math' as math; import 'dart:math' as math;
import 'package:fading_scroll/fading_scroll.dart';
import 'package:fast_equatable/fast_equatable.dart'; import 'package:fast_equatable/fast_equatable.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter_hooks/flutter_hooks.dart'; import 'package:flutter_hooks/flutter_hooks.dart';
@@ -366,11 +365,7 @@ class _TabListView extends HookConsumerWidget {
return Padding( return Padding(
padding: const EdgeInsets.symmetric(horizontal: 4.0), padding: const EdgeInsets.symmetric(horizontal: 4.0),
child: FadingScroll( child: !reorderEnabled
fadingSize: 5,
controller: scrollController,
builder: (context, controller) {
return !reorderEnabled
? ListView.builder( ? ListView.builder(
padding: const EdgeInsets.only(bottom: 56), padding: const EdgeInsets.only(bottom: 56),
controller: scrollController, controller: scrollController,
@@ -425,7 +420,7 @@ class _TabListView extends HookConsumerWidget {
}, },
) )
: ReorderableListView.builder( : ReorderableListView.builder(
scrollController: controller, scrollController: scrollController,
padding: const EdgeInsets.only(bottom: 56), padding: const EdgeInsets.only(bottom: 56),
itemCount: displayItemCount, itemCount: displayItemCount,
itemExtent: _itemHeight, itemExtent: _itemHeight,
@@ -496,8 +491,6 @@ class _TabListView extends HookConsumerWidget {
); );
} }
}, },
);
},
), ),
); );
} }
@@ -20,7 +20,6 @@
import 'dart:async'; import 'dart:async';
import 'dart:math' as math; import 'dart:math' as math;
import 'package:fading_scroll/fading_scroll.dart';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:flutter_hooks/flutter_hooks.dart'; import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:hooks_riverpod/hooks_riverpod.dart'; import 'package:hooks_riverpod/hooks_riverpod.dart';
@@ -335,12 +334,8 @@ class _TabTreesGrid extends HookConsumerWidget {
return Padding( return Padding(
padding: const EdgeInsets.symmetric(horizontal: 4.0), padding: const EdgeInsets.symmetric(horizontal: 4.0),
child: FadingScroll( child: GridView.builder(
controller: scrollController, controller: scrollController,
fadingSize: 5,
builder: (context, controller) {
return GridView.builder(
controller: controller,
padding: const EdgeInsets.only(bottom: 56), padding: const EdgeInsets.only(bottom: 56),
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount( gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
//Sync values for itemHeight calculation _calculateItemHeight //Sync values for itemHeight calculation _calculateItemHeight
@@ -351,8 +346,6 @@ class _TabTreesGrid extends HookConsumerWidget {
), ),
itemCount: tabs.length, itemCount: tabs.length,
itemBuilder: (context, index) => tabs[index], itemBuilder: (context, index) => tabs[index],
);
},
), ),
); );
} }