Анимация эффекта прокрутки Flutter Row
Aug 26 2020
В моем текущем проекте есть прокручиваемая строка, которая работает нормально, но я не могу найти способ сделать какую-то статическую прокрутку, когда при прокрутке к элементу элемент автоматически центрируется.
Вот что у меня сейчас есть:
Когда карточки прокручиваются, они остаются в том положении, в котором они заканчиваются:
Эффект, которого я хочу достичь, - это выравнивание карты по центру при прокрутке к следующей карте.
Есть ли виджет, который действительно так работает?
Ответы
1 meditat Aug 26 2020 at 14:35
Попробуй это,
import 'package:flutter/material.dart';
final Color darkBlue = Color.fromARGB(255, 18, 32, 47);
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
final List<String> images = ["Me", "You", "Foo", "Baa"];
final PageController controller = PageController(viewportFraction:0.8);
@override
Widget build(BuildContext context) {
return MaterialApp(
theme: ThemeData.dark().copyWith(scaffoldBackgroundColor: darkBlue),
debugShowCheckedModeBanner: false,
home: Scaffold(
body: PageView.builder(
controller: controller,
itemCount: images.length,
itemBuilder: (context,index){
return Container(
margin: EdgeInsets.all(16),
child: Center(child:Text(images[index])),
color: Colors.grey.shade200
);
}
),
),
);
}
}
class MyWidget extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Text('Hello, World!', style: Theme.of(context).textTheme.headline4);
}
}
JoséLuna Aug 26 2020 at 15:06
Решение было простым:
Padding(
padding: const EdgeInsets.symmetric(vertical: 80),
child: Container(
child: PageView(
controller: controller,
scrollDirection: Axis.horizontal,
pageSnapping: true,
physics: BouncingScrollPhysics(),
children: [CardMovie(), CardMovie(), CardMovie()],
),
),
)
используя виджет PageView и задавая верхнюю часть заполнения, потому что высота виджета была во весь экран.