Created
August 4, 2022 23:57
-
-
Save chaudharydeepanshu/26217550b19def87966bde16ffe05cd1 to your computer and use it in GitHub Desktop.
inserting more data on start of scrollview on swiping top
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
import 'package:flutter/material.dart'; | |
void main() { | |
runApp(MyApp()); | |
} | |
class MyApp extends StatelessWidget { | |
@override | |
Widget build(BuildContext context) { | |
return MaterialApp( | |
title: 'Flutter Demo', | |
theme: ThemeData( | |
primarySwatch: Colors.blue, | |
), | |
home: WrapHomePage(), | |
); | |
} | |
} | |
class WrapHomePage extends StatefulWidget { | |
const WrapHomePage(); | |
@override | |
_WrapHomePageState createState() => _WrapHomePageState(); | |
} | |
class _WrapHomePageState extends State<WrapHomePage> { | |
late List<Widget> _pages; | |
List<Widget> _newPages = <Widget>[]; | |
// This points always to the mid-element in _list | |
late int _initialIndex; | |
// This should work with 3, 7, 11, ... odd elements. Mind the pattern!!! | |
List<int> list = [-2, -1, 0, 1, 2]; | |
late PageController _controller; | |
@override | |
void initState() { | |
super.initState(); | |
_pages = List.generate(list.length, (index) { | |
final Key key = ValueKey(index); | |
return Container( | |
key: key, | |
height: 50, | |
color: index % 2 == 0 ? Colors.green : Colors.yellow, | |
child: Text('Tile $index'), | |
); | |
}); | |
// Calculate mid. | |
_initialIndex = (list.length / 2).floor(); | |
_controller = | |
PageController(initialPage: _initialIndex, viewportFraction: 1); | |
// This is where we listen to changes. | |
_controller.addListener(() { | |
// Get index according to the direction | |
// _controller.page! > _initialIndex => swiping to the right, going to the left / previous element | |
// _controller.page! < _initialIndex => swiping to the left, going to the right / next element | |
final index = _controller.page! > _initialIndex | |
? _controller.page!.floor() | |
: _controller.page!.ceil(); | |
if (index == _initialIndex) { | |
return; | |
} | |
if (index == _initialIndex - 1) { | |
_prev(); | |
} else if (index == _initialIndex + 1) { | |
_next(); | |
} | |
}); | |
} | |
@override | |
void dispose() { | |
_controller.dispose(); | |
super.dispose(); | |
} | |
// Update _pages list when going next | |
void _next() { | |
setState(() { | |
_pages.add( | |
Container( | |
height: 50, | |
color: _pages.length % 2 == 0 ? Colors.green : Colors.yellow, | |
child: Text('New Tile ${_pages.length}'), | |
), | |
); | |
}); | |
} | |
// Update _newPages list when going previous | |
void _prev() { | |
setState(() { | |
_newPages.add( | |
Container( | |
height: 50, | |
color: _newPages.length % 2 == 0 ? Colors.green : Colors.yellow, | |
child: Text('New Tile ${_newPages.length}'), | |
), | |
); | |
}); | |
} | |
@override | |
Widget build(BuildContext context) { | |
return Scaffold( | |
body: Center( | |
child: SizedBox( | |
height: 100, | |
child: CustomScrollView( | |
center: ValueKey(0), | |
controller: _controller, | |
/// <-- Here... | |
physics: PageScrollPhysics(), | |
slivers: [ | |
SliverFillViewport( | |
delegate: SliverChildBuilderDelegate( | |
(BuildContext context, int index) { | |
return _newPages[index]; | |
}, | |
childCount: _newPages.length, | |
), | |
), | |
SliverFillViewport( | |
key: ValueKey(0), | |
/// <-- and here... | |
delegate: SliverChildBuilderDelegate( | |
(BuildContext context, int index) { | |
return _pages[index]; | |
}, | |
childCount: _pages.length, | |
), | |
), | |
], | |
), | |
), | |
), | |
persistentFooterButtons: [ | |
FloatingActionButton( | |
child: Text('B'), | |
onPressed: () { | |
setState(() { | |
_newPages.add( | |
Container( | |
height: 50, | |
color: | |
_newPages.length % 2 == 0 ? Colors.green : Colors.yellow, | |
child: Text('New Tile ${_newPages.length}'), | |
), | |
); | |
}); | |
}, | |
), | |
FloatingActionButton( | |
child: Text('E'), | |
onPressed: () { | |
setState(() { | |
_pages.add( | |
Container( | |
height: 50, | |
color: _pages.length % 2 == 0 ? Colors.green : Colors.yellow, | |
child: Text('New Tile ${_pages.length}'), | |
), | |
); | |
}); | |
}, | |
), | |
], | |
); | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment