546 lines
20 KiB
Dart
546 lines
20 KiB
Dart
import 'package:flutter/material.dart';
|
|
|
|
class AddToCartScreen extends StatefulWidget {
|
|
@override
|
|
_AddToCartScreenState createState() => _AddToCartScreenState();
|
|
}
|
|
|
|
class _AddToCartScreenState extends State<AddToCartScreen> {
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return Container(
|
|
child: SingleChildScrollView(
|
|
child: Padding(
|
|
padding: const EdgeInsets.symmetric(horizontal: 10.0, vertical: 5.0),
|
|
child: Column(
|
|
children: [
|
|
// Options Row
|
|
Row(
|
|
mainAxisAlignment: MainAxisAlignment.end,
|
|
children: [
|
|
RaisedButton(
|
|
onPressed: (){},
|
|
child: Text('Clear All'),
|
|
color: Colors.redAccent[100],
|
|
textColor: Colors.redAccent[700],
|
|
),
|
|
Container(
|
|
width: 10,
|
|
height: 10,
|
|
),
|
|
IconButton(
|
|
onPressed: (){},
|
|
icon: Icon(Icons.settings),
|
|
iconSize: 40,
|
|
),
|
|
],
|
|
),
|
|
SizedBox(height: 10,),
|
|
// Add to cart Row
|
|
Row(
|
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
children: [
|
|
Container(
|
|
width: 50,
|
|
height: 50,
|
|
decoration: BoxDecoration(
|
|
borderRadius: BorderRadius.circular(5),
|
|
image: DecorationImage(
|
|
fit: BoxFit.cover,
|
|
image: NetworkImage('https://images.pexels.com/photos/286283/pexels-photo-286283.jpeg?auto=compress&cs=tinysrgb&h=750&w=1260')
|
|
)
|
|
),
|
|
),
|
|
Container(
|
|
width: 110,
|
|
child: Text(
|
|
'Grilled Corn',
|
|
style: TextStyle(
|
|
fontSize: 18,
|
|
fontWeight: FontWeight.w500
|
|
),
|
|
),
|
|
),
|
|
FloatingActionButton(
|
|
onPressed: (){},
|
|
child: Icon(Icons.remove),
|
|
backgroundColor: Colors.blueGrey[300],
|
|
),
|
|
Text(
|
|
"1",
|
|
style: TextStyle(
|
|
fontSize: 28,
|
|
fontWeight: FontWeight.w500
|
|
),
|
|
),
|
|
FloatingActionButton(
|
|
onPressed: (){},
|
|
child: Icon(Icons.add),
|
|
backgroundColor: Colors.blueGrey[300],
|
|
),
|
|
Text(
|
|
'\$1.75',
|
|
style: TextStyle(
|
|
fontSize: 22,
|
|
fontWeight: FontWeight.w500,
|
|
color: Colors.deepOrange
|
|
),
|
|
),
|
|
],
|
|
),
|
|
SizedBox(height: 10,),
|
|
Row(
|
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
children: [
|
|
Container(
|
|
width: 50,
|
|
height: 50,
|
|
decoration: BoxDecoration(
|
|
borderRadius: BorderRadius.circular(5),
|
|
image: DecorationImage(
|
|
fit: BoxFit.cover,
|
|
image: NetworkImage('https://images.pexels.com/photos/1435735/pexels-photo-1435735.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=750&w=1260')
|
|
)
|
|
),
|
|
),
|
|
Container(
|
|
width: 110,
|
|
child: Text(
|
|
'Fruit',
|
|
style: TextStyle(
|
|
fontSize: 18,
|
|
fontWeight: FontWeight.w500
|
|
),
|
|
),
|
|
),
|
|
FloatingActionButton(
|
|
onPressed: (){},
|
|
child: Icon(Icons.remove),
|
|
backgroundColor: Colors.blueGrey[300],
|
|
),
|
|
Text(
|
|
"3",
|
|
style: TextStyle(
|
|
fontSize: 28,
|
|
fontWeight: FontWeight.w500
|
|
),
|
|
),
|
|
FloatingActionButton(
|
|
onPressed: (){},
|
|
child: Icon(Icons.add),
|
|
backgroundColor: Colors.blueGrey[300],
|
|
),
|
|
Text(
|
|
'\$4.95',
|
|
style: TextStyle(
|
|
fontSize: 22,
|
|
fontWeight: FontWeight.w500,
|
|
color: Colors.deepOrange
|
|
),
|
|
),
|
|
],
|
|
),
|
|
SizedBox(height: 10,),
|
|
Row(
|
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
children: [
|
|
Container(
|
|
width: 50,
|
|
height: 50,
|
|
decoration: BoxDecoration(
|
|
borderRadius: BorderRadius.circular(5),
|
|
image: DecorationImage(
|
|
fit: BoxFit.cover,
|
|
image: NetworkImage('https://images.pexels.com/photos/3206433/pexels-photo-3206433.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=750&w=1260')
|
|
)
|
|
),
|
|
),
|
|
Container(
|
|
width: 110,
|
|
child: Text(
|
|
'Cho Cafe',
|
|
style: TextStyle(
|
|
fontSize: 18,
|
|
fontWeight: FontWeight.w500
|
|
),
|
|
),
|
|
),
|
|
FloatingActionButton(
|
|
onPressed: (){},
|
|
child: Icon(Icons.remove),
|
|
backgroundColor: Colors.blueGrey[300],
|
|
),
|
|
Text(
|
|
"1",
|
|
style: TextStyle(
|
|
fontSize: 28,
|
|
fontWeight: FontWeight.w500
|
|
),
|
|
),
|
|
FloatingActionButton(
|
|
onPressed: (){},
|
|
child: Icon(Icons.add),
|
|
backgroundColor: Colors.blueGrey[300],
|
|
),
|
|
Text(
|
|
'\$0.75',
|
|
style: TextStyle(
|
|
fontSize: 22,
|
|
fontWeight: FontWeight.w500,
|
|
color: Colors.deepOrange
|
|
),
|
|
),
|
|
],
|
|
),
|
|
SizedBox(height: 10,),
|
|
Row(
|
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
children: [
|
|
Container(
|
|
width: 50,
|
|
height: 50,
|
|
decoration: BoxDecoration(
|
|
borderRadius: BorderRadius.circular(5),
|
|
image: DecorationImage(
|
|
fit: BoxFit.cover,
|
|
image: NetworkImage('https://images.pexels.com/photos/3662104/pexels-photo-3662104.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=750&w=1260')
|
|
)
|
|
),
|
|
),
|
|
Container(
|
|
width: 110,
|
|
child: Text(
|
|
'Che Soup',
|
|
style: TextStyle(
|
|
fontSize: 18,
|
|
fontWeight: FontWeight.w500
|
|
),
|
|
),
|
|
),
|
|
FloatingActionButton(
|
|
onPressed: (){},
|
|
child: Icon(Icons.remove),
|
|
backgroundColor: Colors.blueGrey[300],
|
|
),
|
|
Text(
|
|
"2",
|
|
style: TextStyle(
|
|
fontSize: 28,
|
|
fontWeight: FontWeight.w500
|
|
),
|
|
),
|
|
FloatingActionButton(
|
|
onPressed: (){},
|
|
child: Icon(Icons.add),
|
|
backgroundColor: Colors.blueGrey[300],
|
|
),
|
|
Text(
|
|
'\$5.50',
|
|
style: TextStyle(
|
|
fontSize: 22,
|
|
fontWeight: FontWeight.w500,
|
|
color: Colors.deepOrange
|
|
),
|
|
),
|
|
],
|
|
),
|
|
SizedBox(height: 10,),
|
|
Row(
|
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
children: [
|
|
Container(
|
|
width: 50,
|
|
height: 50,
|
|
decoration: BoxDecoration(
|
|
borderRadius: BorderRadius.circular(5),
|
|
image: DecorationImage(
|
|
fit: BoxFit.cover,
|
|
image: NetworkImage('https://images.pexels.com/photos/1435706/pexels-photo-1435706.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=750&w=1260')
|
|
)
|
|
),
|
|
),
|
|
Container(
|
|
width: 110,
|
|
child: Text(
|
|
'Nat Milk',
|
|
style: TextStyle(
|
|
fontSize: 18,
|
|
fontWeight: FontWeight.w500
|
|
),
|
|
),
|
|
),
|
|
FloatingActionButton(
|
|
onPressed: (){},
|
|
child: Icon(Icons.remove),
|
|
backgroundColor: Colors.blueGrey[300],
|
|
),
|
|
Text(
|
|
"5",
|
|
style: TextStyle(
|
|
fontSize: 28,
|
|
fontWeight: FontWeight.w500
|
|
),
|
|
),
|
|
FloatingActionButton(
|
|
onPressed: (){},
|
|
child: Icon(Icons.add),
|
|
backgroundColor: Colors.blueGrey[300],
|
|
),
|
|
Text(
|
|
'\$9.25',
|
|
style: TextStyle(
|
|
fontSize: 22,
|
|
fontWeight: FontWeight.w500,
|
|
color: Colors.deepOrange
|
|
),
|
|
),
|
|
],
|
|
),
|
|
SizedBox(height: 10,),
|
|
Row(
|
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
children: [
|
|
Container(
|
|
width: 50,
|
|
height: 50,
|
|
decoration: BoxDecoration(
|
|
borderRadius: BorderRadius.circular(5),
|
|
image: DecorationImage(
|
|
fit: BoxFit.cover,
|
|
image: NetworkImage('https://images.pexels.com/photos/1998635/pexels-photo-1998635.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=750&w=1260')
|
|
)
|
|
),
|
|
),
|
|
Container(
|
|
width: 110,
|
|
child: Text(
|
|
'Cho Cake',
|
|
style: TextStyle(
|
|
fontSize: 18,
|
|
fontWeight: FontWeight.w500
|
|
),
|
|
),
|
|
),
|
|
FloatingActionButton(
|
|
onPressed: (){},
|
|
child: Icon(Icons.remove),
|
|
backgroundColor: Colors.blueGrey[300],
|
|
),
|
|
Text(
|
|
"1",
|
|
style: TextStyle(
|
|
fontSize: 28,
|
|
fontWeight: FontWeight.w500
|
|
),
|
|
),
|
|
FloatingActionButton(
|
|
onPressed: (){},
|
|
child: Icon(Icons.add),
|
|
backgroundColor: Colors.blueGrey[300],
|
|
),
|
|
Text(
|
|
'\$1.95',
|
|
style: TextStyle(
|
|
fontSize: 22,
|
|
fontWeight: FontWeight.w500,
|
|
color: Colors.deepOrange
|
|
),
|
|
),
|
|
],
|
|
),
|
|
SizedBox(height: 30,),
|
|
// Detail Price Row
|
|
Column(
|
|
children: [
|
|
Container(
|
|
child: Card(
|
|
elevation: 5,
|
|
child: Padding(
|
|
padding: const EdgeInsets.all(15.0),
|
|
child: Column(
|
|
children: [
|
|
Row(
|
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
children: [
|
|
Text(
|
|
'Subtotal',
|
|
style: TextStyle(
|
|
fontSize: 18,
|
|
),
|
|
),
|
|
Text(
|
|
'\$24.15',
|
|
style: TextStyle(
|
|
fontSize: 18,
|
|
fontWeight: FontWeight.bold
|
|
),
|
|
),
|
|
],
|
|
),
|
|
SizedBox(height: 10,),
|
|
Row(
|
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
children: [
|
|
Text(
|
|
'Discount',
|
|
style: TextStyle(
|
|
fontSize: 18,
|
|
),
|
|
),
|
|
Text(
|
|
'- \$5.00',
|
|
style: TextStyle(
|
|
fontSize: 18,
|
|
fontWeight: FontWeight.bold
|
|
),
|
|
),
|
|
],
|
|
),
|
|
SizedBox(height: 10,),
|
|
Row(
|
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
children: [
|
|
Text(
|
|
'Sales Tax',
|
|
style: TextStyle(
|
|
fontSize: 18,
|
|
),
|
|
),
|
|
Text(
|
|
'\$2.25',
|
|
style: TextStyle(
|
|
fontSize: 18,
|
|
fontWeight: FontWeight.bold
|
|
),
|
|
),
|
|
],
|
|
),
|
|
SizedBox(height: 15,),
|
|
Container(
|
|
width: double.infinity,
|
|
height: 1,
|
|
color: Colors.blueGrey,
|
|
),
|
|
SizedBox(height: 15,),
|
|
Row(
|
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
children: [
|
|
Text(
|
|
'Total',
|
|
style: TextStyle(
|
|
fontSize: 24,
|
|
),
|
|
),
|
|
Text(
|
|
'\$26.40',
|
|
style: TextStyle(
|
|
fontSize: 30,
|
|
fontWeight: FontWeight.bold
|
|
),
|
|
),
|
|
],
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
SizedBox(height: 20,),
|
|
// Cashless Credit Row
|
|
Container(
|
|
child: Card(
|
|
elevation: 5,
|
|
child: Padding(
|
|
padding: const EdgeInsets.all(10.0),
|
|
child: Row(
|
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
children: [
|
|
Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
Text(
|
|
'CASHLESS CREDIT',
|
|
style: TextStyle(
|
|
fontWeight: FontWeight.bold,
|
|
fontSize: 13,
|
|
color: Colors.indigo[700],
|
|
),
|
|
),
|
|
Text(
|
|
'\$21.40',
|
|
style: TextStyle(
|
|
fontSize: 26,
|
|
color: Colors.deepOrange,
|
|
fontWeight: FontWeight.bold,
|
|
),
|
|
),
|
|
Text(
|
|
'Available',
|
|
style: TextStyle(
|
|
fontSize: 12,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
RaisedButton(
|
|
onPressed: (){},
|
|
child: Text(
|
|
'Cancel'
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
),
|
|
SizedBox(height: 20,),
|
|
// Button Pay Cashless
|
|
Container(
|
|
width: double.infinity,
|
|
child: RaisedButton(
|
|
onPressed: (){},
|
|
child: Text(
|
|
'Pay With Cashless Credit',
|
|
style: TextStyle(
|
|
fontSize: 12,
|
|
color: Colors.white,
|
|
),
|
|
),
|
|
color: Colors.deepOrange,
|
|
padding: EdgeInsets.symmetric(vertical: 15),
|
|
),
|
|
),
|
|
SizedBox(height: 10,),
|
|
// Balance Due Row
|
|
Row(
|
|
mainAxisAlignment: MainAxisAlignment.spaceBetween,
|
|
children: [
|
|
Text(
|
|
'Balance Due',
|
|
style: TextStyle(
|
|
fontSize: 13,
|
|
color: Colors.black,
|
|
),
|
|
),
|
|
Text(
|
|
'\$5.00',
|
|
style: TextStyle(
|
|
fontSize: 15,
|
|
fontWeight: FontWeight.bold,
|
|
color: Colors.black,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
],
|
|
),
|
|
),
|
|
),
|
|
);
|
|
}
|
|
}
|
|
|
|
|