创造一个条件,可以在颤动中以正确的方式将数据集索引在一起

问题描述

我对何时使用两个不同的数据集(图像和用户)有疑问。图像数据集包含产品的图像,而用户数据集包含产品的信息。这两个数据集都包含ID,这很不错,因为这是我可以识别出哪些图片与正确的产品信息相关的方式。

所以我现在的问题是要以某种方式创建一个可以以正确的方式将数据集索引在一起的条件。

`

return Column(
   crossAxisAlignment: CrossAxisAlignment.start,children: <Widget>[
  Categories(),Expanded(
      child:ListView.builder(
  itemCount: users.length,itemBuilder: (context,index) {
   return Container(
     padding: EdgeInsets.fromLTRB(10,10,0),height: 220,width: double.maxFinite,child: Card(
     shape: RoundedRectangleBorder(
         borderRadius: BorderRadius.circular(15.0)),elevation: 3,child: InkWell(
    onTap: () {
      Navigator.push(
        context,MaterialPageRoute(
          builder: (context) => DetailsScreen(
           links: images[index],products: users[index],),);
    // Function is executed on tap.
          },child: new Stack(
           children: <Widget>[
            Container(
              margin: new EdgeInsets.symmetric(
                 vertical: 16.0
               ),alignment: FractionalOffset.centerLeft,child: new Image.network(images[index].plink.toString() ?? ''
         ),Container(
         margin: new EdgeInsets.fromLTRB(96.0,16.0,16.0),constraints: new BoxConstraints.expand(),child: new Column(
           crossAxisAlignment: CrossAxisAlignment.start,children: <Widget>[
             new Container(height: 2.0),new Text("${users[index].productNameBold??'No@R_733_4045@ion'}",style: Style.headerTextStyle,new Container(height: 5.0),new Text("${users[index].category??'No@R_733_4045@ion'}",style: Style.baseTextStyle
             ),new Container(
                 margin: new EdgeInsets.symmetric(vertical: 2.0),height: 2.0,width: 24.0,color: Colors.black
             ),new Text("${users[index].country??'No@R_733_4045@ion'}",new Container(height: 25.0),new Row(
               children: <Widget>[
                 new Text("${users[index].price??'No@R_733_4045@ion'} SEK",style: Style.pricetextdiscount,new Container(width: 8.0),new Text("129",style: Style.pricetextprevIoUs,],]),);
     },);`

编辑...................................................

嗨!因此,现在我制作了一个新的dart文件,在其中插入了获得帮助的代码。但是我现在不明白的是要激活代码,因为它将在我的Flutter应用程序中运行。因为在调试器中,结果显示即使我运行应用程序时,binbin的索引也为0。所以我想我没有以正确的方式调用文件

import 'package:shop_app/models/Image.dart';
import 'package:shop_app/models/ProductInfo.dart';



void main() {


var pictureList  = new List<Images>();
var userList  = new List<ProductInfo>();


List<Combine> combineList = new List<Combine>();
userList.forEach((user) {
  Images picture = pictureList.firstWhere((pic) => pic.productId == user.productId);
  if (picture != null) {
    combineList.add(Combine(user,picture));
  }
});

combineList.forEach((combine) {
  print("User id: ${combine.user.productId}  User name: 
${combine.user.productNameBold}");
  print(
      "Picture id: ${combine.product.productId}  Picture url: 
 ${combine.product.plink}");
  print("---------------------------------- \n");
   });
 }



 class Combine {
 ProductInfo user;
 Images product;
 Combine(this.user,this.product);
  }

解决方法

我认为您需要创建一个包含用户和产品的新类。然后,您应该运行一个循环并匹配用户和产品的ID。这是一个例子

void main() {
  List<User> userList = [
    User(1,"one"),User(2,"two"),User(3,"three"),];
  List<Product> pictureList = [
    Product(1,"oneImg"),Product(2,"twoImg"),Product(3,"threeImg"),];
  List<Combine> combineList = new List<Combine>();
  userList.forEach((user) {
    Product picture = pictureList.firstWhere((pic) => pic.id == user.id);
    if (picture != null) {
      combineList.add(Combine(user,picture));
    }
  });

  combineList.forEach((combine) {
    print("User id: ${combine.user.id}  User name: ${combine.user.name}");
    print(
        "Picture id: ${combine.product.id}  Picture url: ${combine.product.image}");
    print("---------------------------------- \n");
  });
}

class User {
  int id;
  String name;
  User(this.id,this.name);
}

class Product {
  int id;
  String image;
  Product(this.id,this.image);
}

class Combine {
  User user;
  Product product;
  Combine(this.user,this.product);
}

输出:

User id: 1  User name: one
Product id: 1  Product image: oneImg
---------------------------------- 

User id: 2  User name: two
Product id: 2  Product image: twoImg
---------------------------------- 

User id: 3  User name: three
Product id: 3  Product image: threeImg
---------------------------------- 

在您的情况下,将用户和产品合并到一个列表中,然后在小部件中使用该列表。

完整代码:

import 'dart:convert';

import 'package:flutter/material.dart';

import 'APIE.dart';
import 'Image.dart';
import 'ProductInfo.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',debugShowCheckedModeBanner: false,theme: ThemeData(
        primarySwatch: Colors.blue,),home: MyHomePage(title: 'Flutter Demo Home Page'),);
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key,this.title}) : super(key: key);

  final String title;

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

class _MyHomePageState extends State<MyHomePage> {
  var pictureList = new List<Images>();
  var userList = new List<ProductInfo>();
  bool dataGet = false;



  _getImage() {
    API.getImage().then((response) {
        Iterable list = json.decode(response.body);
        pictureList = list.map((model) => Images.fromJson(model)).toList();
        _conmineList();
    });
  }

  _getUsers() {
    API.getUsers().then((response) {
        Iterable list = json.decode(response.body);
        userList = list.map((model) => ProductInfo.fromJson(model)).toList();
        _getImage();
    });
  }

  _conmineList(){
    userList.forEach((user) {
      Images picture = pictureList.firstWhere((pic) => pic.productId == user.productId);
      if (picture != null) {
        combineList.add(Combine(user,picture));
      }
    });
    setState(() {
      dataGet = true;
    });
  }




  List<Combine> combineList = new List<Combine>();

  @override
  void initState() {
    _getUsers();
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text(widget.title),body: SingleChildScrollView(
          child: dataGet?ListView.builder(
            itemCount: userList.length,shrinkWrap: true,itemBuilder: (context,index) => ListTile(
              title: Text("${userList[index].productId}"),subtitle: Text("${pictureList[index].productId}" + "${combineList[index].product.productId}" ),):Center(child: CircularProgressIndicator()),));
  }
}


class Combine {
  ProductInfo user;
  Images product;
  Combine(this.user,this.product);
}