Search code examples
androidlistflutterbuttonsetstate

I think i have done something that's setstate is not working in flutter


I am pretty new to this field so please go easy on me. I am learning flutter I have made a card in my app and give it a delete button but the button is not deleting any of the card. please help me out. here is my code.

import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'quotes.dart';
import 'quotes_list.dart';
void main() => runApp(new MaterialApp(
  home: Quotelist(),
));

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

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

class _QuotelistState extends State<Quotelist> {

  List<quotes> q = [
    quotes(text: "once upon a time", author: "Shayan Ali"),
    quotes(text: "once upon a time", author: "Sumair Ali"),
    quotes(text: "once upon a time", author: "Umair Ali")
  ];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.amber[200],
        appBar: AppBar(
        title: Text("list"),
        centerTitle: true,
        backgroundColor: Colors.amber[800],
       ),
      body: Column(
         children: q.map((e) => Quotecard(quote: e,
        delete: (){
          setState(() {
            q.remove(e);
          });
        },
        ),
        ).toList(),
      ),
    );
  }
}

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

class Quotecard extends StatelessWidget {

  final quotes? quote;
  final Function? delete;
  Quotecard({ this.quote, this.delete });

  @override
  Widget build(BuildContext context) {
     return Card(
      margin: EdgeInsets.fromLTRB(10.0, 10.0, 10.0, 0),
      color: Colors.amber[900],
      child: Padding(
        padding: const EdgeInsets.all(12.0),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.stretch,
          children: [
            Text(
              quote?.text ?? "",
              style: TextStyle(
              fontSize: 18,
               color: Colors.amber[200]
              ),
            ),
            SizedBox(height: 3,),
            Text(
              quote?.author ?? "",
              style: TextStyle(
                fontSize: 18,
                color: Colors.amber[200]
              ),
            ),
            SizedBox(height: 8,),
            TextButton.icon(onPressed: (){
              delete;
            }, 
             icon: Icon(Icons.delete), 
            label: Text("delete quote"))
          ],
        ),
      ),
    );
  }
}

class quotes {
  String? text;
  String? author;

  quotes({this.text,this.author});
}

what I think this condition is not working properly

body: Column(
         children: q.map((e) => Quotecard(quote: e,
        delete: (){
          setState(() {
            q.remove(e);
          });

please guys help me out from this problem I tried my best but but still stuck in this problem from 3 days.


Solution

  • Two things I noticed are missing () from delete in code, use delete() instead

    TextButton.icon(onPressed: (){
                  delete;
                },
    

    and

    setState(() {
                q.remove(e);
              });
    

    Instead use this

    q.remove(e);
    setState(() {});
    

    in callback