変数宣言

List<String> list = ['Apple', 'Banana', 'Grape'];

この3つのStringを使用して動的にWidgetをしてリスト表示してみましょう。

ループ文を使用して表示する

List<Widget> buildItems(){
   List<Widget> items = [];
   
   list.forEach((String text){
     items.add(Text(text));
   });
   
   return items;
 }

メソッドを呼び出す

Column(
           children: buildItems()),
),

これだとループ文を使用するかつ、メソッド化しているのでコード量が多くなってしまいます。上記のコードを一行で完了させましょう。

mapメソッドを使用する​

Column(children: list.map((String item) => Text(item)).toList())

これだと一行で済みますね。

全コード

import 'package:flutter/material.dart';

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

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

class MyHomePage extends StatefulWidget {
 MyHomePage({Key key, this.title}) : super(key: key);

 final String title;

 @override
 _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
 List<String> list = ['Apple', 'Banana', 'Grape'];
 @override
 Widget build(BuildContext context) {
   return Scaffold(
     appBar: AppBar(
       title: Text(widget.title),
     ),
     body: Center(
       child: Column(
           children: list.map((String item) => Text(item)).toList()),
     ),
   );
 }
}

まとめ

このようにmapメソッドは様々な用途で使用できますので他にも紹介していきたいと思います。

Merry Christmas