I'm new to flutter I have been doing segemented bar, for time being I have done the static code and looking to do dynamic I'm facing issue while doing listing to dynamic, Below code is written.

     import 'dart:async';
    import 'dart:convert';
    import 'package:flutter/cupertino.dart';
    import 'package:flutter/material.dart';
    import 'package:flutter/services.dart';
    import 'package:westerAf/paymentPage.dart';
    import 'package:http/http.dart' as http;

    class EventsPage extends StatefulWidget {
      @override
      EventsPageState createState() => new EventsPageState();
    }

    class EventsPageState extends State<EventsPage> {
      List data = List();

      String url = 'https://d57b9120.ngrok.io/api/events/westernaf/packages';
      Future<String> makeRequest() async {
        var response = await http
            .get(Uri.encodeFull(url), headers: {"Accept": "application/json"});

        setState(() {
          var extractdata = json.decode(response.body);
          data = extractdata["result"];
        });
      }

      int theirGroupValue = 0;

      final Map<int, Widget> logoWidgets = const <int, Widget>{
        0: Text('Early Bird'),
        1: Text('General'),
        2: Text('Onsite'),
      };

      static Widget giveCenter(String ListView) {
        return Container(
          child: Text(
            "Text: $ListView",
            style: TextStyle(color: Colors.blue, fontSize: 20.0),
          ),
        );
      }

     @override
  void initState() {
   super.initState(); 
    this.makeRequest();
  }

      List<Widget> bodies = [
        new ListView.builder(
          itemCount: data == null ? 0 : data.length,
          itemBuilder: (BuildContext context, i) {
            return new ListTile(
              title: new Text(data[i]["package"]),
              subtitle: new Text(data[i]["packageName"].toString()),
            );
          },
        ),
      ];

      @override
      Widget build(BuildContext context) {
        return Scaffold(
          body: bodies[theirGroupValue],
          appBar: AppBar(
            elevation: 2.0,
            backgroundColor: Colors.white,
            centerTitle: true,
            title: Text(
              'title',
              style: TextStyle(color: Colors.black),
            ),
            bottom: PreferredSize(
              preferredSize: Size(double.infinity, 45.0),
              child: Padding(
                padding: EdgeInsets.only(top: 5.0, bottom: 10.0),
                child: Row(
                  children: <Widget>[
                    SizedBox(
                      width: 15.0,
                    ),
                    Expanded(
                      child: CupertinoSegmentedControl(
                        groupValue: theirGroupValue,
                        onValueChanged: (changeFromGroupValue) {
                          setState(() {
                            theirGroupValue = changeFromGroupValue;
                          });
                        },
                        children: logoWidgets,
                      ),
                    )
                  ],
                ),
              ),
            ),
          ),
        );
      }
    }

and below code I'm trying to do dynamic. I have the http get request data. here data has the list of information and data getting error. I don't know how to do dynamic. please help me to figure out where I went wrong.

List<Widget> bodies = [
    new ListView.builder(
      itemCount: data == null ? 0 : data.length,
      itemBuilder: (BuildContext context, i) {
        return new ListTile(
          title: new Text(data[i]["package"]),
          subtitle: new Text(data[i]["packageName"].toString() +
              ' ' +
              " price: " +
              data[i]["price"].toString()),
        );
      },
    ),
  ];

error enter image description here

here data is showing in red color, saying that only static member can access init enter image description here


Solution 1: Aman Kataria

1) Change

@override
  void initState() {
    this.makeRequest();
  }

to

@override
  void initState() {
   super.initState(); 
    this.makeRequest();
  }

Why?

initState() is a method called the first time a stateful widget is inserted in the widget-tree. super.initState() forwards to the default implementation of the State<T> base class of your widget. You can't miss it in initState method.

2) Change

List data;

to

List data = List();

Why?

To tell the framework that the list is not fixed. Otherwise it will assume that your list is null, since you have have not assigned any default value to it.

Rest of the code seems fine, it should work. Let us know in comments if it still doesn't work.