congcoding

1. List.generate란?

List<E>.generate(int length, E generator(int index),{bool growable: true})

length의 길이만큼 0부터 index - 1까지 범위의 각 인덱스를 오름차순으로 호출하여 만든 값으로 리스트를 생성합니다.

growable의 기본값은 true이고, false인 경우 생성된 리스트의 길이는 고정됩니다.

List<int>.generate(3, (int index) => index * index);

예를 들어 위와 같은 경우 length가 3이므로 0부터 2까지 오름차순으로 호출하면서 index * index의 값으로 리스트를 생성합니다.

따라서 결과는 [0, 1, 4]입니다.

2. 예제 결과

3. 예제 코드

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.yellow,
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatelessWidget {
  final List<String> items = ['1', '2', '3', '4', '5', '6', '7', '8', '9', '*', '0', '#'];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('전화 자판 만들기'),
      ),
      body: GridView.count(
        crossAxisCount: 3,  // 열 개수
        children: List<Widget>.generate(items.length, (idx) {
          return Container(
            color: Colors.amber,
            padding: const EdgeInsets.all(40),
            margin: const EdgeInsets.all(8),
            child: Text(
                items[idx],
                style: TextStyle(fontSize: 40),
                textAlign: TextAlign.center,
            ),
          );
        }).toList()
      )
    );
  }
}

List.generate를 사용하지 않으면 body의 children에서 Container를 12번 써야 하지만,

Container를 List.generate를 통해 생성하고,

Text 값을 items에 미리 넣어놓고 해당 값을 idx로 가져오면 코드 길이를 1/12로 줄일 수 있습니다.

4. 참고한 사이트