feat: search screen

lib/utils/item_list.dart

@@ -0,0 +1,55 @@
+import 'package:flutter/material.dart';
+
+class Item extends StatelessWidget {
+  final String child;
+
+  const Item({super.key, required this.child});
+
+  @override
+  Widget build(BuildContext context) {
+    return Container(
+      margin: const EdgeInsets.all(16.0),
+      height: 90,
+      width: 90,
+      decoration: const BoxDecoration(
+        color: Color(0xFFF2F2F2),
+        borderRadius: BorderRadiusDirectional.all(
+          Radius.circular(4),
+        ),
+      ),
+      child: Center(
+        child: Text(
+          child,
+          style: const TextStyle(
+            fontSize: 14.0,
+            color: Color(0xFF4B64F2),
+          ),
+        ),
+      ),
+    );
+  }
+}
+
+class ItemList extends StatefulWidget {
+  final List items;
+  const ItemList({super.key, required this.items});
+
+  @override
+  State<ItemList> createState() => _ItemListState();
+}
+
+class _ItemListState extends State<ItemList> {
+  @override
+  Widget build(BuildContext context) {
+    return Expanded(
+      child: ListView.builder(
+        itemCount: widget.items.length,
+        itemBuilder: (context, index) {
+          return Item(child: widget.items[index]);
+        },
+        scrollDirection: Axis.horizontal,
+        padding: const EdgeInsets.all(8),
+      ),
+    );
+  }
+}

lib/views/search_view.dart

@@ -0,0 +1,103 @@
+import 'package:flutter/material.dart';
+
+import '../utils/item_list.dart';
+
+class SearchScreen extends StatelessWidget {
+  SearchScreen({super.key});
+
+  final List _genders = [
+    'Male',
+    'Unisex',
+    'Female',
+  ];
+
+  final List _brands = [
+    'Gucci',
+    'Nike',
+    'Adidas',
+    'Puma',
+    'Ralph Lauren',
+    'Tommy Hilfiger',
+  ];
+
+  final List _styles = [
+    'Sports',
+    'Elegant',
+    'Casual',
+    'Oversize',
+    'Fashion',
+    'Vintage',
+  ];
+
+  final List _types = [
+    'T-shirts',
+    'Shirts',
+    'Suits',
+    'Jeans',
+    'Joggers',
+    'Shorts',
+  ];
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      appBar: AppBar(
+        title: const Text(
+          'Fitster',
+        ),
+      ),
+      body: Column(
+        mainAxisAlignment: MainAxisAlignment.spaceEvenly,
+        crossAxisAlignment: CrossAxisAlignment.start,
+        children: [
+          const Padding(
+            padding: EdgeInsets.all(16.0),
+            child: SearchBar(
+              leading: Icon(
+                Icons.search,
+              ),
+              hintText: 'Search...',
+            ),
+          ),
+          ItemList(items: _genders),
+          const Padding(
+            padding: EdgeInsets.only(left: 16.0),
+            child: Text(
+              'Brands',
+              style: TextStyle(
+                fontSize: 16,
+                fontWeight: FontWeight.w600,
+                color: Color(0xFF4B64F2),
+              ),
+            ),
+          ),
+          ItemList(items: _brands),
+          const Padding(
+            padding: EdgeInsets.only(left: 16.0),
+            child: Text(
+              'Styles',
+              style: TextStyle(
+                fontSize: 16,
+                fontWeight: FontWeight.w600,
+                color: Color(0xFF4B64F2),
+              ),
+            ),
+          ),
+          ItemList(items: _styles),
+          const Padding(
+            padding: EdgeInsets.only(left: 16.0),
+            child: Text(
+              'Types',
+              style: TextStyle(
+                fontSize: 16,
+                fontWeight: FontWeight.w600,
+                color: Color(0xFF4B64F2),
+              ),
+            ),
+          ),
+          ItemList(items: _types),
+        ],
+      ),
+    );
+  }
+}