Dans Flutter , je ne peux pas associer le même PageController à de nombreux PageView . Vous devez donc utiliser au moins deux PageController s.
Comment puis-je synchroniser deux ou plusieurs Ce que je veux, c'est que chaque Donc, si a a A , B et C PageController ou PageView?
PageView puisse contrôler les autres PageView pour les synchroniser, quelle que soit la diapositive. PageView et je glisse A puis les diapositives B et C également ... si je glisse B , alors A et C diapositives ... et ainsi de suite.
3 Réponses :
Vous pouvez référencer https://github.com/braulio94/menu_flutter
L'astuce consiste à utiliser NotificationListener pour écouter ScrollUpdateNotification
et comparez deux pages
new NotificationListener<ScrollNotification>(
onNotification: (ScrollNotification notification) {
if (notification.depth == 0 &&
notification is ScrollUpdateNotification) {
selectedIndex.value = _pageController.page;
if (_backgroundPageController.page != _pageController.page) {
_backgroundPageController.position
// ignore: deprecated_member_use
.jumpToWithoutSettling(_pageController.position.pixels /
_kViewportFraction);
}
setState(() {});
}
return false;
}
extrait de code à la ligne 183
_backgroundPageController.page != _pageController.page
code complet
https://github.com/braulio94/menu_flutter/blob/ master / lib / screens / pager.dart
Dans ce cas, une seule PageView peut contrôler les autres. Ce que je veux, c'est que chaque PageView puisse contrôler les autres PageView pour les synchroniser, quelle que soit la diapositive.
Dans ce cas, NotificationListener écoute tous les ScrollUpdateNotification de PageView même TabBar, afin que vous puissiez conserver tous les pageController.page et comparer leur valeur
Il existe une autre solution. Lorsque vous créez des contrôleurs, vous pouvez ajouter des écouteurs pour chacun des. Dans chaque auditeur, vous devez décrire la logique d'un autre contrôleur.
Pour être plus clair, je vais décrire plus en détail. Si nécessaire, vous pouvez combiner la logique en une seule méthode, mais ce sera moins clair.
_controller1 = PageController(
initialPage: _previousPage,
keepPage: false,
viewportFraction: 1)
..addListener(_onController1Scroll);
Lorsque vous initialisez votre contrôleur, vous devez ajouter un écouteur pour chacun d'eux p >
int _previousPage = 0;
bool _isController1 = false;
bool _isController2 = false;
void resetMoveInfo(){
_isController1 = false;
_isController2 = false;
}
void _onController1Scroll() {
if (_isController2)
return;
_isController1 = true;
if (_controller1.page.toInt() == _controller1.page) {
_previousPage = _controller1.page.toInt();
resetMoveInfo();
}
_controller2.position
// ignore: deprecated_member_use
.jumpToWithoutSettling(_controller1.position.pixels * _viewPortFraction);
}
void _onController2Scroll() {
if (_isController1)
return;
_isController2 = true;
if (_controller2.page.toInt() == _controller2.page) {
_previousPage = _controller2.page.toInt();
resetMoveInfo();
}
_controller1.position
// ignore: deprecated_member_use
.jumpToWithoutSettling(_controller2.position.pixels / _viewPortFraction);
}
Pour synchroniser deux pages vues (au cas où vous voudriez utiliser différentes vues par exemple) créer deux contrôleurs, supérieur avec vue fraction 0,7 et inférieur avec 1,0 Maintenant, pour synchroniser, ajoutez un auditeur à la partie supérieure et obtenez la valeur de décalage de défilement actuelle.
@override
void initState() {
super.initState();
_controller_upper = new PageController(viewportFraction: 0.7);
_controller_bottom = new PageController();
_controller.addListener(_onScroll);
}
void _onScroll() {
scrollValue = _controller.page;
//page returns value between 0 to 1 for 1st page, 1 to 2 for second and s on, need to multiply it by screen width
_controller_bottom.jumpTo(scrollValue*MediaQuery.of(context).size.width);
}