'How can I make a table in flutter where I can see the prices of items for different stores side by side?
I have the following class and list:
Class:
class ProductPrice {
final int productPriceId;
final String establishment;
final String product;
final double price;
const ProductEstablishmentPrice({
required this.productPriceId,
required this.establishment,
required this.product,
required this.price,
});
}
List:
List<ProductEstablishmentPrice> _productEstablishmentPrices = [
ProductEstablishmentPrice(
productPriceId: 1,
establishment: 'Store 1',
product: 'Product 1',
price: 25.00,
),
ProductEstablishmentPrice(
productPriceId: 2,
establishment: 'Store 1',
product: 'Product 2',
price: 10.50,
),
ProductEstablishmentPrice(
productPriceId: 3,
establishment: 'Store 1',
product: 'Product 3',
price: 0.50,
),
ProductEstablishmentPrice(
productPriceId: 4,
establishment: 'Store 1',
product: 'Product 4',
price: 1.50,
),
ProductEstablishmentPrice(
productPriceId: 5,
establishment: 'Store 1',
product: 'Product 5',
price: 13.75,
),
ProductEstablishmentPrice(
productPriceId: 6,
establishment: 'Store 2',
product: 'Product 1',
price: 25.00,
),
ProductEstablishmentPrice(
productPriceId: 7,
establishment: 'Store 2',
product: 'Product 2',
price: 12.50,
),
ProductEstablishmentPrice(
productPriceId: 8,
establishment: 'Store 2',
product: 'Product 3',
price: 5.50,
),
ProductEstablishmentPrice(
productPriceId: 9,
establishment: 'Store 2',
product: 'Product 4',
price: 6.50,
),
ProductEstablishmentPrice(
productPriceId: 10,
establishment: 'Store 2',
product: 'Product 5',
price: 0.75,
)
];
I want to make a table/ list where I can see for all the products in the list the prices for each store side by side. See attached image for an example of what I want to accomplish. In the future I will have more stores and products in the list.
The side by side comparison must be dynamically generated from the list I added as an example.
Thank you in advance.
Solution 1:[1]
you can use a ListView and set the scroll to horizontal
ListView (
children : [
Card(
child: ListTile(
title:Text("List Item 1") ,
)
),
Card(
child: ListTile(
title: Text("List Item 2"),
),
),
Card(
child: ListTile(
title: Text("List Item 3"),
)
),
],
scrollDirection: Axis.horizontal,
)
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|---|
| Solution 1 | Father Russia |
