У меня есть прокрутка нескольких карт в стопке. При прокрутке выбранная карта исчезает. Я хочу сохранить эту карту и последующую карту, чтобы все они отображались в ListView и не исчезали. Я видел, как эта функция реализована в этом хранилище, и она выглядит так:
Однако при этом отображается только одна карта за раз. Я хочу добиться перехода карт в список после удаления из стека. Поэтому я попытался реализовать это, и это сработало, но я не смог достичь стека ниже. Это код для моей реализации:
class _HomePageState extends State<HomePage> {
final _pageController = PageController(
viewportFraction: 0.3,
);
List<CreditCard> _creditCards = [];
@override
void initState() {
super.initState();
_creditCards = [
CreditCard(
decoration: BoxDecoration(
color: Colors.black.withOpacity(0.6),
),
image: 'images/visa.png',
name: 'ANDREW MITCHELL',
number: '1234',
company: Text(
'AMERICAN \nEXPRESS',
textAlign: TextAlign.right,
style: TextStyle(
color: Colors.white,
fontWeight: FontWeight.w800,
fontSize: 16,
),
),
),
CreditCard(
decoration: BoxDecoration(
color: kRed.withOpacity(0.4),
),
image: 'images/visa.png',
name: 'ANDREW MITCHELL',
number: '2434',
company: Image.asset(
'images/virgin.png',
height: 50,
),
),
CreditCard(
decoration: BoxDecoration(
gradient: LinearGradient(
begin: Alignment.centerLeft,
end: Alignment.centerRight,
colors: [kBlue, kPurple],
stops: [0.3, 0.95],
),
),
image: 'images/mastercard.png',
name: 'ANDREW MITCHELL',
number: '4567',
company: Text(
'AMERICAN \nEXPRESS',
textAlign: TextAlign.right,
style: TextStyle(
color: Colors.white,
fontWeight: FontWeight.w800,
fontSize: 16,
),
),
),
];
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: PageView.builder(
controller: _pageController,
scrollDirection: Axis.vertical,
itemCount: _creditCards.length,
itemBuilder: (context, index) => _builder(index),
),
),
);
}
_builder(int index) {
CreditCard _card = _creditCards[index];
return AnimatedBuilder(
animation: _pageController,
builder: (context, child) {
double value = 1.6;
if (_pageController.position.haveDimensions) {
value = _pageController.page - index;
if (value >= 0) {
double _lowerLimit = 0+1.55;
double _upperLimit = pi / 2;
value = (_upperLimit - (value.abs() * (_upperLimit - _lowerLimit)))
.clamp(_lowerLimit, _upperLimit);
value = _upperLimit - value;
value *= -1;
}
} else {
if (index == 0) {
value = 0;
} else if (index == 1) {
value = -1;
}
}
return Center(
child: Transform(
transform: Matrix4.identity()
..setEntry(3, 2, 0.001)
..rotateX(value),
alignment: Alignment.center,
child: child,
),
);
},
child: _card,
);
}
}
