flutter list error The argument type 'List' can't be assigned to parameter type 'String'

Question

I get an error that says;

The argument type 'List' can't be assigned to parameter type 'String'

on widget.storePageImage, widget.storePageItemName, and widget.storePageItemPrice.

How can I make this work?

This is what I'm trying to achieve; once a store in home page has been clicked(https://i.sstatic.net/Jbj7F.jpg) it should direct it to that individual stores page(https://i.sstatic.net/KJ4X0.jpg).

import 'package:flutter/material.dart';
import 'package:filename/src/homescreen.dart';
import 'package:filename/data/Store_list.dart';

class StoresPage extends StatefulWidget {
String storeName;
String storeDeliveryTime;
String deliveryCharges;
List<String> storePageImage;
List<String> storePageItemName;
List<String> storePageItemPrice;

StoresPage({
this.storeName, this.storeDeliveryTime, this.deliveryCharges, 
this.storePageImage, this.storePageItemName, this.storePageItemPrice
});

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

class _StoresPageState extends State<StoresPage> {

@override
Widget build(BuildContext context) {
return Scaffold(
  body: ListView(
    children: <Widget>[
      Container(
        padding: EdgeInsets.only(right: 15.0, top: 9.0, left: 10.0),
        margin: EdgeInsets.only(bottom: 10.0),
        child: Row(
          children: <Widget>[
            Column(
              children: <Widget>[
                Padding(
                  padding: const EdgeInsets.only(top: 20.0, right: 
                  5.0),
                  child: GestureDetector(
                      onTap: (){Navigator.push(
                        context,
                        MaterialPageRoute(builder: (context) => 
                        HomeScreen()),
                      );},
                      child: Icon(Icons.navigate_before, color: 
                      Colors.black87,)),
                ),
              ],
            ),
            Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: <Widget>[
                Text("You're now", style: TextStyle(color: 
                Colors.grey),),
                Row(
                  children: <Widget>[
                    Text("Shopping at", style: TextStyle(fontSize: 
                    16.0, fontWeight: FontWeight.bold),),
                    SizedBox(width: 5.0,),
                    Text(widget.storeName, style: 
                    TextStyle(fontSize: 16.0, fontWeight: 
                    FontWeight.bold),),
                  ],
                ),
              ],
            ),
            Spacer(),
            Container(
              height: 60,
              width: 60,
              decoration: BoxDecoration(
                shape: BoxShape.circle,
                image: DecorationImage(
                  fit: BoxFit.fill,
                  image: AssetImage('assets/images/profilepc.png'),
                ),
              ),
            ),
          ],
        ),
      ),
      Container(
        margin: EdgeInsets.only(bottom: 25.0),
        height: 35.0,
        width: 380.0,
        child: Padding(
          padding: const EdgeInsets.only(left: 15.0, right: 15.0),
          child: TextField(
            style: TextStyle(fontSize: 15.0),
            decoration: InputDecoration(
              filled: true,
              fillColor: Color(0xFFEEEEEE),
              contentPadding: EdgeInsets.symmetric(horizontal: 5.0, 
              vertical: 5.0),
              hintText: "Search  ${widget.storeName}",
              prefixIcon: Icon(Icons.search, color: Colors.black,),
              border: OutlineInputBorder(
                  borderRadius: 
              BorderRadius.all(Radius.circular(30.0))),
            ),
          ),
        ),
      ),
      Column(
        children: <Widget>[
          Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Text(widget.storeName, style: TextStyle(fontSize: 
              25.0),)
            ],
          ),
          Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Icon(Icons.motorcycle),
              SizedBox(width: 7.0),
              Text(widget.deliveryCharges),
              SizedBox(width: 20.0,),
              Icon(Icons.update),
              SizedBox(width: 5.0),
              Text(widget.storeDeliveryTime),
            ],
          ),
          Padding(
            padding: const EdgeInsets.only(top: 10.0, bottom: 1.0),
            child: Divider(height: 20.0, color: Colors.grey,),
          ),
        ],
      ),

      SingleChildScrollView(
        child: Column(
          children: <Widget>[
            Row(
              children: <Widget>[
                  Padding(
                    padding: EdgeInsets.only(left: 10.0, top: 7.0),
                    child: Container(
                      height: 100,
                      width: 100,
                      decoration: BoxDecoration(
                        borderRadius: BorderRadius.circular(30),
                        image: DecorationImage(
                          fit: BoxFit.fill,
                          image: AssetImage(widget.storePageImage),
                        ),
                      ),
                    ),
                  ),
                Text(widget.storePageItemName),
                Spacer(),
                Padding(padding: const EdgeInsets.only(top: 52.0, 
                right: 10.0),
                 child: Column(children: <Widget>[
                  Text(widget.storePageItemPrice),
                ],),
                ),
              ],
            ),
          ],
        ),
      ),

    ],
  ),
);
}
}

Data file

class Stores {
String storeName;
String storeImage;
String storeDeliveryTime;
String deliveryCharges;
List<String> storePageImage;
List<String> storePageItemName;
List<String> storePageItemPrice;

Stores.list({this.storeName, this.storeDeliveryTime
this.storeImage, this.deliveryCharges, this.storePageImage,
this.storePageItemName, this.storePageItemPrice});
}

List<Stores> storesList = [
Stores.list(
  storeName: "Store 1",
  storeImage: "assets/images/store1front.jpg",
  storeDeliveryTime: "25 min",
  deliveryCharges: "£3.90",
  storePageImage: ["assets/images/1.png","assets/images/2.png", 
  "assets/images/3.png","assets/images/4.png"],
  storePageItemName: ["Black TSHIRT","Khaki T-SHIRT","Grey Knit 
  Notch Neck","Teal Polo Shirt" ],
  storePageItemPrice: ["£17.99","17.99","17.99","17.99"] 
),

Stores.list(
storeName: "STORE2",
storeImage: "assets/images/STORE2front.jpg",
storeDeliveryTime: "25 min",
deliveryCharges: "£2.90",
storePageImage: 
  ["assets/images/store2_1.png","assets/images/store2_2.png", 
  "assets/images/store2_3.png","assets/images/store2_4.png"],
storePageItemName: ["WHITE TSHIRT","orange T-SHIRT","Grey 
                   shirt", "mint tea Polo Shirt" ],
storePageItemPrice: ["£18.99","10.99","16.99","13.99"]),];

Answer 1

The reason why you're getting the error The argument type 'List' can't be assigned to parameter type 'String' is because the method expects a String, but a List is being used.

The logs points out the parameters causing the issue: widget.storePageImage, widget.storePageItemName, and widget.storePageItemPrice. These parameters are used here.

SingleChildScrollView(
  child: Column(
     children: <Widget>[
       Row(
         children: <Widget>[
           Padding(
             padding: EdgeInsets.only(left: 10.0, top: 7.0),
             child: Container(
               height: 100,
               width: 100,
               decoration: BoxDecoration(
                 borderRadius: BorderRadius.circular(30),
                 image: DecorationImage(
                   fit: BoxFit.fill,
                   image: AssetImage(widget.storePageImage),
                 ),
               ),
             ),
           ),
           Text(widget.storePageItemName),
           Spacer(),
           Padding(padding: const EdgeInsets.only(top: 52.0, 
             right: 10.0),
             child: Column(children: <Widget>[
               Text(widget.storePageItemPrice),
             ],),
          ),
        ],
      ),
    ],
  ),
),

From what I can see, it seems that you're trying to create a List of Widgets displaying store page items and its prices. What you can do here is use ListView.builder() to create a List of Widgets for store page items.

ListView.builder(
  padding: const EdgeInsets.all(8),
  // assuming that storePageImage, storePageItemName, storePageItemPrice
  // has the same length. Otherwise, add safety checks for index OutOfBound errors
  itemCount: widget.storePageItemName.length,
  itemBuilder: (BuildContext context, int index) {
    return Row(
      children: <Widget>[
        Padding(
          padding: EdgeInsets.only(left: 10.0, top: 7.0),
          child: Container(
            height: 100,
            width: 100,
            decoration: BoxDecoration(
              borderRadius: BorderRadius.circular(30),
              image: DecorationImage(
                fit: BoxFit.fill,
                image: AssetImage(widget.storePageImage[index]),
              ),
            ),
          ),
        ),
        Text(widget.storePageItemName[index]),
        Spacer(),
        Padding(
          padding: const EdgeInsets.only(top: 52.0, right: 10.0),
          child: Column(
            children: <Widget>[
              Text(widget.storePageItemPrice[index]),
            ],
          ),
        ),
      ],
    );
  },
)