您当前的位置: 首页 >  flutter
  • 0浏览

    0关注

    674博文

    0收益

  • 0浏览

    0点赞

    0打赏

    0留言

私信
关注
热门博文

flutter删除listView中的item

沙漠一只雕得儿得儿 发布时间:2019-07-29 17:38:53 ,浏览量:0

先看下删除效果:

实现也很简单,就是在点击事件中,从数据源中删除一个项目即可,但是需要记住更新状态。

items.removeAt(index);
setState(() {});

整体代码如下:

import 'package:flutter/material.dart';

void main() => runApp(new MyApp());

//MyApp不需要做状态处理,所以此组件继承StatelessWidget即可
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      title: 'Flutter Demo',
      theme: new ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: new MyHomePage(
          title: 'Flutter Demo Home Page',
          items: List.generate(20, (i) => "Item ${i + 1}")),
    );
  }
}

//主页需要继承自StatefulWidget
class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title, this.items}) : super(key: key);

  final String title;
  final List items;

  //必需重写createState方法
  @override
  _MyHomePageState createState() => new _MyHomePageState(items);
}

//状态类必需继承State类,注意后面需要指定为
class _MyHomePageState extends State {
  List items;

  _MyHomePageState(this.items);

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text(widget.title),
      ),
      body: ListView.builder(
        itemCount: items.length,
        itemBuilder: (context, index) {
          final item = items[index];
          return GestureDetector(
              onTap: () {
                items.removeAt(index);
                setState(() {});
              },
              child: new ListTile(
                title: new Text("$item"),
              ));
        },
      ),
    );
  }
}

 

关注
打赏
1657159701
查看更多评论
立即登录/注册

微信扫码登录

0.0511s