Mirrored_Repos/AppFlowy
1
0
Fork 0
mirror of https://github.com/AppFlowy-IO/AppFlowy.git synced 2024-08-30 18:12:39 +00:00
Code Issues Packages Projects Releases Wiki Activity

[flutter]: hide scrollbar after stop scrolling

Browse Source
This commit is contained in:
appflowy 2021-10-26 23:54:07 +08:00
parent e1b7ff66f4
commit ed412ab63a
1 changed files with 31 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
app_flowy/packages/flowy_infra_ui/lib/style_widget/scrolling/styled_scroll_bar.dart
View File

@ -1,4 +1,6 @@
import 'dart:math'; import 'dart:math';
import 'dart:async';
import 'package:async/async.dart';
import 'package:flowy_infra/size.dart'; import 'package:flowy_infra/size.dart';
import 'package:flowy_infra/theme.dart'; import 'package:flowy_infra/theme.dart';
import 'package:flowy_infra_ui/widget/mouse_hover_builder.dart'; import 'package:flowy_infra_ui/widget/mouse_hover_builder.dart';
@ -38,10 +40,34 @@ class StyledScrollbar extends StatefulWidget {
class ScrollbarState extends State<StyledScrollbar> { class ScrollbarState extends State<StyledScrollbar> {
double _viewExtent = 100; double _viewExtent = 100;
CancelableOperation? _hideScrollbarOperation;
bool hideHandler = false;
@override @override
void initState() { void initState() {
widget.controller.addListener(() => setState(() {})); // widget.controller.addListener(() => setState(() {}));
widget.controller.position.isScrollingNotifier.addListener(
() {
if (!mounted) {
return;
}
_hideScrollbarOperation?.cancel();
if (!widget.controller.position.isScrollingNotifier.value) {
// scroll is stopped
_hideScrollbarOperation = CancelableOperation.fromFuture(
Future.delayed(const Duration(seconds: 2), () {
// Opti: hide with animation
hideHandler = true;
setState(() {});
}),
);
} else {
// Do nothing
hideHandler = false;
setState(() {});
}
},
);
super.initState(); super.initState();
} }
@ -106,6 +132,10 @@ class ScrollbarState extends State<StyledScrollbar> {
} }
// Hide the handle if content is < the viewExtent // Hide the handle if content is < the viewExtent
var showHandle = contentExtent > _viewExtent && contentExtent > 0; var showHandle = contentExtent > _viewExtent && contentExtent > 0;
if (hideHandler) {
showHandle = false;
}
// Handle color // Handle color
var handleColor = widget.handleColor ?? (theme.isDark ? theme.bg2.withOpacity(.2) : theme.bg2); var handleColor = widget.handleColor ?? (theme.isDark ? theme.bg2.withOpacity(.2) : theme.bg2);
// Track color // Track color