flutter - Flutter：使用同一Widget中列表中项目的索引

Question

希望你安全并且做得很好。好的，所以我的问题是我想使用cardBuilder 的索引

cardBuilder: (context, index) => Card(

在swipeUpdateCallback中，我想在向右或向左滑动时使用它，我该怎么做？如何在 swipeUpdateCallback 中调用索引？

 swipeUpdateCallback:
          (DragUpdateDetails details, Alignment align) {
       
        if (align.x < 0) {
          _dataService.seenPost(
              welcomeImages[_index].id, ///want to use the index here///
              welcomeImages[_index].seen, ///want to use the index here///
              welcomeImages[_index].imgPath); ///want to use the index here///
        }

这是小部件的完整代码：

child: new TinderSwapCard(
      swipeUp: true,
      swipeDown: true,
      orientation: AmassOrientation.BOTTOM,
      totalNum: welcomeImages.length,
      stackNum: 3,
      swipeEdge: 4.0,
      maxWidth: MediaQuery.of(context).size.width * 1.5,
      maxHeight: MediaQuery.of(context).size.width * 1.5,
      minWidth: MediaQuery.of(context).size.width * 1.4,
      minHeight: MediaQuery.of(context).size.width * 1.4,
      cardBuilder: (context, index) => Card( ///Here's the index i want to use///
        child: SingleChildScrollView(
          child: Column(
            children: [
              Text('s'),
              new Image.network(
                '${welcomeImages[index].imgPath}',
                fit: BoxFit.cover,
              ),
            ],
          ),
        ),
      ),
      cardController: controller = CardController(),
      swipeUpdateCallback:
          (DragUpdateDetails details, Alignment align) {
        if (align.x < 0) {
          _dataService.seenPost(
              welcomeImages[index].id, ///want to use the index here///
              welcomeImages[index].seen,
              welcomeImages[index].imgPath);
        } else if (align.x > 0) {
          //Card is RIGHT swiping
        }
      },

Answer 1

您可以使用swipeCompleteCallback保存当前index和使用swipeUpdateCallback
但是如果您使用swipeUpdateCallback，当滑动发生时您_dataService将被多次调用
我不知道您的用例，但您可以将_dataService代码放入swipeCompleteCallback
代码片段

    swipeUpdateCallback:
          (DragUpdateDetails details, Alignment align) {
        if (align.x < 0) {
          _dataService.seenPost(
              welcomeImages[currentIndex].id, ///want to use the Index here///
              welcomeImages[currentIndex].seen,
              welcomeImages[currentIndex].imgPath);
        } else if (align.x > 0) {
          //Card is RIGHT swiping
        }
      },
    swipeCompleteCallback:
                (CardSwipeOrientation orientation, int index) {
              currentIndex = index;
              print("$currentIndex ${orientation.toString()}");

              /// Get orientation & index of swiped card!
            },

完整的示例代码

import 'package:flutter/material.dart';
import 'package:flutter_tindercard/flutter_tindercard.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: ExampleHomePage(),
    );
  }
}

class ExampleHomePage extends StatefulWidget {
  @override
  _ExampleHomePageState createState() => _ExampleHomePageState();
}

class _ExampleHomePageState extends State<ExampleHomePage>
    with TickerProviderStateMixin {
  List<String> welcomeImages = [
    "https://picsum.photos/250?image=9",
    "https://picsum.photos/250?image=10",
    "https://picsum.photos/250?image=11",
    "https://picsum.photos/250?image=12",
    "https://picsum.photos/250?image=13",
    "https://picsum.photos/250?image=14"
  ];

  int currentIndex = 0;
  @override
  Widget build(BuildContext context) {
    CardController controller; //Use this to trigger swap.

    return new Scaffold(
      body: new Center(
        child: Container(
          height: MediaQuery.of(context).size.height * 0.6,
          child: new TinderSwapCard(
            swipeUp: true,
            swipeDown: true,
            orientation: AmassOrientation.BOTTOM,
            totalNum: welcomeImages.length,
            stackNum: 3,
            swipeEdge: 4.0,
            maxWidth: MediaQuery.of(context).size.width * 0.9,
            maxHeight: MediaQuery.of(context).size.width * 0.9,
            minWidth: MediaQuery.of(context).size.width * 0.8,
            minHeight: MediaQuery.of(context).size.width * 0.8,
            cardBuilder: (context, index) => Card(
              child: Image.network('${welcomeImages[index]}'),
            ),
            cardController: controller = CardController(),
            swipeUpdateCallback: (DragUpdateDetails details, Alignment align) {
              /// Get swiping card's alignment
              if (align.x < 0) {
                //Card is LEFT swiping
                print("left");
              } else if (align.x > 0) {
                print("right");
                //Card is RIGHT swiping
              }
            },
            swipeCompleteCallback:
                (CardSwipeOrientation orientation, int index) {
              currentIndex = index;
              print("$currentIndex ${orientation.toString()}");

              /// Get orientation & index of swiped card!
            },
          ),
        ),
      ),
    );
  }
}