Last active
August 16, 2022 11:31
-
-
Save RandalSchwartz/24fc41deb2c234c8a47219911f162e06 to your computer and use it in GitHub Desktop.
demonstrate "more to scroll" display
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// ignore_for_file: avoid_print | |
import 'package:flutter/material.dart'; | |
import 'package:flutter_hooks/flutter_hooks.dart'; // flutter pub add flutter_hooks | |
void main() => runApp(const MyApp()); | |
class MyApp extends StatelessWidget { | |
const MyApp({super.key}); | |
@override | |
Widget build(BuildContext context) { | |
return MaterialApp( | |
title: 'ScrollController Demo', | |
home: Scaffold( | |
appBar: AppBar( | |
title: const Text('ScrollController Demo'), | |
), | |
body: LayoutBuilder(builder: (context, constraints) { | |
print('constraints: $constraints'); | |
return HomeScreen( | |
constraints: constraints, | |
); | |
}), | |
), | |
); | |
} | |
} | |
class HomeScreen extends HookWidget { | |
const HomeScreen({ | |
super.key, | |
required BoxConstraints constraints, | |
}); | |
@override | |
Widget build(BuildContext context) { | |
final scroller = useScrollController(); | |
useListenable(scroller); | |
final moreHidden = useState(false); | |
if (scroller.positions.isEmpty) { | |
WidgetsBinding.instance.addPostFrameCallback((_) { | |
if (scroller.position.extentAfter > 0) { | |
moreHidden.value = true; | |
} | |
}); | |
} else { | |
moreHidden.value = scroller.position.extentAfter > 0; | |
} | |
print([moreHidden.value, scroller.positions]); | |
return Container( | |
color: Colors.orange, | |
child: Row( | |
children: [ | |
Expanded( | |
child: Container( | |
alignment: Alignment.center, | |
color: Colors.red, | |
child: const Text('Left'), | |
), | |
), | |
Expanded( | |
child: Container( | |
alignment: Alignment.center, | |
color: Colors.green, | |
child: Column( | |
children: [ | |
Expanded( | |
child: Container( | |
color: Colors.yellow, | |
child: ListView( | |
controller: scroller, | |
children: List.generate( | |
20, | |
(n) => Center( | |
child: Text('item ${n + 1}', | |
style: const TextStyle(fontSize: 18)), | |
), | |
), | |
), | |
), | |
), | |
Center( | |
child: AnimatedOpacity( | |
duration: const Duration(milliseconds: 200), | |
opacity: moreHidden.value ? 1 : 0, | |
child: const Text('scroll to see more', | |
style: TextStyle(fontSize: 24), | |
textAlign: TextAlign.center), | |
), | |
), | |
], | |
), | |
), | |
), | |
Expanded( | |
child: Container( | |
alignment: Alignment.center, | |
color: Colors.red, | |
child: const Text('Right'), | |
), | |
), | |
], | |
), | |
); | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment