tajihiro
tajihiro

Reputation: 2443

How to show json data from server in CupertinoPicker

I have similar question following one.

How to put JSON data from server with GridView --Flutter

I gotta need to show JSON data in CupertinoPicker. However I don't know how to manage to put data on that widget.

I would like to keep JSON data when the page initialized first. I would like to know how to keep and convert Future data into Picker Widget.

When a button is pressed. Following method is called. I would like to have seasons (Future) to show on CupertinoPicker.

cupertinoModalPopup(){
    showModalBottomSheet(
      context: context,
      builder: (BuildContext context){
        return CupertinoPicker(
          onSelectedItemChanged: (int index){
            setState(() {
              _pickerSelectedIndex = index;
            });
          },
          itemExtent: 32.0,
          children: seasons.map((season) => Text(season)).toList(),
          scrollController: FixedExtentScrollController(initialItem: _pickerSelectedIndex)
        );
      });
[
  {"id":1,"season_end":"1999/01","season_name":"First","season_start":"1999/08"}, 
  {"id":2,"season_end":"1999/07","season_name":"Second","season_start":"1999/02"}, 
  {"id":3,"season_end":"2000/01","season_name":"Third","season_start":"1999/08"}, 
  {"id":4,"season_end":"2000/07","season_name":"Forth","season_start":"2000/02"}
]

Please give me some advice.

Thanks.

Upvotes: 0

Views: 357

Answers (1)

tajihiro
tajihiro

Reputation: 2443

Finally, I composed widgets with following code.

cupertinoModalPopup(){
    showModalBottomSheet(
        context: context,
        builder: (BuildContext context){
          return FutureBuilder(
            future: seasons,
            builder: (BuildContext context, AsyncSnapshot <List<Season>> snapshot){
              if(snapshot.connectionState == ConnectionState.done) {
                if (snapshot.hasError) {
                  return Text('${snapshot.error}');
                }
                if (!snapshot.hasData) {
                  return Text('No Data Found');
                }
                return CupertinoPicker(
                    onSelectedItemChanged: (int index){
                      setState(() {
                        _seasonSelectedIndex = index;
                        _seasonSelected = snapshot.data[index].season_name;
                      });
                    },
                    itemExtent: 32.0,
                    children: snapshot.data.map((season) => Text(season.season_name)).toList(),
                    scrollController: FixedExtentScrollController(initialItem: _seasonSelectedIndex)
                );
              }else{
                return const CircularProgressIndicator();
              }
            },
          );
        },
    );
}

It worked!!! Thanks.

Upvotes: 1

Related Questions