Example Flutter Tutorial

main.dart

//----------
//main.dart
//----------
// import 'dart:html';
import 'package:flutter/material.dart';
// import 'package:update_widget/quote_card.dart';
// import 'quote.dart';

void main() => runApp(MaterialApp(
      home: QuoatList(),
    ));

class QuoatList extends StatefulWidget {
  @override
  _QuoatListState createState() => _QuoatListState();
}

class _QuoatListState extends State<QuoatList> {
  List<Quote> quotes = [
    Quote(author: 'Sara Th', text: 'please say someting about me'),
    Quote(author: 'Saba Th', text: 'we are going to the moon'),
    Quote(author: 'Bhu Th', text: 'Go Go Go!'),
    Quote(author: 'Yuki Th', text: 'See you sooooooon'),
  ];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.grey[300],
      appBar: AppBar(
        title: const Text('The Custom Class'),
        centerTitle: true,
        backgroundColor: Colors.redAccent,
      ),
      body: Column(
        // children: quotes.map((q) => Text('${q.text} = ${q.author}')).toList(),
        children: quotes
            .map((q) => QuoteCard(
                quote: q,
                delete: () {
                  //passing function as parameter for callback when the QuoteCard instant was interact
                  setState(() {
                    quotes.remove(q);
                  });
                }))
            .toList(),
      ),
    );
  }
}


//---------------------
//quote_card.dart
//---------------------
// import 'package:flutter/cupertino.dart';
// import 'package:flutter/material.dart';
// import 'package:update_widget/quote.dart';

class QuoteCard extends StatelessWidget {
  final Quote quote;
  final Function() delete;
  const QuoteCard({required this.quote, required this.delete});

  @override
  Widget build(BuildContext context) {
    return Card(
      margin: const EdgeInsets.fromLTRB(16.0, 16.0, 16.0, 0),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.stretch,
        children: <Widget>[
          Text(
            quote.text,
            style: TextStyle(fontSize: 18.0, color: Colors.grey[600]),
          ),
          const SizedBox(
            height: 6.0,
          ),
          Text(
            quote.author,
            style: TextStyle(fontSize: 14.0, color: Colors.grey[800]),
          ),
          const SizedBox(
            height: 8.0,
          ),
          TextButton.icon(
              onPressed: () =>
                  delete(), //required syntax like '() => function ()'
              icon: const Icon(
                Icons.delete,
                size: 16.0,
              ),
              label: const Text('delete quote')),
        ],
      ),
    );
  }
}


//---------------------
//quite.dart
//---------------------
class Quote {
  String text;
  String author;

  Quote({this.text = '', this.author = ''});
}