How to display the data using flutter?-CodePudding

I can display while mapping the data (using flutter)

main.dart

//Im looping on it using map
List<Quote> quotes = [
Quote(
    author: 'Oscar Wilde',
    text: 'Be yourself, everyone else is already taken'),
Quote(
    author: 'Oscar Wilde',
    text: 'I have nothing to declare except my genius'),
Quote(
    author: 'Oscar Wilde',
    text: 'The truth is rarely pure and never simple'),
];

// Im using map then not display on the screen
body: Column(
      children: quotes.map((quote) => Text(quote)).toList(),
),

Thank you very much

CodePudding user response：

To add card, add do this:

@override
  Widget build(BuildContext context) {
    return Column(
      children: List<Widget>.generate(
        quotes.length,
        (index) {
          return Card(
                   shape: RoundedRectangleBorder(
                      borderRadius: BorderRadius.circular(40), // if you need this
                      side: BorderSide(
                         color: Colors.grey.withOpacity(0.2),
                         width: 1,
                      ),
                   ),
                child: Container(
                   color: Colors.white,
                   width: 200,
                   height: 200,
                   child: Text('${quotes[index].author}'),
                ),
            );
        },
      ),
    );
  }

CodePudding user response：

You can try with a list generator instead of the map. Or you use Listview builder as @Jahn mentioned

import 'package:flutter/material.dart';

const Color darkBlue = Color.fromARGB(255, 18, 32, 47);

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData.dark().copyWith(
        scaffoldBackgroundColor: darkBlue,
      ),
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        body: Center(
          child: MyWidget(),
        ),
      ),
    );
  }
}

class MyWidget extends StatelessWidget {
  List<Quote> quotes = [
    Quote(
        author: 'Oscar Wilde',
        text: 'Be yourself, everyone else is already taken'),
    Quote(
        author: 'Oscar Wilde',
        text: 'I have nothing to declare except my genius'),
    Quote(
        author: 'Oscar Wilde',
        text: 'The truth is rarely pure and never simple'),
  ];

  @override
  Widget build(BuildContext context) {
    return Column(
      children: List<Widget>.generate(
        quotes.length,
        (index) {
          return Text('${quotes[index].author}');
        },
      ),
    );
  }
}

class Quote {
  String? author;
  String? text;

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