Ryan_llistView 실습

ryan_list.dart

import 'package:flutter/material.dart';

var ryanName = ['리틀 라이언', '반짝 라이언', '하트하트 라이언'
  , '춘식이와의 만남', '룸메는 춘식이', '좋아요'];

var imgList = [ 'image/ryan1.jpg',
  'image/ryan2.png',
  'image/ryan3.jpg',
  'image/ryan4.png',
  'image/ryan5.png',
  'image/ryan6.jpg',
];

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

  @override
  State<ExRyan> createState() => _ExRyanState();
}

class _ExRyanState extends State<ExRyan> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      // 아이템 추가 버튼 만들기
      floatingActionButton: 
      FloatingActionButton(onPressed: (){

        // 버튼 클릭시 아이템 추가 --> 아이템을 itemBuilder 에서 그려주고 있는 중
        // --> imgList, ryanName 이라는 List를 바탕으로 아이템을 그려주는 중
        // --> imgList, ryanName 에 값이 추가 되면 그려주지 않을까?

        setState(() {
          imgList.add('image/ryan1.jpg');
          ryanName.add('리틀 라이언');
        });

      },child: Icon(Icons.add),),

      body: SafeArea(child:
          // 이벤트(onpressed, ontap 을 강제로 부여하는(하위위젯) 위젯 - GestureDetector)
      ListView.builder(
          itemCount: imgList.length,
          itemBuilder: (_, index) {
            return Card(
              child: Padding(
                padding: const EdgeInsets.all(16.0),
                child: Row(
                  children: [
                    Expanded(child: Image.asset(imgList[index])),
                    Expanded(
                      child: Column(
                        children: [
                          Text(ryanName[index]),
                          Text('${index+1}번째 라이언'),
                        ],
                      ),
                    ),
                  ],
                ),
              ),
            );
          })),
    );
  }
}