Flutter http api get json key-CodePudding

I have json data like this in one variable, How can I use the data here one by one.

I want use like this

Start : 07.00 - End : 22.00

 Padding(
              padding: const EdgeInsets.only(left: 6, top:2,right: 5,bottom:5),
              child: Align(
                alignment: Alignment.centerLeft,
                child: Container(
                  child: Text(widget.company.worktime.toString(),style: TextStyle(fontSize: 16),),

                ),
              ),

            ),

Result;

[{"start":"07:00","end":"22:00","close":0},
{"start":"07:00","end":"22:00","close":0},
{"start":"07:00","end":"22:00","close":0},
{"start":"07:00","end":"22:00","close":0},
{"start":"07:00","end":"22:00","close":0},
{"start":"07:00","end":"22:00","close":0},
{"start":"07:00","end":"22:00","close":0}]

CodePudding user response：

Create Worktime model/data class

class Worktime {
  String? start;
  String? end;
  int? close;

  Worktime({this.start, this.end, this.close});

  Worktime.fromJson(Map<String, dynamic> json) {
    start = json['start'];
    end = json['end'];
    close = json['close'];
  }

  Map<String, dynamic> toJson() {
    final Map<String, dynamic> data = {};
    data['start'] = start;
    data['end'] = end;
    data['close'] = close;
    return data;
  }
}

Create a json list data parser method

List<Worktime> wrktimesFromJson(String str) =>
    List<Worktime>.from(jsonDecode(str).map((x) => Worktime.fromJson(x)));

If your list data will be large and you need better performance then try to use ListView.builder widget otherwise for simple use case/small data set use Column with SingleChildScrollView.

For ListView.builder:

class _MyHomePageState extends State<MyHomePage> {
  List<Worktime> worktimes = [];

  @override
  void initState() {
    worktimes = wrktimesFromJson(widget.company.worktime.toString());
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Padding(
        padding: const EdgeInsets.only(left: 6, top: 2, right: 5, bottom: 5),
        child: ListView.builder(
          itemCount: worktimes.length,
          itemBuilder: (BuildContext context, int index) {
            var worktime = worktimes[index];

            return Text(
              "Start : ${worktime.start} - End : ${worktime.end}",
              style: const TextStyle(fontSize: 16),
            );
          },
        ),
      ),
    );
  }
}

For Column with SingleChildScrollView:

class _MyHomePageState extends State<MyHomePage> {
  List<Worktime> worktimes = [];

  @override
  void initState() {
    worktimes = wrktimesFromJson(widget.company.worktime.toString());
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: SingleChildScrollView(
        child: Padding(
          padding: const EdgeInsets.only(left: 6, top: 2, right: 5, bottom: 5),
          child: Column(
            children: worktimes.map((worktime) {
              return Text(
                "Start : ${worktime.start} - End : ${worktime.end}",
                style: const TextStyle(fontSize: 16),
              );
            }).toList(),
          ),
        ),
      ),
    );
  }
}

CodePudding user response：

need minimal code to be sure. but if the json data is accommodated in an array you can call index data

or can use this https://api.flutter.dev/flutter/widgets/ListView-class.html