Created
February 3, 2020 19:03
-
-
Save legalcodes/3e082cfec5a29b266d5137e0f6847cad to your computer and use it in GitHub Desktop.
Testing Shopping List change
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import 'package:flutter/material.dart'; | |
class Product { | |
const Product({this.name}); | |
final String name; | |
} | |
typedef void CartChangedCallback(Product product, bool inCart); | |
class ShoppingListItem extends StatelessWidget { | |
ShoppingListItem({this.product, this.inCart, this.onCartChanged}) | |
: super(key: ObjectKey(product)); | |
final Product product; | |
final bool inCart; | |
final CartChangedCallback onCartChanged; | |
Color _getColor(BuildContext context) { | |
// The theme depends on the BuildContext because different parts of the tree | |
// can have different themes. The BuildContext indicates where the build is | |
// taking place and therefore which theme to use. | |
return inCart ? Colors.black54 : Theme.of(context).primaryColor; | |
} | |
TextStyle _getTextStyle(BuildContext context) { | |
if (!inCart) return null; | |
return TextStyle( | |
color: Colors.black54, | |
decoration: TextDecoration.lineThrough, | |
); | |
} | |
@override | |
Widget build(BuildContext context) { | |
return ListTile( | |
onTap: () { | |
onCartChanged(product, inCart); | |
}, | |
leading: CircleAvatar( | |
backgroundColor: _getColor(context), | |
child: Text(product.name[0]), | |
), | |
title: Text(product.name, style: _getTextStyle(context)), | |
); | |
} | |
} | |
class ShoppingList extends StatefulWidget { | |
ShoppingList({Key key, this.products}) : super(key: key); | |
final List<Product> products; | |
// The framework calls createState the first time a widget appears at a given | |
// location in the tree. If the parent rebuilds and uses the same type of | |
// widget (with the same key), the framework re-uses the State object | |
// instead of creating a new State object. | |
@override | |
_ShoppingListState createState() => _ShoppingListState(); | |
} | |
class _ShoppingListState extends State<ShoppingList> { | |
Set<Product> _shoppingCart = Set<Product>(); | |
void _handleCartChanged(Product product, bool inCart) { | |
setState(() { | |
// When a user changes what's in the cart, you need to change | |
// _shoppingCart inside a setState call to trigger a rebuild. | |
// The framework then calls build, below, | |
// which updates the visual appearance of the app. | |
if (!inCart) | |
_shoppingCart.add(product); | |
else | |
_shoppingCart.remove(product); | |
}); | |
} | |
@override | |
Widget build(BuildContext context) { | |
return Scaffold( | |
appBar: AppBar( | |
title: Text('Shopping List'), | |
), | |
body: ListView( | |
padding: EdgeInsets.symmetric(vertical: 8.0), | |
children: widget.products.map((Product product) { | |
return ShoppingListItem( | |
product: product, | |
inCart: _shoppingCart.contains(product), | |
onCartChanged: _handleCartChanged, | |
); | |
}).toList(), | |
), | |
); | |
} | |
} | |
void main() { | |
runApp(MaterialApp( | |
title: 'Shopping App', | |
home: ShoppingList( | |
products: <Product>[ | |
Product(name: 'Eggs'), | |
Product(name: 'Flour'), | |
Product(name: 'Chocolate chips'), | |
], | |
), | |
)); | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment