Exercise : Mapping Data to Widgets

import 'package:flutter/material.dart';

import './country_by_capital_city.dart';

 

void main() {

  runApp(const MyApp());

}

 

class MyApp extends StatelessWidget {

  const MyApp({Key? key}) : super(key: key);

 

  @override

  Widget build(BuildContext context) {

    return MaterialApp(

      title: 'mapping_data_to_widgets_exercice',

      theme: ThemeData(

        primarySwatch: Colors.blue,

      ),

      home: const MyHomePage(),

    );

  }

}

 

class MyHomePage extends StatefulWidget {

  const MyHomePage({Key? key}) : super(key: key);

 

  @override

  _MyHomePageState createState() => _MyHomePageState();

}

 

class _MyHomePageState extends State<MyHomePage> {

  @override

  Widget build(BuildContext context) {

    return Scaffold(

      appBar: AppBar(

        title: const Text("Country By Capital City"),

      ),

      body: Container(

        margin: const EdgeInsets.all(8),

        child: ListView.builder(

          itemBuilder: (ctx, index) {

            return ListTile(

              leading: CircleAvatar(

                child: Text(data[index]["country"].toString().substring(0, 2)),

              ),

              title: Text(data[index]["country"].toString()),

              subtitle: Text(data[index]["city"].toString()),

              trailing: Text((index + 1).toString()),

            );

          },

          itemCount: data.length,

        ),

      ),

    );

  }

}