Skip to content

Commit b2013fc

Browse files
committed
fix: shopping screen alignments, border radius, colors
1 parent 364358a commit b2013fc

19 files changed

+441
-264
lines changed

lib/custom_widgets/button_plain.dart

+16-6
Original file line numberDiff line numberDiff line change
@@ -7,25 +7,35 @@ class ButtonPlain extends StatelessWidget {
77
final Color textColor;
88
final double size;
99
final String text;
10+
final VoidCallback onTap;
11+
final double height;
12+
final double textSize;
1013

1114
const ButtonPlain(
12-
{this.color, this.textColor, this.borderColor, this.size, this.text});
15+
{this.color,
16+
this.textColor,
17+
this.borderColor,
18+
this.size,
19+
this.text,
20+
this.height,
21+
this.textSize,
22+
this.onTap});
1323

1424
@override
1525
Widget build(BuildContext context) {
1626
return ButtonTheme(
17-
height: 48,
27+
height: height != null ? height : 48,
1828
minWidth: size != null ? size : MediaQuery.of(context).size.width,
1929
child: RaisedButton(
2030
padding: EdgeInsets.all(16),
2131
color: color,
22-
onPressed: () {
23-
Navigator.pushNamed(context, "/welcome_screen");
24-
},
32+
onPressed: onTap,
2533
textColor: textColor,
2634
child: Text(
2735
text,
28-
style: TextStyle(fontSize: 12.0, fontWeight: FontWeight.w800),
36+
style: TextStyle(
37+
fontSize: textSize != null ? textSize : 12,
38+
fontWeight: FontWeight.w800),
2939
),
3040
shape: RoundedRectangleBorder(
3141
borderRadius: new BorderRadius.circular(16.0)),

lib/custom_widgets/cart_add_remove_button.dart

+35-29
Original file line numberDiff line numberDiff line change
@@ -17,30 +17,33 @@ class _CartAddRemoveButtonState extends State<CartAddRemoveButton> {
1717
}
1818

1919
void onAddClicked() {
20-
setState(() {
21-
count = count + 1;
22-
print("add clicked " + count.toString());
23-
});
20+
if (count < 4)
21+
setState(() {
22+
count = count + 1;
23+
print("add clicked " + count.toString());
24+
});
2425
}
2526

2627
void onRemoveClicked() {
27-
setState(() {
28-
count = count - 1;
29-
print("remove clicked " + count.toString());
30-
});
28+
if (count > 0)
29+
setState(() {
30+
count = count - 1;
31+
print("remove clicked " + count.toString());
32+
});
3133
}
3234

3335
@override
3436
Widget build(BuildContext context) {
3537
return Container(
3638
width: 96,
37-
height: 36,
39+
height: 40,
3840
decoration: ShapeDecoration(
3941
shape: RoundedRectangleBorder(
4042
borderRadius: BorderRadius.all(Radius.circular(10)),
4143
side: BorderSide(color: wood_smoke, width: 2))),
4244
child: Row(
4345
mainAxisSize: MainAxisSize.max,
46+
crossAxisAlignment: CrossAxisAlignment.center,
4447
children: <Widget>[
4548
count == 0
4649
? SizedBox()
@@ -50,24 +53,31 @@ class _CartAddRemoveButtonState extends State<CartAddRemoveButton> {
5053
onTap: () {
5154
onRemoveClicked();
5255
},
53-
child: Center(
54-
child: IconButton(
55-
alignment: Alignment.topCenter,
56-
icon: Icon(Icons.remove),
57-
onPressed: () {
58-
onRemoveClicked();
59-
},
56+
child: IconButton(
57+
icon: Icon(
58+
Icons.remove,
59+
size: 24,
6060
),
61+
onPressed: () {
62+
onRemoveClicked();
63+
},
6164
),
6265
),
6366
),
6467
count == 0
6568
? Expanded(
6669
flex: 2,
6770
child: Container(
71+
padding: EdgeInsets.symmetric(horizontal: 8),
6872
alignment: Alignment.center,
6973
height: MediaQuery.of(context).size.height,
70-
color: lightening_yellow,
74+
decoration: ShapeDecoration(
75+
color: lightening_yellow,
76+
shape: RoundedRectangleBorder(
77+
borderRadius: BorderRadius.only(
78+
topLeft: Radius.circular(10),
79+
bottomLeft: Radius.circular(10))),
80+
),
7181
child: Text(
7282
"Add",
7383
textAlign: TextAlign.center,
@@ -79,6 +89,7 @@ class _CartAddRemoveButtonState extends State<CartAddRemoveButton> {
7989
: Expanded(
8090
flex: 1,
8191
child: Container(
92+
padding: EdgeInsets.symmetric(horizontal: 8),
8293
alignment: Alignment.center,
8394
height: MediaQuery.of(context).size.height,
8495
color: lightening_yellow,
@@ -95,19 +106,14 @@ class _CartAddRemoveButtonState extends State<CartAddRemoveButton> {
95106
onTap: () {
96107
onAddClicked();
97108
},
98-
child: Container(
99-
alignment: Alignment.topCenter,
100-
color: white,
101-
height: MediaQuery.of(context).size.height,
102-
child: Center(
103-
child: IconButton(
104-
alignment: Alignment.topCenter,
105-
icon: Icon(Icons.add),
106-
onPressed: () {
107-
onAddClicked();
108-
},
109-
),
109+
child: IconButton(
110+
icon: Icon(
111+
Icons.add,
112+
size: 24,
110113
),
114+
onPressed: () {
115+
onAddClicked();
116+
},
111117
),
112118
),
113119
)

lib/custom_widgets/chip_widget.dart

+36
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
import 'package:contraflutterkit/utils/colors.dart';
2+
import 'package:flutter/cupertino.dart';
3+
import 'package:flutter/material.dart';
4+
5+
class ChipWidget extends StatelessWidget {
6+
final String text;
7+
final bool selected;
8+
final VoidCallback onTap;
9+
10+
const ChipWidget({this.text, this.selected, this.onTap});
11+
12+
@override
13+
Widget build(BuildContext context) {
14+
return GestureDetector(
15+
onTap: onTap,
16+
child: Container(
17+
height: 48,
18+
padding: EdgeInsets.all(12),
19+
child: Row(
20+
mainAxisSize: MainAxisSize.min,
21+
children: <Widget>[
22+
Text(
23+
text,
24+
style: TextStyle(color: wood_smoke),
25+
),
26+
selected ? Icon(Icons.close) : SizedBox()
27+
],
28+
),
29+
decoration: ShapeDecoration(
30+
color: selected ? pastel_pink : white,
31+
shape: RoundedRectangleBorder(
32+
borderRadius: BorderRadius.all(Radius.circular(44)),
33+
side: BorderSide(color: wood_smoke, width: 2)))),
34+
);
35+
}
36+
}

lib/custom_widgets/chips_filter_widget.dart

+13-1
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import 'package:contraflutterkit/custom_widgets/chip_widget.dart';
12
import 'package:contraflutterkit/utils/colors.dart';
23
import 'package:flutter/cupertino.dart';
34
import 'package:flutter/material.dart';
@@ -31,7 +32,18 @@ class _ChipsFilterWidgetState extends State<ChipsFilterWidget> {
3132
children: List<Widget>.generate(
3233
options.length,
3334
(int index) {
34-
return ChoiceChip(
35+
return ChipWidget(
36+
selected: selectedChoices.contains(index),
37+
text: options[index],
38+
onTap: () {
39+
setState(() {
40+
selectedChoices.contains(index)
41+
? selectedChoices.remove(index)
42+
: selectedChoices.add(index);
43+
});
44+
},
45+
);
46+
ChoiceChip(
3547
disabledColor: white,
3648
selectedColor: pastel_pink,
3749
padding: EdgeInsets.all(12),

lib/main.dart

+4-2
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ import 'package:contraflutterkit/onboarding/type3/pager.dart';
1010
import 'package:contraflutterkit/onboarding/welcome_screen.dart';
1111
import 'package:contraflutterkit/shopping/shopping_detail_page_one.dart';
1212
import 'package:contraflutterkit/shopping/shopping_detail_page_two.dart';
13+
import 'package:contraflutterkit/shopping/shopping_home_page.dart';
1314
import 'package:contraflutterkit/shopping/shopping_home_page_one.dart';
1415
import 'package:contraflutterkit/shopping/shopping_home_page_two.dart';
1516
import 'package:contraflutterkit/shopping/shopping_list_page_type_one.dart';
@@ -63,10 +64,11 @@ class MyApp extends StatelessWidget {
6364
'/shopping_main_page': (context) => ShoppingMainPage(),
6465
'/shopping_list_page_one': (context) => ShoppingListPageOne(),
6566
'/shopping_list_page_two': (context) => ShoppingListPageTwo(),
67+
'/shopping_home_page': (context) => ShoppingHomePage(),
6668
'/shopping_home_page_one': (context) => ShoppingHomePageOne(),
6769
'/shopping_home_page_two': (context) => ShoppingHomePageTwo(),
68-
'/shopping_home_main_one': (context) => ShoppingDetailPageOne(),
69-
'/shopping_home_main_two': (context) => ShoppingDetailPageTwo(),
70+
'/shopping_detail_page_one': (context) => ShoppingDetailPageOne(),
71+
'/shopping_detail_page_two': (context) => ShoppingDetailPageTwo(),
7072
},
7173
);
7274
}

lib/shopping/shop_card_item.dart

+54-50
Original file line numberDiff line numberDiff line change
@@ -6,64 +6,68 @@ import 'package:flutter_svg/svg.dart';
66

77
class ShopCardItemWidget extends StatelessWidget {
88
final ShopItem shopItem;
9+
final VoidCallback onTap;
910

10-
const ShopCardItemWidget({this.shopItem});
11+
const ShopCardItemWidget({this.shopItem, this.onTap});
1112

1213
@override
1314
Widget build(BuildContext context) {
14-
return Container(
15-
padding: EdgeInsets.all(24),
16-
child: Column(
17-
children: <Widget>[
18-
Container(
19-
width: MediaQuery.of(context).size.width,
20-
decoration: ShapeDecoration(
21-
color: shopItem.bgColor,
22-
shape: RoundedRectangleBorder(
23-
borderRadius: BorderRadius.all(Radius.circular(16)),
24-
side: BorderSide(color: wood_smoke, width: 2))),
25-
child: SvgPicture.asset(
26-
shopItem.image,
27-
width: 235,
28-
height: 212,
15+
return GestureDetector(
16+
onTap: onTap,
17+
child: Container(
18+
padding: EdgeInsets.all(24),
19+
child: Column(
20+
children: <Widget>[
21+
Container(
22+
width: MediaQuery.of(context).size.width,
23+
decoration: ShapeDecoration(
24+
color: shopItem.bgColor,
25+
shape: RoundedRectangleBorder(
26+
borderRadius: BorderRadius.all(Radius.circular(16)),
27+
side: BorderSide(color: wood_smoke, width: 2))),
28+
child: SvgPicture.asset(
29+
shopItem.image,
30+
width: 235,
31+
height: 212,
32+
),
2933
),
30-
),
31-
Padding(
32-
padding: const EdgeInsets.symmetric(vertical: 8.0),
33-
child: Row(
34-
mainAxisAlignment: MainAxisAlignment.start,
35-
crossAxisAlignment: CrossAxisAlignment.start,
36-
children: <Widget>[
37-
Expanded(
38-
flex: 1,
39-
child: Text(
40-
shopItem.name,
41-
maxLines: 2,
42-
style: TextStyle(
43-
color: wood_smoke,
44-
fontSize: 21,
45-
fontWeight: FontWeight.w800),
34+
Padding(
35+
padding: const EdgeInsets.symmetric(vertical: 8.0),
36+
child: Row(
37+
mainAxisAlignment: MainAxisAlignment.start,
38+
crossAxisAlignment: CrossAxisAlignment.start,
39+
children: <Widget>[
40+
Expanded(
41+
flex: 1,
42+
child: Text(
43+
shopItem.name,
44+
maxLines: 2,
45+
style: TextStyle(
46+
color: wood_smoke,
47+
fontSize: 21,
48+
fontWeight: FontWeight.w800),
49+
),
4650
),
51+
Icon(
52+
Icons.favorite,
53+
color: shopItem.bgColor,
54+
)
55+
],
56+
),
57+
),
58+
Row(
59+
children: <Widget>[
60+
Text(
61+
"\$" + shopItem.price,
62+
style: TextStyle(
63+
color: wood_smoke,
64+
fontSize: 27,
65+
fontWeight: FontWeight.w800),
4766
),
48-
Icon(
49-
Icons.favorite,
50-
color: shopItem.bgColor,
51-
)
5267
],
53-
),
54-
),
55-
Row(
56-
children: <Widget>[
57-
Text(
58-
"\$" + shopItem.price,
59-
style: TextStyle(
60-
color: wood_smoke,
61-
fontSize: 27,
62-
fontWeight: FontWeight.w800),
63-
),
64-
],
65-
)
66-
],
68+
)
69+
],
70+
),
6771
),
6872
);
6973
}

0 commit comments

Comments
 (0)