Merge pull request #6 from nathansdev/kit/shopping

fix: shopping screens

Author: nathansdev

lib/custom_widgets/button_plain.dart

@@ -7,25 +7,35 @@ class ButtonPlain extends StatelessWidget {
   final Color textColor;
   final double size;
   final String text;
+  final VoidCallback onTap;
+  final double height;
+  final double textSize;
 
   const ButtonPlain(
-      {this.color, this.textColor, this.borderColor, this.size, this.text});
+      {this.color,
+      this.textColor,
+      this.borderColor,
+      this.size,
+      this.text,
+      this.height,
+      this.textSize,
+      this.onTap});
 
   @override
   Widget build(BuildContext context) {
     return ButtonTheme(
-      height: 48,
+      height: height != null ? height : 48,
       minWidth: size != null ? size : MediaQuery.of(context).size.width,
       child: RaisedButton(
         padding: EdgeInsets.all(16),
         color: color,
-        onPressed: () {
-          Navigator.pushNamed(context, "/welcome_screen");
-        },
+        onPressed: onTap,
         textColor: textColor,
         child: Text(
           text,
-          style: TextStyle(fontSize: 12.0, fontWeight: FontWeight.w800),
+          style: TextStyle(
+              fontSize: textSize != null ? textSize : 12,
+              fontWeight: FontWeight.w800),
         ),
         shape: RoundedRectangleBorder(
             borderRadius: new BorderRadius.circular(16.0)),

lib/custom_widgets/cart_add_remove_button.dart

@@ -17,30 +17,33 @@ class _CartAddRemoveButtonState extends State<CartAddRemoveButton> {
   }
 
   void onAddClicked() {
-    setState(() {
-      count = count + 1;
-      print("add clicked " + count.toString());
-    });
+    if (count < 4)
+      setState(() {
+        count = count + 1;
+        print("add clicked " + count.toString());
+      });
   }
 
   void onRemoveClicked() {
-    setState(() {
-      count = count - 1;
-      print("remove clicked " + count.toString());
-    });
+    if (count > 0)
+      setState(() {
+        count = count - 1;
+        print("remove clicked " + count.toString());
+      });
   }
 
   @override
   Widget build(BuildContext context) {
     return Container(
       width: 96,
-      height: 36,
+      height: 40,
       decoration: ShapeDecoration(
           shape: RoundedRectangleBorder(
               borderRadius: BorderRadius.all(Radius.circular(10)),
               side: BorderSide(color: wood_smoke, width: 2))),
       child: Row(
         mainAxisSize: MainAxisSize.max,
+        crossAxisAlignment: CrossAxisAlignment.center,
         children: <Widget>[
           count == 0
               ? SizedBox()
@@ -50,24 +53,31 @@ class _CartAddRemoveButtonState extends State<CartAddRemoveButton> {
                     onTap: () {
                       onRemoveClicked();
                     },
-                    child: Center(
-                      child: IconButton(
-                        alignment: Alignment.topCenter,
-                        icon: Icon(Icons.remove),
-                        onPressed: () {
-                          onRemoveClicked();
-                        },
+                    child: IconButton(
+                      icon: Icon(
+                        Icons.remove,
+                        size: 24,
                       ),
+                      onPressed: () {
+                        onRemoveClicked();
+                      },
                     ),
                   ),
                 ),
           count == 0
               ? Expanded(
                   flex: 2,
                   child: Container(
+                      padding: EdgeInsets.symmetric(horizontal: 8),
                       alignment: Alignment.center,
                       height: MediaQuery.of(context).size.height,
-                      color: lightening_yellow,
+                      decoration: ShapeDecoration(
+                        color: lightening_yellow,
+                        shape: RoundedRectangleBorder(
+                            borderRadius: BorderRadius.only(
+                                topLeft: Radius.circular(10),
+                                bottomLeft: Radius.circular(10))),
+                      ),
                       child: Text(
                         "Add",
                         textAlign: TextAlign.center,
@@ -79,6 +89,7 @@ class _CartAddRemoveButtonState extends State<CartAddRemoveButton> {
               : Expanded(
                   flex: 1,
                   child: Container(
+                      padding: EdgeInsets.symmetric(horizontal: 8),
                       alignment: Alignment.center,
                       height: MediaQuery.of(context).size.height,
                       color: lightening_yellow,
@@ -95,19 +106,14 @@ class _CartAddRemoveButtonState extends State<CartAddRemoveButton> {
               onTap: () {
                 onAddClicked();
               },
-              child: Container(
-                alignment: Alignment.topCenter,
-                color: white,
-                height: MediaQuery.of(context).size.height,
-                child: Center(
-                  child: IconButton(
-                    alignment: Alignment.topCenter,
-                    icon: Icon(Icons.add),
-                    onPressed: () {
-                      onAddClicked();
-                    },
-                  ),
+              child: IconButton(
+                icon: Icon(
+                  Icons.add,
+                  size: 24,
                 ),
+                onPressed: () {
+                  onAddClicked();
+                },
               ),
             ),
           )

lib/custom_widgets/chip_widget.dart

@@ -0,0 +1,38 @@
+import 'package:contraflutterkit/utils/colors.dart';
+import 'package:flutter/cupertino.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_svg/flutter_svg.dart';
+
+class ChipWidget extends StatelessWidget {
+  final String text;
+  final bool selected;
+  final VoidCallback onTap;
+
+  const ChipWidget({this.text, this.selected, this.onTap});
+
+  @override
+  Widget build(BuildContext context) {
+    return GestureDetector(
+      onTap: onTap,
+      child: Container(
+          height: 48,
+          padding: EdgeInsets.all(12),
+          child: Row(
+            mainAxisSize: MainAxisSize.min,
+            children: <Widget>[
+              Text(
+                text,
+                style:
+                    TextStyle(color: wood_smoke, fontWeight: FontWeight.bold),
+              ),
+              selected ? SvgPicture.asset("assets/icons/close.svg") : SizedBox()
+            ],
+          ),
+          decoration: ShapeDecoration(
+              color: selected ? pastel_pink : white,
+              shape: RoundedRectangleBorder(
+                  borderRadius: BorderRadius.all(Radius.circular(44)),
+                  side: BorderSide(color: wood_smoke, width: 2)))),
+    );
+  }
+}

lib/custom_widgets/chips_filter_widget.dart

@@ -1,3 +1,4 @@
+import 'package:contraflutterkit/custom_widgets/chip_widget.dart';
 import 'package:contraflutterkit/utils/colors.dart';
 import 'package:flutter/cupertino.dart';
 import 'package:flutter/material.dart';
@@ -28,10 +29,22 @@ class _ChipsFilterWidgetState extends State<ChipsFilterWidget> {
       padding: const EdgeInsets.only(right: 16.0, top: 16.0),
       child: Wrap(
         spacing: 12,
+        runSpacing: 12,
         children: List<Widget>.generate(
           options.length,
           (int index) {
-            return ChoiceChip(
+            return ChipWidget(
+              selected: selectedChoices.contains(index),
+              text: options[index],
+              onTap: () {
+                setState(() {
+                  selectedChoices.contains(index)
+                      ? selectedChoices.remove(index)
+                      : selectedChoices.add(index);
+                });
+              },
+            );
+            ChoiceChip(
               disabledColor: white,
               selectedColor: pastel_pink,
               padding: EdgeInsets.all(12),

lib/custom_widgets/color_widget.dart

@@ -1,14 +1,14 @@
-import 'package:contraflutterkit/utils/colors.dart';
 import 'package:flutter/cupertino.dart';
 
 class ColorWidget extends StatelessWidget {
   final Color borderColor;
   final Color shadowColor;
+  final Color bgColor;
   final bool selected;
   final VoidCallback onTap;
 
   const ColorWidget(
-      {this.borderColor, this.shadowColor, this.selected, this.onTap});
+      {this.borderColor,this.bgColor, this.shadowColor, this.selected, this.onTap});
 
   @override
   Widget build(BuildContext context) {
@@ -27,7 +27,7 @@ class ColorWidget extends StatelessWidget {
                 ),
               )
             ],
-            color: selected ? lightening_yellow : white,
+            color: bgColor,
             shape:
                 CircleBorder(side: BorderSide(color: borderColor, width: 2))),
       ),

lib/custom_widgets/colors_select_widget.dart

@@ -27,13 +27,14 @@ class _ColorsSelectWidgetState extends State<ColorsSelectWidget> {
   @override
   Widget build(BuildContext context) {
     return Padding(
-      padding: const EdgeInsets.only( right: 16.0, top: 16.0),
+      padding: const EdgeInsets.only(right: 16.0, top: 16.0),
       child: Wrap(
         spacing: 12,
         children: List<Widget>.generate(
           options.length,
           (int index) {
             return ColorWidget(
+              bgColor: options[index],
               borderColor: wood_smoke,
               shadowColor: wood_smoke,
               selected: selectedChoices.contains(index),

lib/main.dart

@@ -10,6 +10,7 @@ import 'package:contraflutterkit/onboarding/type3/pager.dart';
 import 'package:contraflutterkit/onboarding/welcome_screen.dart';
 import 'package:contraflutterkit/shopping/shopping_detail_page_one.dart';
 import 'package:contraflutterkit/shopping/shopping_detail_page_two.dart';
+import 'package:contraflutterkit/shopping/shopping_home_page.dart';
 import 'package:contraflutterkit/shopping/shopping_home_page_one.dart';
 import 'package:contraflutterkit/shopping/shopping_home_page_two.dart';
 import 'package:contraflutterkit/shopping/shopping_list_page_type_one.dart';
@@ -63,10 +64,11 @@ class MyApp extends StatelessWidget {
         '/shopping_main_page': (context) => ShoppingMainPage(),
         '/shopping_list_page_one': (context) => ShoppingListPageOne(),
         '/shopping_list_page_two': (context) => ShoppingListPageTwo(),
+        '/shopping_home_page': (context) => ShoppingHomePage(),
         '/shopping_home_page_one': (context) => ShoppingHomePageOne(),
         '/shopping_home_page_two': (context) => ShoppingHomePageTwo(),
-        '/shopping_home_main_one': (context) => ShoppingDetailPageOne(),
-        '/shopping_home_main_two': (context) => ShoppingDetailPageTwo(),
+        '/shopping_detail_page_one': (context) => ShoppingDetailPageOne(),
+        '/shopping_detail_page_two': (context) => ShoppingDetailPageTwo(),
       },
     );
   }