如何使用Flutter在GridView中显示图像列表

gstyhher  于 2023-03-31  发布在  Flutter
关注(0)|答案(3)|浏览(143)

我刚开始学扑动,还没找到我的错误...
我试图在网格视图中显示列表中的图像,但我找不到控制台找不到getter 'room'的原因。
我创建了一个带有方法和构造函数的类,以及另一个存储不同列表的数据类。其中一个列表依赖于Room类。目前,另一个是固定的。
当我调用room.room时,class room被找到了,但是getter.room没有。
我错过什么了吗?

import 'package:flutter/material.dart';
import 'package:ipictory/datas/datarooms.dart';
import 'package:ipictory/widgets/room.dart';
import 'detail_room.dart';

class DetailRoomTest extends StatefulWidget{

  @override
  DetailRoomTestState createState() => DetailRoomTestState();

}

class DetailRoomTestState extends State<DetailRoomTest>{

  @override
  Widget build(BuildContext context) {
   final room = DataRooms().listeDataRooms;
   final roomImages = DataRooms().imageLiving;

    var size = MediaQuery.of(context).size;
    double width = size.width;
    double heigth = size.height;

    return Scaffold(
      appBar: AppBar(
        title: Text(room.room,         //-------> error: The getter 'room' isn't defined 
                                                for the type 'List<Room>'.
          style: TextStyle(
              color: Colors.white
          ),
        ),
      ),
      body: Column(
        children: [
          GridView.builder(
              gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 2),
              itemCount: roomImages.length,
              itemBuilder: (BuildContext context, int index) {
                return Card(
                    child:Image(
                        image: AssetImage(roomImages[index],)
                    ),
                );
              }
          )
        ],
      ),
    );
  }
}
import 'package:ipictory/widgets/room.dart';

class DataRooms {

  List<Room> listeDataRooms = [

    Room(room: "La salle à manger", inventoryTitle : "Inventaire", inventory: "Inventaire de la salle à manger : 1 table extensible, 4 chaises en simili cuir et 4 chaises en bois rangées dans le placard.", imagePath: "images/control_images/sallemanger.png" , damagesTitle : "Dommages", damages: "impact sur le plateau de la table, chaises en simili griffées à plusieurs endroits", desc: "La salle à manger est composée d'une table en bois extensibles pouvant accueillir 8 personnes." ),
    Room(room: "Salon", inventoryTitle : "Inventaire",inventory: "Inventaire du salon : 1 table basse, 6 coussins bleus en velour, 5 coussins d'assise du canapé, un panier", imagePath: "images/control_images/salon.png" , damagesTitle : "Dommages",damages: "Aucun dommage", desc: "Le salon est composé d'un canapé d'angle en tissu convertible en un lit 2 places et d'une table basse. Une jolie décoration en fait une zone très agréable. La télévision par satelite permet d'occuper les journées de pluie ou les moments de repos. "),
    Room(room: "La cuisine", inventoryTitle : "Inventaire", inventory: "Inventaire de la cuisine : 2 casseroles, 3 poeles, une vaisselle pour 8 personnes, 2 couteaux de cuisine, etc...", imagePath: "images/control_images/cuisine.png" , damagesTitle : "Dommages",damages: "il manque une cuillère", desc: "La cuisine est entièrement équipée. Cafetière à dosette ou à filtre, théière, grille pain, bouilloire, four à gaz, micro onde, refrigérateur, et plaques au gaz. Tout ce qu'il faut pour faire de bons plats. " ),
    Room(room: "La salle d'eau",inventoryTitle : "Inventaire", inventory: "La salle d'eau contient : 1 petit panier, un sèche cheveux", imagePath: "images/control_images/salle_deau.png" , damagesTitle : "Dommages",damages: "aucun dommage", desc: "Salle de douche parfaite"),
    Room(room: "La chambre parentale",inventoryTitle : "Inventaire", inventory: "la chambre parentale contient : un lit 140, 2 tables de chevets, 2 oreillers et une couverture 240x240", imagePath: "images/control_images/chambreparentale.png" , damagesTitle : "Dommages",damages: "Tache de sang sur le matelas", desc: "super chambre parentale"),
    Room(room: "Le dressing",inventoryTitle : "Inventaire", inventory: "le dressing contient une machine à laver le linge, 2 oreillers supplémentaires, ", imagePath: "images/control_images/dressing.png" , damagesTitle : "Dommages",damages: "aucun dommage", desc: "C'est le dressing de la chambre parentale. Pratique pour tout ranger"),
    Room(room: "chambre 1",inventoryTitle : "Inventaire", inventory: "la chambre 1 contient 2 lit 70cm, 2 oreillers et deux couvertures", imagePath: "images/control_images/chambre1.png" , damagesTitle : "Dommages",damages: "aucun dommage", desc: "super chambre pour enfants. C'est la chambre de Luna et Lana"),
    Room(room: "toilettes",inventoryTitle : "Inventaire", inventory: "Les toilettes contiennent une brosse WC", imagePath: "images/control_images/toilettes.png" , damagesTitle : "Dommages", damages: "Aucun dommage" ),
    Room(room: "Terrasse",inventoryTitle : "Inventaire", inventory: "La terrasse contient : 1 table de jardin, 8 chaises de jardin grises, une plancha, un parasol et son pied, un étendoir à linge, etc.", imagePath: "images/control_images/terrasse.png" , damagesTitle : "Dommages",damages: "7 chaises sont cassées" ),
    Room(room: "jardin",inventoryTitle : "Inventaire", inventory: "Le jardin dispose de deux transats ", imagePath: "images/control_images/jardin.png" , damagesTitle : "Dommages",damages: "aucun dommage" ),
  ];

  List imageLiving = [
    "images/lieux/living_room/salon.png",
    "images/lieux/living_room/salon.png",
  ];
}
class Room {
  String room;

  String inventory;

  String? desc;

  String imagePath;

  String damages;

  String inventoryTitle;

  String damagesTitle;

  Room({
    required this.inventoryTitle,
    required this.room,
    required this.inventory,
    this.desc,
    required this.imagePath,
    required this.damages,
    required this.damagesTitle,});

  String getImage() => imagePath;
}
dffbzjpn

dffbzjpn1#

错误基本上意味着你的房间变量是List<Room>Room。所以,因为它是List<Room>,你不能访问像这样的room.room,你需要访问特定的索引,然后再次访问.room如下
例如:

final room = DataRooms().listeDataRooms; //List of Room
Text(
  room.first.room // Access the first item from list
  // room[0].room Accesing with the help of index, you can write any number in bracket.
  // room.last.room Accessing last item from list
)
mzaanser

mzaanser2#

您已将房间定义为final room = DataRooms().listeDataRooms;,其本身也是List<Room>。(房间列表)
因此您可以通过room[0].roomroom.first.room访问它

hyrbngr7

hyrbngr73#

您需要房间名称的小部件参数。

class DetailRoomTest extends StatefulWidget{
  String room;
  const DetailRoomTest({
    Key? key,
    required this.room,
  }) : super(key: key);
  
  @override
  DetailRoomTestState createState() => DetailRoomTestState();

}

class DetailRoomTestState extends State<DetailRoomTest>{
   late List<String> _roomImages;
  

  @override
  void initState() {
    _roomImages = DataRooms().imageLiving;
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    var size = MediaQuery.of(context).size;
    double width = size.width;
    double heigth = size.height;

    return Scaffold(
      appBar: AppBar(
        title: Text(widget.room,       
          style: TextStyle(
              color: Colors.white
          ),
        ),
      ),
      body: Column(
        children: [
          GridView.builder(
              gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 2),
              itemCount: _roomImages.length,
              itemBuilder: (BuildContext context, int index) {
                return Card(
                    child:Image(
                        image: AssetImage(_roomImages[index],)
                    ),
                );
              }
          )
        ],
      ),
    );
  }
}

相关问题