Flutter - 按下按钮进行刷卡
Flutter - Press button to make a card swipe
所以我使用的是 TinderSwapCard,swipeCompleteCallback 运行良好,我只想添加 2 个按钮,通过按下按钮获得相同的滑动动画。
我该怎么做?
提前致谢。
a picture of the app
这里是使用的代码:
new TinderSwapCard(
orientation: AmassOrientation.TOP,
swipeUp: false,
swipeDown: false,
totalNum: list.length,
stackNum: 4,
maxHeight: MediaQuery.of(context).size.width*1.7,
maxWidth: MediaQuery.of(context).size.width*0.9,
minHeight: MediaQuery.of(context).size.width*0.9,
minWidth: MediaQuery.of(context).size.width*0.6,
cardBuilder: (context,index)=>Card(
color: Colors.black,
child: Column(
children: [
new Image.asset(
list[index],
fit: BoxFit.fill,
),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
RawMaterialButton(
fillColor: Colors.white,
child: FaIcon(FontAwesomeIcons.times,size: 50.0,color: Colors.red,),
shape: CircleBorder(),
padding: const EdgeInsets.all(8.0),
onPressed: (){
//what to do here ?
},),
RawMaterialButton(
fillColor: Colors.white,
child: FaIcon(FontAwesomeIcons.solidHeart,size: 50.0,color: Colors.green,),
shape: CircleBorder(),
padding: const EdgeInsets.all(8.0),
onPressed: (){
//what to do here ?
},),
],
),
],
),
),
swipeCompleteCallback: (CardSwipeOrientation orientation,int index){
if (orientation == CardSwipeOrientation.LEFT){
print("left");
}
if (orientation == CardSwipeOrientation.RIGHT){
print("Right" );
}
}
);
在您的构建方法上方添加:
CardController cardController = new CardController();
然后在您的 TinderSwapCard() 小部件中添加控制器:
TinderSwapCard(
cardController: cardController,
)
最后将其添加到您的按钮中:
RawMaterialButton(
fillColor: Colors.white,
child: Icon(Icons.delete, size: 50.0,color: Colors.red,),
shape: CircleBorder(),
padding: const EdgeInsets.all(8.0),
onPressed: (){
cardController.triggerLeft();
},
),
RawMaterialButton(
fillColor: Colors.white,
child: Icon(Icons.thumb_up,size: 50.0,color: Colors.green,),
shape: CircleBorder(),
padding: const EdgeInsets.all(8.0),
onPressed: (){
cardController.triggerRight();
},
),
所以我使用的是 TinderSwapCard,swipeCompleteCallback 运行良好,我只想添加 2 个按钮,通过按下按钮获得相同的滑动动画。
我该怎么做?
提前致谢。
a picture of the app
这里是使用的代码:
new TinderSwapCard(
orientation: AmassOrientation.TOP,
swipeUp: false,
swipeDown: false,
totalNum: list.length,
stackNum: 4,
maxHeight: MediaQuery.of(context).size.width*1.7,
maxWidth: MediaQuery.of(context).size.width*0.9,
minHeight: MediaQuery.of(context).size.width*0.9,
minWidth: MediaQuery.of(context).size.width*0.6,
cardBuilder: (context,index)=>Card(
color: Colors.black,
child: Column(
children: [
new Image.asset(
list[index],
fit: BoxFit.fill,
),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
RawMaterialButton(
fillColor: Colors.white,
child: FaIcon(FontAwesomeIcons.times,size: 50.0,color: Colors.red,),
shape: CircleBorder(),
padding: const EdgeInsets.all(8.0),
onPressed: (){
//what to do here ?
},),
RawMaterialButton(
fillColor: Colors.white,
child: FaIcon(FontAwesomeIcons.solidHeart,size: 50.0,color: Colors.green,),
shape: CircleBorder(),
padding: const EdgeInsets.all(8.0),
onPressed: (){
//what to do here ?
},),
],
),
],
),
),
swipeCompleteCallback: (CardSwipeOrientation orientation,int index){
if (orientation == CardSwipeOrientation.LEFT){
print("left");
}
if (orientation == CardSwipeOrientation.RIGHT){
print("Right" );
}
}
);
在您的构建方法上方添加:
CardController cardController = new CardController();
然后在您的 TinderSwapCard() 小部件中添加控制器:
TinderSwapCard(
cardController: cardController,
)
最后将其添加到您的按钮中:
RawMaterialButton(
fillColor: Colors.white,
child: Icon(Icons.delete, size: 50.0,color: Colors.red,),
shape: CircleBorder(),
padding: const EdgeInsets.all(8.0),
onPressed: (){
cardController.triggerLeft();
},
),
RawMaterialButton(
fillColor: Colors.white,
child: Icon(Icons.thumb_up,size: 50.0,color: Colors.green,),
shape: CircleBorder(),
padding: const EdgeInsets.all(8.0),
onPressed: (){
cardController.triggerRight();
},
),