fix: improve homepage scrolling behavior and clean up logic
This commit is contained in:
parent
0038efc13c
commit
3ad68594e2
|
@ -6,6 +6,17 @@ import 'package:furman_now/src/screens/home/content.dart';
|
|||
import 'package:furman_now/src/screens/home/state.dart';
|
||||
import 'package:provider/provider.dart';
|
||||
|
||||
class HomeScreenProvider extends StatelessWidget {
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return ChangeNotifierProvider(
|
||||
create: (context) => HomePageState(),
|
||||
child: const HomeScreen(),
|
||||
);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
class HomeScreen extends StatefulWidget {
|
||||
const HomeScreen({Key? key}) : super(key: key);
|
||||
|
||||
|
@ -28,10 +39,11 @@ class _HomeScreenState extends State<HomeScreen> {
|
|||
|
||||
updateScrollPosition() {
|
||||
// bottom overscroll
|
||||
if (_controller.position.pixels > _controller.position.maxScrollExtent) {
|
||||
var bottomOverscroll =
|
||||
_controller.position.pixels - _controller.position.maxScrollExtent;
|
||||
if (bottomOverscroll > 0) {
|
||||
setState(() {
|
||||
overscrollBottomAmount =
|
||||
_controller.position.pixels - _controller.position.maxScrollExtent;
|
||||
overscrollBottomAmount = bottomOverscroll;
|
||||
});
|
||||
} else {
|
||||
if (overscrollBottomAmount != 0) {
|
||||
|
@ -42,10 +54,10 @@ class _HomeScreenState extends State<HomeScreen> {
|
|||
}
|
||||
|
||||
// top overscroll
|
||||
if (_controller.position.pixels < 0) {
|
||||
var topOverscroll = -_controller.position.pixels;
|
||||
if (topOverscroll > 0) {
|
||||
setState(() {
|
||||
overscrollTopAmount =
|
||||
_controller.position.pixels.abs();
|
||||
overscrollTopAmount = topOverscroll;
|
||||
});
|
||||
} else {
|
||||
if (overscrollTopAmount != 0) {
|
||||
|
@ -54,85 +66,77 @@ class _HomeScreenState extends State<HomeScreen> {
|
|||
});
|
||||
}
|
||||
}
|
||||
|
||||
handleTopOverscroll(topOverscroll);
|
||||
}
|
||||
|
||||
handleScrollEvent(BuildContext context) {
|
||||
handleTopOverscroll(double overscrollTopAmount) {
|
||||
const scrollMessageSensitivity = 20;
|
||||
const pageSwitchSensitivity = 60;
|
||||
var offsetAmount = overscrollTopAmount.abs();
|
||||
var collapsed = context.read<HomePageState>().collapse;
|
||||
|
||||
if (overscrollTopAmount != 0) {
|
||||
if (offsetAmount > pageSwitchSensitivity) {
|
||||
if (!collapsed) {
|
||||
if (overscrollTopAmount > pageSwitchSensitivity) {
|
||||
// switch to student ID page
|
||||
context.router.navigate(const StudentIdRoute());
|
||||
context.read<HomePageState>().collapse = true;
|
||||
} else if (offsetAmount > scrollMessageSensitivity) {
|
||||
} else if (overscrollTopAmount > scrollMessageSensitivity) {
|
||||
// show student ID hint
|
||||
context.read<HomePageState>().showScrollMessage = true;
|
||||
} else {
|
||||
// hide student ID hint
|
||||
context.read<HomePageState>().showScrollMessage = false;
|
||||
}
|
||||
} else {
|
||||
context.read<HomePageState>().showScrollMessage = false;
|
||||
}
|
||||
|
||||
if (_controller.position.pixels > pageSwitchSensitivity) {
|
||||
context.router.navigate(const HomeRoute());
|
||||
context.read<HomePageState>().collapse = false;
|
||||
}
|
||||
if (collapsed && -overscrollTopAmount > pageSwitchSensitivity) {
|
||||
// switch back to home page
|
||||
context.router.navigate(const HomeRoute());
|
||||
context.read<HomePageState>().collapse = false;
|
||||
}
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return ChangeNotifierProvider(
|
||||
create: (context) => HomePageState(),
|
||||
builder: (context, _) => Scaffold(
|
||||
body: AnnotatedRegion<SystemUiOverlayStyle>(
|
||||
value: SystemUiOverlayStyle.light,
|
||||
return Scaffold(
|
||||
body: AnnotatedRegion<SystemUiOverlayStyle>(
|
||||
value: SystemUiOverlayStyle.light,
|
||||
child: Container(
|
||||
color: const Color(0xffb7acc9),
|
||||
child: SafeArea(
|
||||
child: Container(
|
||||
color: const Color(0xffb7acc9),
|
||||
child: SafeArea(
|
||||
child: Container(
|
||||
color: const Color(0xffb7acc9),
|
||||
child: Stack(
|
||||
fit: StackFit.loose,
|
||||
children: [
|
||||
// overscroll indicator color
|
||||
Align(
|
||||
alignment: Alignment.bottomCenter,
|
||||
child: Container(
|
||||
height: overscrollBottomAmount + 30,
|
||||
color: Colors.grey.shade50,
|
||||
),
|
||||
),
|
||||
const AutoTabsRouter(
|
||||
routes: [
|
||||
HomeRoute(),
|
||||
StudentIdRoute(),
|
||||
],
|
||||
),
|
||||
NotificationListener<ScrollNotification>(
|
||||
onNotification: (notification) {
|
||||
if (notification is ScrollUpdateNotification) {
|
||||
handleScrollEvent(context);
|
||||
}
|
||||
return true;
|
||||
},
|
||||
child: Consumer<HomePageState>(
|
||||
builder: (context, state, _) =>
|
||||
ClipRect(child: HomeContent(
|
||||
controller: _controller,
|
||||
collapse: state.collapse,
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
child: Stack(
|
||||
fit: StackFit.loose,
|
||||
children: [
|
||||
const AutoTabsRouter(
|
||||
routes: [
|
||||
HomeRoute(),
|
||||
StudentIdRoute(),
|
||||
],
|
||||
),
|
||||
),
|
||||
// overscroll indicator color
|
||||
Align(
|
||||
alignment: Alignment.bottomCenter,
|
||||
child: Container(
|
||||
height: overscrollBottomAmount + 30,
|
||||
color: Colors.grey.shade50,
|
||||
),
|
||||
),
|
||||
Consumer<HomePageState>(
|
||||
builder: (context, state, _) =>
|
||||
ClipRect(child: HomeContent(
|
||||
controller: _controller,
|
||||
collapse: state.collapse,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in New Issue