在按下按钮时创建新的小部件答案

【问题标题】：Create new Widget on Button pressed在按下按钮时创建新的小部件
【发布时间】：2018-12-09 22:08:49
【问题描述】：

如何在按钮点击时创建新的小部件？例如，我有这样的代码：

child: MaterialButton(

    child: Padding(
        padding: const EdgeInsets.symmetric(
                vertical: 10.0, horizontal: 42.0),
            child: Text(
                "LOGIN",
                style: TextStyle(
                    color: Colors.white,
                    fontSize: 25.0,
                    fontFamily: "WorkSansBold"),
            ),
    ),
    onPressed: () {
        var url = 'https://jsonplaceholder.typicode.com/users';
        http.get(url).then((response) {
            print("Response status: ${response.statusCode}");
            print("Response body: ${response.body}");
            Navigator.push(
                context,
                MaterialPageRoute(
                    builder: (context) => new SecondScreen()),
            );
        });
    },
)

在这里，我想用来自 JSON 的数据创建一个新屏幕。为了简单起见，假设我需要为所有 name 和来自 JSON 响应的数字创建新的 Text() 小部件。电话簿之类的东西。

这个例子中SecondScreen 小部件应该包含什么？

【问题讨论】：

标签： dart flutter

【解决方案1】：

您可以拥有一个ListView，它为每个值构建一个Text 小部件。

class SecondScreen extends StatelessWidget{

    var values;

    SecondScreen(this.values);

    Widget build(buildcontext context){
        return ListView.builder(
            itemBuilder: (context, index){
                if(index < values.length)
                {
                    return Card(child: Text(values[index]));
                }
            }
        );
    }
}

【讨论】：

【解决方案2】：

类似的东西

class SecondScreen extends StatelessWidget {
   final String body;
   SecondScreen(this.body);

  @override
  Widget build(BuildContext context) {
    List<dynamic> myList = json.decode(body);
    return Scaffold(
      appBar: AppBar(title: Text('Second Screen')),
      body:  Container(
        child: ListView(
          children: myList.map((e)=>Text(e['name'])).toList(),
        ),
      ),
    );
  }
}

用法：

Navigator.push(context,MaterialPageRoute(
                      builder: (context) => new SecondScreen(response.body)),
                );

【讨论】：