ReorderableListView.builder 没有重新排序

Question

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

class Mainpage extends StatefulWidget {
 const Mainpage({Key? key}) : super(key: key);

  @override
   _MainpageState createState() => _MainpageState();
  }

 class _MainpageState extends State<Mainpage> {
   @override
  void initState() {
  super.initState();
SystemChrome.setPreferredOrientations(
    [DeviceOrientation.landscapeLeft, DeviceOrientation.landscapeRight]);
}

@override
Widget build(BuildContext context) {
return Container(color: Colors.white, child: const Cards());
}
}

class Cards extends StatefulWidget {
 const Cards({Key? key}) : super(key: key);

@override
State<Cards> createState() => _CardsState();
}

class _CardsState extends State<Cards> {
@override
Widget build(BuildContext context) {
List<String> list = [
  '1',
  '2',
  '3',
  '4',
  '5',
  '6',
'7',
'8',
'9',
'10',
];

 return Container(
    color: Colors.white,
    child: ReorderableListView.builder(
      padding: const EdgeInsets.fromLTRB(20, 0, 20, 0),
      scrollDirection: Axis.horizontal,
      onReorder: (int oldIndex, int newIndex) {
        setState(() {
          if (oldIndex < newIndex) {
            newIndex--;
          }
          final String item = list.removeAt(oldIndex);
          list.insert(newIndex, item);
        });
      },
      itemBuilder: (BuildContext context, int index) {
        return Card(
          key: ValueKey(index),
          child: Container(
            height: MediaQuery.of(context).size.height / 4,
            width: MediaQuery.of(context).size.width / 19,
            alignment: Alignment.bottomCenter,
            child: Text(list[index]),
          ),
        );
      },
      itemCount: list.length,
    ));
}
}

当我拖动时，列表值会得到更新。但国家并没有重建。列表值已正确重新排序。但是重新排序的列表不起作用。我尝试使用 ReorderableListView.builder 和 ReorderableListView。这是我的完整代码。我不知道我犯错的地方。这是我的完整代码。有人帮我解决这个问题。

Answer 1

改变你的 setState

setState(() {
            if (newIndex > oldIndex) {
              newIndex -= 1;
            }
              final String item = _products.removeAt(oldIndex);
              list.insert(newIndex, item);

          });

Answer 2

编辑： 查看您添加的完整代码后，您似乎在小部件的构建方法的开头声明了列表。每次重建小部件时，列表都会重置为其初始值。

将列表声明移到类的开头：

class Cards extends StatefulWidget {
  const Cards({Key? key}) : super(key: key);
  List<String> list = ['1', '2', '3', '4', '5', '6', '7'];

编辑结束

问题出在这部分代码中：

if (oldIndex > newIndex) {
  newIndex = newIndex - 1;
  final String item = list.removeAt(oldIndex);
  list.insert(newIndex, item);
}

仅当项目从右向左拖动时才会更新列表。在执行此操作时，它会将新项目索引向左移动 1。

您可能想要做的是在每次拖动时更新列表。由于您将在添加新项目之前删除旧项目，因此您希望减少 newIndex 如果拖动是从左到右。

代码应该是：

onReorder: (int oldIndex, int newIndex){
  setState(() {
    if (oldIndex < newIndex){
      newIndex--;
    }
    final String item = list.removeAt(oldIndex);
    list.insert(newIndex, item);
  });
}