如何迭代属于键值的对象数组 - Flutter [英] How can I iterate over an array of objects which belong to a key value - Flutter

查看:20
本文介绍了如何迭代属于键值的对象数组 - Flutter的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个称为锚点的数据列表,其中包含指向详细屏幕的链接.每个锚点都有分布中心,它们是一组嵌套对象.所以我能够将每个锚点的 id 解析为详细的屏幕,并且 Oid 我在遍历子节点(即锚点的分发中心)时遇到了挑战.请任何人都可以帮助我,我能够将属于锚点的所有值拉到详细屏幕,但是如何循环遍历详细屏幕中的嵌套值是问题所在.嵌套值是下面数组中的 DistributionCentres.请问谁能帮我学习更多关于颤振的知识?

I have a list of data called anchors that has a link to a detailed screen. And each anchor has distribution centers which are an array of nested objects. so I was able to parse an id of each of the anchors to a detailed screen and Oid I am having a challenge to loop through the children i.e the distribution centers of the anchors. Please can anyone help me, I was able to pull all the values belonging to an anchor to the detailed screen but how to loop through the nested values in the detailed screen is the problem. the nested values are DistributionCentres in the array below. please can anyone help me still learning more on flutter?

json 数组:

{
 "Anchors": [
    {
      "Oid": 11,
      "Name": "MAIZE ASSOCIATION OF NIGERIA",
      "Acronym": "MAAN",
      "DistributionCentres": [
        {
          "Oid": 11,
          "Name": "Logo Centre (Zone A)",
          "Address": "Private Warehouse, Ugba, Logo LGA"
        },
        {
          "Oid": 12,
          "Name": "Makurdi Centre (Zone B)",
          "Address": "Ministry of Agric, Makurdi "
        },
        {
          "Oid": 13,
          "Name": "Oturkpo Centre (Zone C)",
          "Address": "Private Warehouse, Oturkpo"
        },
        {
          "Oid": 15,
          "Name": "Borno MAAN centre",
          "Address": "Bolori Store, Flavour Mill, Behind Vita Foam, Maiduguri"
        },
        {
          "Oid": 18,
          "Name": "Bauchi Centre",
          "Address": "BASPD, Dass Road, Bauchi"
        }
      ],
      "NoOfDistributionCentres": 5
    },
    {
      "Oid": 2,
      "Name": "MAIZE GROWERS, PROCESSORS AND MARKETERS ASSOCIATION OF NIGERIA",
      "Acronym": "MAGPAMAN",
      "DistributionCentres": [
        {
          "Oid": 2,
          "Name": "Guma Centre",
          "Address": "P 32, 2nd Avenue Federal Housing Estate, N/Bank, Makurdi"
        },
        {
          "Oid": 3,
          "Name": "Logo Centre",
          "Address": "Terhemen Akema Storage Facility, Ugba, Logo LGA"
        },
        {
          "Oid": 5,
          "Name": "Oturkpo Centre",
          "Address": "Grain Store, Lower Benue Okele Project, Otukpo"
        },
        {
          "Oid": 6,
          "Name": "Gboko Centre",
          "Address": "K3 New Road, Opposite former coca cola plant. Solar Schools Street, Gboko"
        },
        {
          "Oid": 7,
          "Name": "Gwer East Centre",
          "Address": "Ahua Shardye's Warehouse, Behind Sylkan Filling Station, Ikpayongo , G/East LGA"
        },
        {
          "Oid": 8,
          "Name": "Kwande Centre",
          "Address": "KM 3, Adagi Road, Adikpo"
        },
        {
          "Oid": 9,
          "Name": "Ohimini Centre",
          "Address": "Ajoga Oglewu, Ohimini"
        },
        {
          "Oid": 10,
          "Name": "Oju Centre",
          "Address": "Behind Town Hall, Ohuhu owo, Oju LGA"
        }
      ],
      "NoOfDistributionCentres": 8
    }
  ],
}

带有详细屏幕链接的锚页面:

Anchors page with a link to the detailed screen:

import 'package:erg_app/AnchorDetails.dart';
import 'package:erg_app/Details.dart';
import 'package:erg_app/StockPage.dart';
import 'package:flutter/material.dart';
import 'package:erg_app/Widgets/nav-drawer.dart';
import 'dart:convert';
import 'package:shared_preferences/shared_preferences.dart';

void main() => runApp(MaterialApp(
      home: AnchorsPage(),
    ));

class AnchorsPage extends StatefulWidget {
  @override
  _MyHomeState createState() => _MyHomeState();
}

class _MyHomeState extends State<AnchorsPage> {
  var user;
  var userData;
  List <dynamic> anchors = [];
  @override
  void initState() {
    _getUserAnchor();
    super.initState();
  }

  _getUserAnchor() async {
    SharedPreferences localStorage = await SharedPreferences.getInstance();
    var userJson = localStorage.getString('loginRes');
    user = json.decode(userJson);
    setState(() {
      anchors = user['Anchors'];
    });
    print(anchors);
    setState(() {
      userData = anchors;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      drawer: NavDrawer(),
      appBar: AppBar(
        title: Text('Anchors Details'),
        iconTheme: IconThemeData(color: Colors.white),
        backgroundColor: Colors.green,
      ),
      body: Container(
        padding: const EdgeInsets.fromLTRB(10, 30, 10, 10),
        child: ListView(
          children: <Widget>[
            Row(
              mainAxisAlignment: MainAxisAlignment.spaceAround,
              children: <Widget>[
                Icon(Icons.card_membership,
                    size: 35, color: Colors.orange[400]),
                Text(
                  'Assigned Anchors',
                  style: TextStyle(color: Colors.orange[400], fontSize: 25),
                ),
              ],
            ),
            ListView.builder(
                shrinkWrap: true,
                itemCount: anchors.length,
                physics: NeverScrollableScrollPhysics(),
                itemBuilder: (BuildContext context, int i) {
                  return Padding(
                    padding: const EdgeInsets.all(10.0),
                    ////////////// 1st card///////////

                    child: Card(
                      elevation: 4.0,
                      color: Colors.grey[100],
                      margin: EdgeInsets.only(
                          left: 10, right: 10, top: 20, bottom: 10),
                      shape: RoundedRectangleBorder(
                          borderRadius: BorderRadius.circular(10)),
                      child: Container(
                        padding: EdgeInsets.only(left: 15, top: 20, bottom: 10),
                        width: MediaQuery.of(context).size.width,
                        child: Column(
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: <Widget>[
                            Row(
                              children: <Widget>[
                                Padding(
                                  padding: const EdgeInsets.all(8.0),
                                  child: Container(
                                      width: 50.0,
                                      height: 50.0,
                                      decoration: new BoxDecoration(
                                          shape: BoxShape.circle,
                                          image: new DecorationImage(
                                              fit: BoxFit.cover,
                                              image: AssetImage(
                                                  'assets/images/user.png')))),
                                ),
                                SizedBox(
                                  width: 20,
                                ),
                                Text(
                                  anchors[i]['Acronym'],
                                  textAlign: TextAlign.center,
                                  style: TextStyle(
                                    color: Color(0xFF9b9b9b),
                                    fontSize: 20,
                                    decoration: TextDecoration.none,
                                    fontWeight: FontWeight.normal,
                                  ),
                                ),
                              ],
                            ),
                            Container(width: 10),
                            Row(
                              children: <Widget>[
                                Padding(
                                  padding:
                                      const EdgeInsets.only(left: 10, top: 10),
                                  child: Text(
                                    'Allocated Farmers:',
                                    textAlign: TextAlign.left,
                                    style: TextStyle(
                                      color: Color(0xFF9b9b9b),
                                      fontSize: 14.0,
                                      decoration: TextDecoration.none,
                                      fontWeight: FontWeight.normal,
                                    ),
                                  ),
                                ),
                                Padding(
                                  padding:
                                      const EdgeInsets.only(left: 70, top: 12),
                                  child: Text(
                                    anchors[i]['Oid'].toString(),
                                    textAlign: TextAlign.left,
                                    style: TextStyle(
                                      color: Colors.grey[700],
                                      fontSize: 14.0,
                                      decoration: TextDecoration.none,
                                      fontWeight: FontWeight.normal,
                                    ),
                                  ),
                                ),
                              ],
                            ),
                            
                            
                            Container(
                              height: 20,
                            ),
                            Row(
                              children: <Widget>[
                                /////////// Buttons /////////////

                                Padding(
                                  padding: const EdgeInsets.all(10.0),
                                  child: FlatButton(
                                          child: Padding(
                                            padding: EdgeInsets.only(
                                                top: 8,
                                                bottom: 8,
                                                left: 10,
                                                right: 8),
                                            child: Text(
                                              'View Details',
                                              textDirection: TextDirection.ltr,
                                              style: TextStyle(
                                                color: Colors.white,
                                                fontSize: 15.0,
                                                decoration: TextDecoration.none,
                                                fontWeight: FontWeight.normal,
                                              ),
                                            ),
                                          ),
                                          color: Colors.blueGrey,
                                          shape: new RoundedRectangleBorder(
                                              borderRadius:
                                                  new BorderRadius.circular(
                                                      20.0)),
                                          onPressed: () {
                                            Navigator.push(
                                                context,
                                                new MaterialPageRoute(
                                                    builder: (context) =>
                                                        detailsPage(value : anchors)));
                                          },
                                        ),
                                ),

                                /////////// End of Buttons /////////////
                              ],
                            ),
                          ],
                        ),
                      ),
                    ),
                  );
                })
          ],
        ),
      ),
    );
  }
}

详细画面:

  import 'package:flutter/material.dart';


class detailsPage extends StatefulWidget {
  dynamic value;
  detailsPage({Key key, @required this.value}) : super(key: key);
  @override
  _detailsPageState createState() => _detailsPageState(value);
}

class _detailsPageState extends State<detailsPage> {

  dynamic value;
  _detailsPageState(this.value);
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Anchors Details Page"),
        iconTheme: IconThemeData(color: Colors.white),
        backgroundColor: Colors.green,
      ),
      // body: Center(
      //   child: Text(
      //     value[1]['Name'].toString(),
      //   ),
      // ),


       body: Column(
     children: <Widget>[
        Padding(
          padding: const EdgeInsets.all(8.0),
          child: Card(
            child: Column(
              children: <Widget>[
                Text(value[1]['Name']),
                Text(value[1]['Oid'].toString()),
                //Text(value [1]['DistributionCentres']),
              ],
            ),
          ),
        ),
    ],
   ),
    );
  }
}

推荐答案

我建议你在这种情况下使用数据类.

I recommend you to use data classes for such situations.

import 'package:flutter/material.dart';

List<Anchor> _parseAnchors(Map<String, dynamic> map) {
  final anchors = <Anchor>[];
  for (var anchorMap in map['Anchors']) {
    final anchor = Anchor.fromMap(anchorMap);
    anchors.add(anchor);
  }
  return anchors;
}

class Anchor {
  final int oId;
  final String name;
  final String acronym;
  final List<DistributionCenter> distributionCenters;

  const Anchor({
    @required this.oId,
    @required this.name,
    @required this.acronym,
    @required this.distributionCenters,
  });

  factory Anchor.fromMap(Map<String, dynamic> map) {
    final distributionCenters = <DistributionCenter>[];
    for (var distribution in map['DistributionCentres']) {
      final distributionCenter = DistributionCenter.fromMap(distribution);
      distributionCenters.add(distributionCenter);
    }

    return Anchor(
      oId: map['Oid'] as int,
      name: map['Name'] as String,
      acronym: map['Acronym'] as String,
      distributionCenters: distributionCenters,
    );
  }
}

class DistributionCenter {
  final int id;
  final String name;
  final String address;

  const DistributionCenter({
    @required this.id,
    @required this.name,
    @required this.address,
  });

  factory DistributionCenter.fromMap(Map<String, dynamic> map) {
    return DistributionCenter(
      id: map['Oid'] as int,
      name: map['Name'] as String,
      address: map['Address'] as String,
    );
  }
}

class AnchorPage extends StatelessWidget {
  // details page
  final Anchor anchor;

  @override
  const AnchorPage({Key key, @required this.anchor}) : super(key: key);

  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        child: Text(anchor.name),
      ),
    );
  }
}

class AnchorsPage extends StatefulWidget {
  const AnchorsPage({Key key}) : super(key: key);

  @override
  _AnchorsPageState createState() => _AnchorsPageState();
}

class _AnchorsPageState extends State<AnchorsPage> {
  static const anchorsMap = {
    "Anchors": [
      {
        "Oid": 11,
        "Name": "MAIZE ASSOCIATION OF NIGERIA",
        "Acronym": "MAAN",
        "DistributionCentres": [
          {
            "Oid": 11,
            "Name": "Logo Centre (Zone A)",
            "Address": "Private Warehouse, Ugba, Logo LGA"
          },
          {
            "Oid": 12,
            "Name": "Makurdi Centre (Zone B)",
            "Address": "Ministry of Agric, Makurdi "
          },
          {
            "Oid": 13,
            "Name": "Oturkpo Centre (Zone C)",
            "Address": "Private Warehouse, Oturkpo"
          },
          {
            "Oid": 15,
            "Name": "Borno MAAN centre",
            "Address": "Bolori Store, Flavour Mill, Behind Vita Foam, Maiduguri"
          },
          {
            "Oid": 18,
            "Name": "Bauchi Centre",
            "Address": "BASPD, Dass Road, Bauchi"
          }
        ],
        "NoOfDistributionCentres": 5
      },
      {
        "Oid": 2,
        "Name":
            "MAIZE GROWERS, PROCESSORS AND MARKETERS ASSOCIATION OF NIGERIA",
        "Acronym": "MAGPAMAN",
        "DistributionCentres": [
          {
            "Oid": 2,
            "Name": "Guma Centre",
            "Address":
                "P 32, 2nd Avenue Federal Housing Estate, N/Bank, Makurdi"
          },
          {
            "Oid": 3,
            "Name": "Logo Centre",
            "Address": "Terhemen Akema Storage Facility, Ugba, Logo LGA"
          },
          {
            "Oid": 5,
            "Name": "Oturkpo Centre",
            "Address": "Grain Store, Lower Benue Okele Project, Otukpo"
          },
          {
            "Oid": 6,
            "Name": "Gboko Centre",
            "Address":
                "K3 New Road, Opposite former coca cola plant. Solar Schools Street, 
    Gboko"
          },
          {
            "Oid": 7,
            "Name": "Gwer East Centre",
            "Address":
                "Ahua Shardye's Warehouse, Behind Sylkan Filling Station, Ikpayongo , 
  G/East LGA"
          },
          {
            "Oid": 8,
            "Name": "Kwande Centre",
            "Address": "KM 3, Adagi Road, Adikpo"
          },
          {
            "Oid": 9,
            "Name": "Ohimini Centre",
            "Address": "Ajoga Oglewu, Ohimini"
          },
          {
            "Oid": 10,
            "Name": "Oju Centre",
            "Address": "Behind Town Hall, Ohuhu owo, Oju LGA"
          }
        ],
        "NoOfDistributionCentres": 8
      }
    ],
  };
  final _anchors = <Anchor>[];

  @override
  Widget build(BuildContext context) {
    // now you can use the anchors list here
    return Scaffold(
      body: ListView.builder(
        itemCount: _anchors.length,
        itemBuilder: (context, index) {
          final anchor = _anchors[index];
          return ListTile(
            title: Text(anchor.name),
            subtitle: Text(anchor.acronym),
            trailing: Text(anchor.distributionCenters?.length?.toString()),
            onTap: () {
              Navigator.push(
                context,
                MaterialPageRoute(
                  builder: (context) => AnchorPage(anchor: anchor),
                ),
              );
            },
          );
        },
      ),
    );
  }

  @override
  void initState() {
    super.initState();
    final anchors = _parseAnchors(anchorsMap);
    _anchors.addAll(anchors);
  }
}

这篇关于如何迭代属于键值的对象数组 - Flutter的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆