Flutter Row 스크롤 효과 애니메이션

Question

내 현재 프로젝트에는 잘 작동하는 스크롤 가능한 행이 있지만 항목으로 스크롤하면 항목이 자동으로 중앙에 배치되는 일종의 정적 스크롤을 만드는 방법을 찾을 수 없습니다.

이것이 내가 현재 가지고있는 것입니다.

카드를 스크롤하면 스크롤이 끝날 때 해당 위치에 유지됩니다.

내가 달성하고 싶은 효과는 다음 카드로 스크롤 할 때 카드가 중앙에 정렬되는 것입니다.

실제로 그렇게 작동하는 위젯이 있습니까?

Answer 1

이 시도,

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);
} 
}

Answer 2

해결책은 간단했습니다.

 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 위젯을 사용하고 위젯의 높이가 전체 화면이기 때문에 패딩 상단을 제공합니다.