Question

我试图让AnimatedSwitcher在ReorderableListView中工作，它在正常的ListView中工作。我以为它与按键有关，但是我现在确定。

Flutter 1.17.0•频道Beta•https://github.com/flutter/flutter.git 框架•版本e6b34c2b5c（7天前）•2020-05-02 11:39:18 -0700 引擎•版本540786dd51 工具•Dart 2.8.1

import 'package:flutter/material.dart';
import 'package:provider/provider.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  @override
  Widget build(BuildContext context) {
    return ChangeNotifierProvider(
      create: (context) => ChangeNumber(),
      child: MaterialApp(
        title: 'Flutter Demo',
        home: Scaffold(
          body: SafeArea(
            child: Consumer<ChangeNumber>(
              builder: (context, value, child) {
                return Column(
                  children: <Widget>[
                    Container(
                      height: 100,
                      child: ReorderableListView(
                        onReorder: (oldIndex, newIndex) {},
                        children: <Widget>[
                          AnimatedSwitcher(
                            key: ValueKey(value.i),
                            duration: Duration(seconds: 1),
                            child: NumberTile(
                              number: value.i,
                              key: ValueKey(value.i),
                            ),
                          ),
                        ],
                      ),
                    ),
                    RaisedButton(
                      child: Text('Increase'),
                      onPressed: () => value.i = value.i + 1,
                    )
                  ],
                );
              },
            ),
          ),
        ),
      ),
    );
  }
}

class NumberTile extends StatelessWidget {
  final int number;

  NumberTile({this.number, key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return ListTile(
      title: Text('$number'),
    );
  }
}

class ChangeNumber extends ChangeNotifier {
  int _i = 0;

  get i => _i;

  set i(int value) {
    _i = value;
    notifyListeners();
  }
}

Answer 1

AnimatedSwitcher在Text小部件上不会显示效果，因为您的Text位于ListTile内部的NumberTile内部。您必须将要为其设置动画的直接窗口小部件放在AnimatedSwitcher中。选中此example

AnimatedSwitcher在ReorderableListView中不起作用

1 个答案: