Final version of the app was added

lab4.iml

@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<module type="JAVA_MODULE" version="4">
+  <component name="NewModuleRootManager" inherit-compiler-output="true">
+    <exclude-output />
+    <content url="file://$MODULE_DIR$">
+      <sourceFolder url="file://$MODULE_DIR$/lib" isTestSource="false" />
+      <sourceFolder url="file://$MODULE_DIR$/test" isTestSource="true" />
+      <excludeFolder url="file://$MODULE_DIR$/.dart_tool" />
+      <excludeFolder url="file://$MODULE_DIR$/.idea" />
+      <excludeFolder url="file://$MODULE_DIR$/.pub" />
+      <excludeFolder url="file://$MODULE_DIR$/build" />
+    </content>
+    <orderEntry type="sourceFolder" forTests="false" />
+    <orderEntry type="library" name="Dart SDK" level="project" />
+    <orderEntry type="library" name="Flutter Plugins" level="project" />
+    <orderEntry type="library" name="Dart Packages" level="project" />
+  </component>
+</module>

lib/category.dart

@@ -0,0 +1,13 @@
+class Category {
+  String name;
+  int price;
+  String imgName;
+  List<Category> subCategories;
+
+  Category({
+    required this.name,
+    required this.price,
+    required this.imgName,
+    required this.subCategories,
+  });
+}

lib/item_page.dart

@@ -1,8 +1,94 @@
 import 'package:flutter/material.dart';
+import 'package:lab4/navigation_bar.dart';
+import 'package:lab4/category.dart';
+import 'package:lab4/state.dart';
+import 'package:provider/provider.dart';
 
 class ItemPage extends StatelessWidget {
+  Category? selectedCategory;
+
+  ItemPage({Key? key, this.selectedCategory}) : super(key: key);
+
   @override
   Widget build(BuildContext context) {
-    return Scaffold(body: Text("Item"));
+    return Consumer<CartModel>(
+        builder: (context, cart, child) => Scaffold(
+              extendBodyBehindAppBar: true,
+              appBar: AppBar(
+                elevation: 0,
+                backgroundColor: Colors.transparent,
+                leading: Padding(
+                  padding: const EdgeInsets.all(8),
+                  child: IconButton(
+                    onPressed: () {
+                      Navigator.pop(context);
+                    },
+                    icon: const Icon(Icons.arrow_back_ios_outlined,
+                        color: Colors.black),
+                  ),
+                ),
+              ),
+              body: Center(
+                child: Container(
+                  color: Colors.amber[50],
+                  padding: const EdgeInsets.only(
+                    top: 40,
+                    left: 30,
+                    right: 30,
+                  ),
+                  child: Column(
+                    children: [
+                      const Padding(padding: EdgeInsets.only(top: 100)),
+                      Column(
+                        children: [
+                          Image.asset(selectedCategory!.imgName + '.jpg'),
+                          const Padding(padding: EdgeInsets.only(top: 20)),
+                          Row(
+                            mainAxisAlignment: MainAxisAlignment.spaceBetween,
+                            children: [
+                              Text(
+                                selectedCategory!.name,
+                                style: const TextStyle(
+                                    fontWeight: FontWeight.bold, fontSize: 20),
+                              ),
+                              Text(
+                                selectedCategory!.price.toString() +
+                                    " " +
+                                    "USD",
+                                style: const TextStyle(
+                                    color: Colors.green, fontSize: 20),
+                              ),
+                            ],
+                          ),
+                          const Padding(padding: EdgeInsets.only(top: 20)),
+                          Row(
+                            children: const [
+                              Text('Lorem ipsum lorem \nipsum'),
+                            ],
+                          ),
+                          const Padding(padding: EdgeInsets.only(top: 100)),
+                          Center(
+                            child: ElevatedButton.icon(
+                                style: ElevatedButton.styleFrom(
+                                  shape: RoundedRectangleBorder(
+                                      borderRadius: BorderRadius.circular(10)),
+                                ),
+                                onPressed: () {
+                                  cart.add(selectedCategory!);
+                                },
+                                icon: const Icon(Icons.shopping_bag_outlined),
+                                label: const Text(
+                                  'Add To Bag',
+                                  style: TextStyle(fontSize: 24),
+                                )),
+                          )
+                        ],
+                      ),
+                    ],
+                  ),
+                ),
+              ),
+              bottomNavigationBar: NavigationBar(),
+            ));
   }
 }

lib/main.dart

@@ -1,8 +1,15 @@
 import 'package:flutter/material.dart';
 import 'package:lab4/explore_page.dart';
+import 'package:lab4/state.dart';
+import 'package:provider/provider.dart';
 
 void main() {
-  runApp(const MyApp());
+  runApp(
+    ChangeNotifierProvider(
+      create: (context) => CartModel(),
+      child: const MyApp(),
+    ),
+  );
 }
 
 class MyApp extends StatelessWidget {

lib/my_bag_page.dart

@@ -1,8 +1,137 @@
 import 'package:flutter/material.dart';
+import 'package:lab4/category.dart';
+import 'package:lab4/navigation_bar.dart';
+import 'package:lab4/state.dart';
+import 'package:provider/provider.dart';
 
 class MyBag extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
-    return Scaffold(body: Text("My Bag"));
+    return Consumer<CartModel>(
+        builder: (context, cart, child) => Scaffold(
+              resizeToAvoidBottomInset: true,
+              body: SafeArea(
+                child: Column(
+                  crossAxisAlignment: CrossAxisAlignment.start,
+                  children: [
+                    Expanded(
+                      child: Padding(
+                        padding: const EdgeInsets.symmetric(horizontal: 16.0),
+                        child: Column(
+                          crossAxisAlignment: CrossAxisAlignment.start,
+                          children: [
+                            Container(
+                              padding: const EdgeInsets.all(20),
+                              alignment: Alignment.centerRight,
+                              width: MediaQuery.of(context).size.width,
+                              // height: MediaQuery.of(context).size.height-90,
+                              child: Row(
+                                children: [
+                                  Expanded(child: Container()),
+                                  const Icon(
+                                    Icons.search,
+                                    size: 30,
+                                    color: Colors.black,
+                                  ),
+                                  const SizedBox(
+                                    width: 15,
+                                  ),
+                                  const Icon(Icons.add_alert_outlined,
+                                      size: 30, color: Colors.black),
+                                ],
+                              ),
+                            ),
+                            const Text(
+                              "My bag",
+                              style: TextStyle(
+                                fontSize: 28,
+                                fontWeight: FontWeight.w800,
+                              ),
+                            ),
+                            Expanded(
+                              child: ListView(
+                                children: cart.items
+                                    .map((e) => _renderItem(e, context))
+                                    .toList(),
+                              ),
+                            ),
+                          ],
+                        ),
+                      ),
+                    ),
+                    NavigationBar()
+                  ],
+                ),
+              ),
+            ));
+  }
+
+  Widget _renderItem(Category category, BuildContext context) {
+    return Consumer<CartModel>(
+        builder: (context, cart, child) => Container(
+              padding: const EdgeInsets.all(10),
+              height: MediaQuery.of(context).size.height / 4,
+              decoration: const BoxDecoration(
+                  borderRadius: BorderRadius.all(
+                Radius.circular(10),
+              )),
+              child: Row(
+                children: [
+                  Expanded(
+                    child: Container(
+                      height: MediaQuery.of(context).size.height / 4,
+                      // color: Colors.blue,
+                      child: ClipRRect(
+                        borderRadius: BorderRadius.all(Radius.circular(10)),
+                        child: Image.asset(
+                          category.imgName + ".jpg",
+                          fit: BoxFit.cover,
+                        ),
+                      ),
+                    ),
+                  ),
+                  Expanded(
+                    child: Padding(
+                      padding: const EdgeInsets.all(8.0),
+                      child: Column(
+                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
+                        crossAxisAlignment: CrossAxisAlignment.end,
+                        children: [
+                          Column(
+                            crossAxisAlignment: CrossAxisAlignment.start,
+                            children: [
+                              Text(
+                                category.name,
+                                style: const TextStyle(
+                                  fontSize: 18,
+                                  fontWeight: FontWeight.w600,
+                                ),
+                              ),
+                              const Text("Description: Lorem ipsum"),
+                              Text(
+                                category.price.toString() + "\$",
+                                style: TextStyle(
+                                  fontSize: 20,
+                                  color: Colors.orangeAccent,
+                                ),
+                              ),
+                            ],
+                          ),
+                          IconButton(
+                            icon: Icon(
+                              Icons.delete_forever_rounded,
+                              size: 40,
+                            ),
+                            onPressed: () {
+                              cart.remove(category);
+                            },
+                          )
+                        ],
+                      ),
+                    ),
+                  )
+                ],
+              ),
+            ));
   }
 }

lib/navigation_bar.dart

@@ -0,0 +1,58 @@
+import 'package:flutter/cupertino.dart';
+import 'package:flutter/material.dart';
+import 'package:lab4/explore_page.dart';
+import 'package:lab4/my_bag_page.dart';
+
+class NavigationBar extends StatelessWidget {
+  const NavigationBar({Key? key}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    return Container(
+      color: Colors.white,
+      height: 90,
+      padding: const EdgeInsets.only(bottom: 20),
+      child: Row(
+        mainAxisAlignment: MainAxisAlignment.spaceAround,
+        children: [
+          Material(
+            child: Column(
+              children: [
+                IconButton(
+                  icon: const Icon(Icons.home_outlined),
+                  onPressed: () => {
+                    Navigator.push(
+                      context,
+                      MaterialPageRoute(builder: (context) {
+                        return const ExplorePage();
+                      }),
+                    )
+                  },
+                ),
+                const Text("Home")
+              ],
+            ),
+          ),
+          Material(
+            child: Column(
+              children: [
+                IconButton(
+                  icon: const Icon(Icons.shopping_bag),
+                  onPressed: () => {
+                    Navigator.push(
+                      context,
+                      MaterialPageRoute(builder: (context) {
+                        return MyBag();
+                      }),
+                    )
+                  },
+                ),
+                const Text("My Bag"),
+              ],
+            ),
+          ),
+        ],
+      ),
+    );
+  }
+}

lib/state.dart

@@ -0,0 +1,26 @@
+import 'dart:collection';
+
+import 'package:lab4/category.dart';
+
+import 'package:flutter/foundation.dart' as foundation;
+
+class CartModel extends foundation.ChangeNotifier {
+  final Set<Category> _items = {};
+
+  UnmodifiableSetView<Category> get items => UnmodifiableSetView(_items);
+
+  void add(Category category) {
+    _items.add(category);
+    notifyListeners();
+  }
+
+  void remove(Category category) {
+    _items.remove(category);
+    notifyListeners();
+  }
+
+  void removeAll() {
+    _items.clear();
+    notifyListeners();
+  }
+}