【问题标题】:Flutter and Distance Matrix API parsing json颤振和距离矩阵 API 解析 json
【发布时间】:2019-04-28 07:57:50
【问题描述】:

我目前正在构建一个颤振应用程序,我想在其中计算一些对象之间的距离,并使用 Google 距离矩阵 API 来执行此操作。我在使用 Dart 解析 json 时遇到问题。我最终想要的只是一个与 json 结果的距离列表,以便我可以索引它们并将它们应用于我的应用程序中的数据。

json 结果如下所示:

{
   "destination_addresses" : [
      "destination address",
      "destination address"
   ],
   "origin_addresses" : [ "Origin addresses here" ],
   "rows" : [
      {
         "elements" : [
            {
               "distance" : {
                  "text" : "4.3 mi",
                  "value" : 6998
               },
               "duration" : {
                  "text" : "14 mins",
                  "value" : 848
               },
               "status" : "OK"
            },
            {
               "distance" : {
                  "text" : "6.7 mi",
                  "value" : 10728
               },
               "duration" : {
                  "text" : "22 mins",
                  "value" : 1327
               },
               "status" : "OK"
            }
         ]
      }
   ],
   "status" : "OK"
}

我最终希望得到一个列表(在 dart 中),它只是元素数组中距离“文本”值的列表,但我无法让它返回。我已经尝试创建一个类并将 json 结果映射到这个,但没有成功,因为我不擅长解析 json,所以任何关于如何结束这个列表的建议都将不胜感激!

我已经尝试过这段代码来解析 json,但我真的很难让它工作然后应用它:

class Topleveladd {
  final String elements;

  Topleveladd({this.elements});

  factory Topleveladd.fromJson(Map<String, dynamic> parsedJson) {
    return Topleveladd(elements: parsedJson['rows']);
  }
}

class Elements {
  List<Distance> distanceslist;

  Elements({this.distanceslist});

  factory Elements.fromJson(Map<String, dynamic> parsedJson) {
    var list = parsedJson['elements'] as List;
    print(list.runtimeType); //returns List<dynamic>
    List<Distance> distancesList =
        list.map((i) => Distance.fromJson(i)).toList();
    return Elements(distanceslist: distancesList);
  }
}

class Distance {
  String text;
  Distance({this.text});

  factory Distance.fromJson(Map<String, dynamic> parsedJson) {
    return new Distance(
      text: parsedJson['distance'],
    );
  }
}

【问题讨论】:

  • 我推荐this article,它介绍了如何在 Flutter 中解析复杂的 JSON。
  • 这正是我一直用来尝试解决这个问题的文章,但是我很挣扎,我的代码已添加到上面。谢谢!
  • 是的,即使有文章也可能很棘手。我明天试试看:)
  • 非常感谢,这将是非常棒的帮助!

标签: json dart flutter


【解决方案1】:

好的,这就是我访问您作为资产提供的 JSON 的工作,因此您可能必须更改 loadData 方法以满足您的需求。

DistanceMatrix 类:

import 'dart:convert';
import 'dart:async' show Future;
import 'package:flutter/services.dart' show rootBundle;

class DistanceMatrix {
  final List<String> destinations;
  final List<String> origins;
  final List<Element> elements;
  final String status;

  DistanceMatrix({this.destinations, this.origins, this.elements, this.status});

  factory DistanceMatrix.fromJson(Map<String, dynamic> json) {
    var destinationsJson = json['destination_addresses'];
    var originsJson = json['origin_addresses'];
    var rowsJson = json['rows'][0]['elements'] as List;

    return DistanceMatrix(
        destinations: destinationsJson.cast<String>(),
        origins: originsJson.cast<String>(),
        elements: rowsJson.map((i) => new Element.fromJson(i)).toList(),
        status: json['status']);
  }

  static Future<DistanceMatrix> loadData() async {
    DistanceMatrix distanceMatrix;
    try{
          String jsonData = await rootBundle.loadString('assets/data.json');
    distanceMatrix = new DistanceMatrix.fromJson(json.decode(jsonData));
    } catch (e){
      print(e);
    }
    return distanceMatrix;
  }
}

class Element {
  final Distance distance;
  final Duration duration;
  final String status;

  Element({this.distance, this.duration, this.status});

  factory Element.fromJson(Map<String, dynamic> json) {
    return Element(
        distance: new Distance.fromJson(json['distance']),
        duration: new Duration.fromJson(json['duration']),
        status: json['status']);
  }
}

class Distance {
  final String text;
  final int value;

  Distance({this.text, this.value});

  factory Distance.fromJson(Map<String, dynamic> json) {
    return new Distance(text: json['text'], value: json['value']);
  }
}

class Duration {
  final String text;
  final int value;

  Duration({this.text, this.value});

  factory Duration.fromJson(Map<String, dynamic> json) {
    return new Duration(text: json['text'], value: json['value']);
  }
}

Main.dart 使用ListView.builder 将距离文本和值显示为ListTile

import 'package:flutter/material.dart';
import 'package:hello_world/distance_matrix.dart';

void main() async {
  runApp(new MyApp(
    distanceMatrix: await DistanceMatrix.loadData(),
  ));
}

class MyApp extends StatefulWidget {
  final DistanceMatrix distanceMatrix;

  @override
  _MyAppState createState() => new _MyAppState();

  MyApp({this.distanceMatrix});
}

class _MyAppState extends State<MyApp> {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        home: Scaffold(
            appBar: AppBar(
              title: Text("Home"),
            ),
            body: Material(
                child: ListView.builder(
                itemCount: widget.distanceMatrix.elements.length,
                itemBuilder: (context, index){
                  return ListTile(
                    title: Text(widget.distanceMatrix.elements[index].distance.text),
                    subtitle: Text(widget.distanceMatrix.elements[index].distance.value.toString()),
                  );
                },
              )
            )));
  }
}

图片显示你应该得到什么:

【讨论】:

  • 你是英雄,我非常感激!
  • 没问题!如果您能接受我的回答并投票,那就太好了:)
猜你喜欢
  • 2012-03-27
  • 2017-12-18
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2011-08-08
  • 1970-01-01
  • 2022-01-21
  • 2017-12-13
相关资源
最近更新 更多