mirror of
https://github.com/flutter/flutter.git
synced 2025-06-03 00:51:18 +00:00

This PR is to create an ["uncontained" Carousel](https://m3.material.io/components/carousel/specs#477de3a1-c9df-4742-baf3-bcd5eeb3764c). https://github.com/flutter/flutter/assets/36861262/947e6b2c-219f-4c8b-aba1-4a1a010221a7 The rest of the layouts can be achieved by using `Carousel.weighted`: https://github.com/QuncCccccc/flutter/pull/2. The branch of `Caorusel.weighted` PR is based on this PR for relatively easer review. Will request reviews for the part 2 PR once this one is successfully merged in master.
78 lines
1.9 KiB
Dart
78 lines
1.9 KiB
Dart
// Copyright 2014 The Flutter Authors. All rights reserved.
|
|
// Use of this source code is governed by a BSD-style license that can be
|
|
// found in the LICENSE file.
|
|
|
|
import 'package:flutter/material.dart';
|
|
|
|
/// Flutter code sample for [Carousel].
|
|
|
|
void main() => runApp(const CarouselExampleApp());
|
|
|
|
class CarouselExampleApp extends StatelessWidget {
|
|
const CarouselExampleApp({super.key});
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return MaterialApp(
|
|
debugShowCheckedModeBanner: false,
|
|
home: Scaffold(
|
|
appBar: AppBar(
|
|
title: const Text('Carousel Sample'),
|
|
),
|
|
body: const CarouselExample(),
|
|
),
|
|
);
|
|
}
|
|
}
|
|
|
|
class CarouselExample extends StatefulWidget {
|
|
const CarouselExample({super.key});
|
|
|
|
@override
|
|
State<CarouselExample> createState() => _CarouselExampleState();
|
|
}
|
|
|
|
class _CarouselExampleState extends State<CarouselExample> {
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return Center(
|
|
child: ConstrainedBox(
|
|
constraints: const BoxConstraints(maxHeight: 200),
|
|
child: CarouselView(
|
|
itemExtent: 330,
|
|
shrinkExtent: 200,
|
|
children: List<Widget>.generate(20, (int index) {
|
|
return UncontainedLayoutCard(index: index, label: 'Item $index');
|
|
}),
|
|
),
|
|
),
|
|
);
|
|
}
|
|
}
|
|
|
|
class UncontainedLayoutCard extends StatelessWidget {
|
|
const UncontainedLayoutCard({
|
|
super.key,
|
|
required this.index,
|
|
required this.label,
|
|
});
|
|
|
|
final int index;
|
|
final String label;
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return ColoredBox(
|
|
color: Colors.primaries[index % Colors.primaries.length].withOpacity(0.5),
|
|
child: Center(
|
|
child: Text(
|
|
label,
|
|
style: const TextStyle(color: Colors.white, fontSize: 20),
|
|
overflow: TextOverflow.clip,
|
|
softWrap: false,
|
|
),
|
|
),
|
|
);
|
|
}
|
|
}
|