Le widget TabBar a un callback onTap () qui permet de détecter quand l'utilisateur vient d'appuyer sur un onglet. Ceci est utile pour que nous puissions préparer le nouveau tabView pour afficher des données dynamiques.
Le widget TabBar a également une fonctionnalité de glisser qui permet de changer la tabView affichée (résultat similaire à un appui sur un autre onglet). Mais dans ce cas, il ne semble y avoir aucun moyen de préparer le nouveau TabView car il n'y a pas de rappel onDrag ().
La question est donc: existe-t-il un moyen de détecter qu'un TabBarView vient d'être déplacé?
5 Réponses :
Vous pouvez utiliser un TabController et ajouter un auditeur à regarder les changements. Cela fonctionne pour les événements / actions tap-and-drag.
Vous pouvez faire quelque chose comme ceci:
_tabController.addListener(() {
print("${_tabController.index}");
});
qui détecte à la fois les pressions sur les onglets et les glissements. J'ai besoin de les différencier
Avez-vous vraiment besoin d'effectuer différentes actions lorsque vous appuyez ou faites glisser?
Si vous devez désactiver l'un des onglets, sachez ce bogue
J'ai besoin de les traiter différemment car le glisser génère 2 événements sur le _tabController (un pour le glisser commencé et un autre pour le glisser terminé). Dans mon gestionnaire d'événements, je dois charger (une seule fois) les éléments du nouveau tabView. BTW y a renommé le second handler en onTabDrag car il fait en fait des choses différentes
J'ai trouvé cette solution pour faire la distinction entre un appui sur un nouvel onglet et le glissement vers un nouvel onglet d'événements.
Cela semble très gênant mais cela fonctionne. C'est dommage qu'il ne soit pas possible de détecter le début du balayage.
@override
void initState() {
print("FB:X _HNPageState:initState()");
_tabController = TabController(vsync: this, length: _myTabs.length);
_tabController.addListener(() {
if (_tabController.indexIsChanging)
// Tab Changed tapping on new tab
onTabTap();
else if(_tabController.index != _tabController.previousIndex)
// Tab Changed swiping to a new tab
onTabDrag();
});
super.initState();
}
Les réponses précédentes ne prennent en compte que lorsque l'utilisateur a fini de faire glisser.
Si vous avez besoin d'écouter des données plus précises (c'est-à-dire que l'utilisateur vient de commencer à faire glisser), vous pouvez écouter l'animation:
_tabController.animation.addListener(() => print(_tabController.animation.value.toString));
Voici ma solution;
if (_tabController.indexIsChanging ||
(_tabController.animation.value == _tabController.index)) {
print(_tabController.index);
Provider.of<OrderScreenProvider>(context, listen: false).onIndexChangeResetAccountInfo();
}
Dans mon cas; Les changements de glissement de tabulation ne sont pas gérés avec tabcontroller avant que je ne le définisse comme contrôleur TabView.
Gérez comme ceci;
TabBarView(
controller: _tabController,
...
TabBar(
controller: _tabController,
...
Et définissez-le;
void _handleTabSelection() {
if (_tabController.indexIsChanging || _tabController.index != _tabController.previousIndex) {
setState(() {
_selectedTab = _tabController.index;
});
}
}