Question

类似滑动，但具有左右两个按钮

我正在使用以下软件包：https://pub.dev/packages/flutter_tindercard

我不想拖动选项，我希望按钮向左或向右滑动有任何可能，请帮助我。由于特定的拖动机制（以及其背后的数学原理）是使这张卡片如此独特地移动并由这些家伙仓库管理的原因，所以我想我不可能在单击按钮的同时手动操纵卡片框架到侧面（在至少与实际刷卡的方式不同）。

我的代码

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

class SwipeCard extends StatefulWidget {
  @override
  _SwipeCardState createState() => _SwipeCardState();
}

class _SwipeCardState extends State<SwipeCard> {
  List<String> numText = [
    "1 of 1",
    "1 of 2",
    "1 of 3",
    "1 of 4",
    "1 of 5",
    "1 of 6"
  ];
  List<String> cardText = [
    "My First Card",
    "My Second Card",
    "My Third Card",
    "My fourth Card",
    "My fifth Card",
    "My Sixth Card"
  ];
  CardController controller;
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
          color: Color(0xff2dedaa),
          child: ListView(children: [
            Column(
              mainAxisAlignment: MainAxisAlignment.center,
              children: <Widget>[
                SizedBox(
                  height: 20,
                ),
                Row(
                  children: [
                    IconButton(
                      color: Colors.white,
                      icon: Icon(Icons.arrow_back),
                      onPressed: () {
                        // Navigator.push(
                        //     context,
                        //     MaterialPageRoute(
                        //         builder: (context) => PageViewScreen(indexValue: 3,)));
                      },
                      iconSize: 30,
                    ),
                    SizedBox(
                      width: 120,
                    ),
                    Container(
                        height: 40,
                        width: 50,
                        decoration: BoxDecoration(
                            image: DecorationImage(
                          image: AssetImage(
                            "assets/paw.png",
                          ),
                          fit: BoxFit.fill,
                        ))),
                    SizedBox(
                      width: 100,
                    ),
                    FlatButton(
                        onPressed: () {
                          //   Navigator.push(
                          //       context,
                          //       MaterialPageRoute(
                          //           builder: (context) => PetName()));
                        },
                        child: Text('Skip',
                            style: GoogleFonts.roboto(
                                color: Colors.white,
                                fontSize: 20,
                                fontWeight: FontWeight.bold))),
                  ],
                ),
                SizedBox(height: 20),
                Center(
                    child: Container(
                        height: MediaQuery.of(context).size.height * 0.6,
                        child: new TinderSwapCard(
                            orientation: AmassOrientation.TOP,
                            totalNum: 6,
                            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(
                                  elevation: 2,
                                  shape: RoundedRectangleBorder(
                                    borderRadius: BorderRadius.circular(15.0),
                                  ),
                                  child: Column(
                                    crossAxisAlignment:
                                        CrossAxisAlignment.center,
                                    children: [
                                      SizedBox(
                                        height: 20,
                                      ),
                                      Text('${numText[index]}'),
                                      SizedBox(
                                        height: 20,
                                      ),
                                      Text('${cardText[index]}'),
                                      Row(children: [
                                          FlatButton(child: Text('yes'),onPressed: (){

                                          },),
                                          FlatButton(child: Text('No'),onPressed: (){

                                          },),

                                      ],)
                                    ],
                                  ),
                                ),
                            cardController: controller = CardController(),
                            swipeUpdateCallback:
                                (DragUpdateDetails details, Alignment align) {
                              /// Get swiping card's alignment
                              if (align.x < 0) {
                                
                              } else if (align.x > 0) {
                                //Card is RIGHT swiping
                              }
                            },
                            swipeCompleteCallback:
                                (CardSwipeOrientation orientation, int index) {
                              /// Get orientation & index of swiped card!
                            }))),
              ],
            )
          ])),
    );
  }
}

Answer 1

使用此逻辑解决此问题

cardText.removeAt(0);

cardText是一个列表

TinderSwapCard(
                            orientation: AmassOrientation.TOP,
                            totalNum: cardText.length,
)

颤抖像扑打两个按钮

1 个答案: