[英]Flutter dismiss item in Animated List not working correctly
我在 Flutter 應用程序中使用AnimatedList
。 它正在工作,但dismiss
-behavior 並不順利,因為在轉換時被解雇的項目會更改為上面的項目。
這是一個屏幕視頻,以便更好地理解。 專注於文本,它總是在過渡中更改為第一項的文本(“Hallo Dasist 1”)。
我遵循了本教程,您還可以在 CodePad 上對其進行測試,您可以在其中看到完全相同的行為。 這不是所需的動畫...有誰知道我該如何解決這個問題?
以下是我關閉這些項目的方式:
_removeMemoryAtIndex(int index, Month currentMonth) {
listKey.currentState!.removeItem(
index,
(_, animation) => slideIt(
context,
currentMonth,
0,
CurvedAnimation(
parent: animation,
curve: Curves.easeIn,
reverseCurve: Curves.easeOut),
),
duration: Duration(
milliseconds: 500,
),
);
Provider.of<MemoryImageProvider>(context, listen: false)
.removeMemoryAt(index: index);
}
和我的slideIt
- 動畫功能:
Widget slideIt(
BuildContext context,
Month currentMonth,
int index,
animation,
) {
Memory memory = currentMonth.memories[index];
return SlideTransition(
position: Tween<Offset>(
begin: const Offset(-1, 0),
end: Offset(0, 0),
).animate(
CurvedAnimation(
parent: animation,
curve: Curves.easeIn,
reverseCurve: Curves.easeOut,
),
),
child: Column(
children: [
MemoryTile(
memory: memory,
monthName: currentMonth.name,
onTapped: () {
_removeMemoryAtIndex(index, currentMonth);
print('tap on ${memory.description}');
},
),
SizedBox(
height: scaleWidth(20),
),
],
),
);
}
如果您需要更多信息,請告訴我們! 任何幫助表示贊賞。 我希望這可以以某種方式修復......
我們可以為此創建一個臨時模型數據,這就是它的工作方式。
import 'package:flutter/material.dart';
class MemoryTile {
int index;
String name;
MemoryTile({
required this.index,
required this.name,
});
}
final items = List.generate(
10,
(index) => MemoryTile(
index: index,
name: "name $index",
),
);
class AnimLtest extends StatefulWidget {
AnimLtest({Key? key}) : super(key: key);
@override
_AnimLtestState createState() => _AnimLtestState();
}
class _AnimLtestState extends State<AnimLtest> {
final GlobalKey<AnimatedListState> listKey = GlobalKey<AnimatedListState>();
// Remove the selected item from the list model.
_removeMemoryAtIndex(int index, MemoryTile currentMonth) {
var tempMOnth = currentMonth;
listKey.currentState!.removeItem(
index,
(_, animation) => slideIt(
context,
tempMOnth,
CurvedAnimation(
parent: animation,
curve: Curves.easeIn,
reverseCurve: Curves.easeOut),
),
duration: Duration(
milliseconds: 500,
),
);
items.removeAt(index);
// setState(() {});
}
@override
Widget build(BuildContext context) {
return AnimatedList(
key: listKey,
initialItemCount: items.length,
itemBuilder: (context, index, animation) => Container(
child: InkWell(
onTap: () {
_removeMemoryAtIndex(index, items[index]);
},
child: slideIt(
context,
items[index],
animation,
),
),
),
);
}
Widget slideIt(
BuildContext context,
MemoryTile memory,
animation,
) {
return SlideTransition(
position: Tween<Offset>(
begin: const Offset(-1, 0),
end: Offset(0, 0),
).animate(
CurvedAnimation(
parent: animation,
curve: Curves.easeIn,
reverseCurve: Curves.easeOut,
),
),
child: Row(
children: [
CircleAvatar(
child: Text(memory.index.toString()),
),
Text("Name+> ${memory.name}")
],
),
);
}
}
愚蠢的錯誤...如果您查看_removeMemoryAtIndex
方法,我總是將0
作為索引傳遞...
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.