Question

我已经在flutter应用程序中成功配置了以下列表。现在，我想通过在列表中向右或向左滑动来删除索引的项目。我找不到适合的参考资料，请指导我如何通过向左或向右滑动来从列表中删除索引的项目

ListView.separated(
            separatorBuilder: (context, index){
              return Divider();
            },
            controller: _scrollController,
            itemCount: noteItems,
            shrinkWrap: true,
            itemBuilder: (context, index) {

              return  Padding(
                padding: const EdgeInsets.fromLTRB(8.0, 7.0, 8.0, 0.0),
                child: Column(
                  children: <Widget>[

                    ListTile(
                      
                      leading:ClipRRect(
                          borderRadius: BorderRadius.circular(10),
                          child: Image.asset('images/appstore.png', width: 50, height: 50)
                      ) ,

                      title:
                      Row(children: [
                        Flexible(
                          child: firstdata[index]['title']!= null?AutoSizeText(
                            firstdata[index]['title'],
                            maxLines: 2,


                            style: TextStyle(fontWeight: FontWeight.bold),) :Text(''),
                        ),
                        Flexible(child: firstdata[index]['status'] == "0"?Image.asset('images/reddot.png',width: 10,height: 10,):Text(""))
                      ],),

                      ),


                    ),


                  ],
                ),
              );

            },

          )

Answer 1

使用Dismissible小部件，该小部件可从列表中删除项目，请尝试以下示例，以获取更多参考 https://flutter.dev/docs/cookbook/gestures/dismissible

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

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

// MyApp is a StatefulWidget. This allows updating the state of the
// widget when an item is removed.
class MyApp extends StatefulWidget {
  MyApp({Key key}) : super(key: key);

  @override
  MyAppState createState() {
    return MyAppState();
  }
}

class MyAppState extends State<MyApp> {
  final items = List<String>.generate(20, (i) => "Item ${i + 1}");

  @override
  Widget build(BuildContext context) {
    final title = 'Dismissing Items';

    return MaterialApp(
      title: title,
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: Scaffold(
        appBar: AppBar(
          title: Text(title),
        ),
        body: ListView.builder(
          itemCount: items.length,
          itemBuilder: (context, index) {
            final item = items[index];

            return Dismissible(
              // Each Dismissible must contain a Key. Keys allow Flutter to
              // uniquely identify widgets.
              key: Key(item),
              // Provide a function that tells the app
              // what to do after an item has been swiped away.
              onDismissed: (direction) {
                // Remove the item from the data source.
                setState(() {
                  items.removeAt(index);
                });

                // Then show a snackbar.
                Scaffold.of(context)
                    .showSnackBar(SnackBar(content: Text("$item dismissed")));
              },
              // Show a red background as the item is swiped away.
              background: Container(color: Colors.red),
              child: ListTile(title: Text('$item')),
            );
          },
        ),
      ),
    );
  }
}

如何关闭列表视图中的列表项

1 个答案: