| // 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 'dart:ui'; |
| |
| import 'package:flutter/material.dart'; |
| |
| /// Flutter code sample for [ReorderableListView]. |
| |
| void main() => runApp(const ReorderableApp()); |
| |
| class ReorderableApp extends StatelessWidget { |
| const ReorderableApp({super.key}); |
| |
| @override |
| Widget build(BuildContext context) { |
| return MaterialApp( |
| theme: ThemeData(useMaterial3: true), |
| home: Scaffold( |
| appBar: AppBar(title: const Text('ReorderableListView Sample')), |
| body: const ReorderableExample(), |
| ), |
| ); |
| } |
| } |
| |
| class ReorderableExample extends StatefulWidget { |
| const ReorderableExample({super.key}); |
| |
| @override |
| State<ReorderableExample> createState() => _ReorderableExampleState(); |
| } |
| |
| class _ReorderableExampleState extends State<ReorderableExample> { |
| final List<int> _items = List<int>.generate(50, (int index) => index); |
| |
| @override |
| Widget build(BuildContext context) { |
| final Color oddItemColor = Colors.lime.shade100; |
| final Color evenItemColor = Colors.deepPurple.shade100; |
| |
| final List<Card> cards = <Card>[ |
| for (int index = 0; index < _items.length; index += 1) |
| Card( |
| key: Key('$index'), |
| color: _items[index].isOdd ? oddItemColor : evenItemColor, |
| child: SizedBox( |
| height: 80, |
| child: Center( |
| child: Text('Card ${_items[index]}'), |
| ), |
| ), |
| ), |
| ]; |
| |
| Widget proxyDecorator(Widget child, int index, Animation<double> animation) { |
| return AnimatedBuilder( |
| animation: animation, |
| builder: (BuildContext context, Widget? child) { |
| final double animValue = Curves.easeInOut.transform(animation.value); |
| final double elevation = lerpDouble(1, 6, animValue)!; |
| final double scale = lerpDouble(1, 1.02, animValue)!; |
| return Transform.scale( |
| scale: scale, |
| // Create a Card based on the color and the content of the dragged one |
| // and set its elevation to the animated value. |
| child: Card( |
| elevation: elevation, |
| color: cards[index].color, |
| child: cards[index].child, |
| ), |
| ); |
| }, |
| child: child, |
| ); |
| } |
| |
| return ReorderableListView( |
| padding: const EdgeInsets.symmetric(horizontal: 40), |
| proxyDecorator: proxyDecorator, |
| onReorder: (int oldIndex, int newIndex) { |
| setState(() { |
| if (oldIndex < newIndex) { |
| newIndex -= 1; |
| } |
| final int item = _items.removeAt(oldIndex); |
| _items.insert(newIndex, item); |
| }); |
| }, |
| children: cards, |
| ); |
| } |
| } |