mirror of
https://github.com/Iconica-Development/flutter_carousel.git
synced 2025-05-18 20:13:43 +02:00
102 lines
3.3 KiB
Dart
102 lines
3.3 KiB
Dart
|
import 'package:carousel/carousel.dart';
|
||
|
import 'package:carousel/models/card_transform.dart';
|
||
|
import 'package:carousel_example/pokemon.dart';
|
||
|
import 'package:carousel_example/pokemon_card.dart';
|
||
|
import 'package:flutter/material.dart';
|
||
|
|
||
|
import 'dart:math' as math;
|
||
|
|
||
|
void main() {
|
||
|
runApp(const CarouselExampleApp());
|
||
|
}
|
||
|
|
||
|
class CarouselExampleApp extends StatefulWidget {
|
||
|
const CarouselExampleApp({Key? key}) : super(key: key);
|
||
|
|
||
|
@override
|
||
|
State<CarouselExampleApp> createState() => _CarouselExampleAppState();
|
||
|
}
|
||
|
|
||
|
class _CarouselExampleAppState extends State<CarouselExampleApp> {
|
||
|
Pokemon? selected;
|
||
|
|
||
|
final List<Pokemon> pokemons = [
|
||
|
Pokemon(name: 'Bulbasaur', nr: 1, types: ['grass', 'poison']),
|
||
|
Pokemon(name: 'Charmander', nr: 4, types: ['fire']),
|
||
|
Pokemon(name: 'Squirtle', nr: 7, types: ['water']),
|
||
|
Pokemon(name: 'Caterpie', nr: 10, types: ['bug']),
|
||
|
Pokemon(name: 'Pidgey', nr: 16, types: ['normal', 'flying']),
|
||
|
Pokemon(name: 'Pikachu', nr: 25, types: ['electric']),
|
||
|
Pokemon(name: 'Machop', nr: 66, types: ['fighting']),
|
||
|
Pokemon(name: 'Geodude', nr: 74, types: ['rock', 'ground']),
|
||
|
];
|
||
|
|
||
|
Widget _buildCard(BuildContext context, int index) {
|
||
|
return PokemonCard(
|
||
|
pokemon: pokemons[index % pokemons.length],
|
||
|
);
|
||
|
}
|
||
|
|
||
|
void _onClick(int index) {
|
||
|
setState(() {
|
||
|
selected = pokemons[index % pokemons.length];
|
||
|
});
|
||
|
}
|
||
|
|
||
|
@override
|
||
|
Widget build(BuildContext context) {
|
||
|
return MaterialApp(
|
||
|
home: Scaffold(
|
||
|
body: Stack(
|
||
|
alignment: Alignment.bottomCenter,
|
||
|
children: [
|
||
|
SafeArea(
|
||
|
child: ListView(
|
||
|
children: [
|
||
|
const SizedBox(height: 50),
|
||
|
Carousel(
|
||
|
pageViewHeight: 220,
|
||
|
selectableCardId: 4,
|
||
|
onCardClick: _onClick,
|
||
|
transforms: [
|
||
|
CardTransform(
|
||
|
x: 220, y: -85, angle: -math.pi / 12, scale: 0.3),
|
||
|
CardTransform(
|
||
|
x: 230, y: -80, angle: math.pi / 12, scale: 0.5),
|
||
|
CardTransform(
|
||
|
x: 200, y: -75, angle: -math.pi / 12, scale: 0.6),
|
||
|
CardTransform(
|
||
|
x: 110, y: -60, angle: math.pi / 12, scale: 0.7),
|
||
|
CardTransform(x: 0, y: 0, angle: 0, scale: 1),
|
||
|
CardTransform(
|
||
|
x: -270, y: 70, angle: -math.pi / 50, scale: 1),
|
||
|
],
|
||
|
builder: _buildCard,
|
||
|
),
|
||
|
Carousel(
|
||
|
selectableCardId: 1,
|
||
|
onCardClick: _onClick,
|
||
|
alignment: Alignment.center,
|
||
|
transforms: [
|
||
|
CardTransform(x: 0, y: 0, angle: 0, scale: 0.5),
|
||
|
CardTransform(x: 0, y: 0, angle: 0, scale: 1),
|
||
|
CardTransform(
|
||
|
x: 300, y: 0, angle: math.pi / 20, scale: 1),
|
||
|
],
|
||
|
builder: _buildCard,
|
||
|
),
|
||
|
],
|
||
|
),
|
||
|
),
|
||
|
if (selected != null)
|
||
|
Padding(
|
||
|
padding: const EdgeInsets.only(bottom: 10),
|
||
|
child: Text('Clicked: ${selected!.name}'),
|
||
|
),
|
||
|
],
|
||
|
),
|
||
|
),
|
||
|
);
|
||
|
}
|
||
|
}
|