List Map 데이터 요청 ListVlew.Builder

[name27]

import 'dart:convert';
import 'dart:ffi';

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

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

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(home: Main_Page());
  }
}

class Main_Page extends StatefulWidget {
  const Main_Page({super.key});

  @override
  State<Main_Page> createState() => _Main_PageState();
}

class _Main_PageState extends State<Main_Page> {
  var dio = Dio();
  var url = "https://jsonplaceholder.typicode.com/photos?albumId=1";
  List<Map<String, dynamic>> boxList = [];
  void getData() async {
    var res = await dio.get(url);
    for (int index = 0; index < res.data.length; index++) {
      boxList.add({});
      boxList[index].addAll({
        "title": res.data[index]["title"],
        "imgUrl": res.data[index]["url"]
      });
    }
    setState(() {});
  }

  void initState() {
    super.initState();
    getData();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Colors.transparent,
        elevation: 0,
      ),
      body: ListView.builder(
        itemCount: boxList.length,
        itemBuilder: ((context, index) => Card(
              shape: RoundedRectangleBorder(
                borderRadius: BorderRadius.circular(20),
              ),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.stretch,
                children: [
                  Container(
                      width: 400,
                      height: 400,
                      decoration: BoxDecoration(
                        borderRadius:
                            BorderRadius.vertical(top: Radius.circular(20)),
                        image: DecorationImage(
                            image: NetworkImage("${boxList[index]["imgUrl"]}"),
                            fit: BoxFit.cover),
                      )),
                  Padding(
                    padding: const EdgeInsets.fromLTRB(10, 5, 0, 5),
                    child: Text(
                      "${boxList[index]["title"]}",
                      style: TextStyle(fontWeight: FontWeight.bold),
                    ),
                  )
                ],
              ),
            )),
      ),
    );
  }
}