Flutter ListTopBottom:
Video:
Code:
import 'package:flutter/material.dart'; void main() { runApp(MyApp()); } class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( debugShowCheckedModeBanner: false, home: MyHome(), ); } } class MyHome extends StatefulWidget { @override _MyHomeState createState() => _MyHomeState(); } class _MyHomeState extends State<MyHome> { final initList = List<String>.generate(100, (i) => "Item $i"); ScrollController scrollController; bool showFAB = false; @override void initState() { super.initState(); scrollController = ScrollController(); scrollController.addListener(onScroll); } onScroll() { if (scrollController.offset < 500 && showFAB) { setState(() => showFAB = false); } else if (scrollController.offset >= 500 && showFAB == false) { setState(() => showFAB = true); } } @override void dispose() { scrollController.removeListener(onScroll); scrollController.dispose(); super.dispose(); } @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title: Text("ListTopBottom"), backgroundColor: Colors.blueGrey, ), backgroundColor: Colors.yellow, body: Stack( children: <Widget>[ Column( children: <Widget>[ Expanded( child: ListView.builder( controller: scrollController, shrinkWrap: true, itemCount: initList.length, itemBuilder: (context, index) { return ListTile( title: Text( '${initList[index]}', style: TextStyle( fontSize: 25.0, ), ), ); }, ), ), ButtonBar( children: <Widget>[ RaisedButton( onPressed: () => scrollToTop(), color: Colors.teal, child: Row( children: <Widget>[ Icon(Icons.keyboard_arrow_up), Text( "Top", style: TextStyle( fontSize: 23.0, ), ), ], ), ), RaisedButton( onPressed: () => scrollToBottom(), color: Colors.teal, child: Row( children: <Widget>[ Icon(Icons.keyboard_arrow_down), Text( "Bottom", style: TextStyle( fontSize: 23.0, ), ), ], ), ), ], ) ], ), Positioned( right: 20, bottom: 100, child: showFAB ? FloatingActionButton( onPressed: () {}, child: Text('F'), ) : Container(), ), ], ), ); } scrollToTop() { scrollController.animateTo( scrollController.position.minScrollExtent, duration: Duration(milliseconds: 1000), curve: Curves.easeIn, ); setState(() {}); } scrollToBottom() { scrollController.animateTo( scrollController.position.maxScrollExtent, duration: Duration(milliseconds: 1000), curve: Curves.easeOut, ); setState(() {}); } }
0 Comments