#sprint-1

example/lib/main.dart

@@ -32,6 +32,7 @@ class MainApp extends StatelessWidget {
                 SearchSection(),
                 ButtonSection(),
                 SmallButtonSection(),
+                TabBarWidget(),
               ],
             ),
           ),

example/lib/tabbar_section.dart

@@ -0,0 +1,16 @@
+import 'package:flutter/material.dart';
+import 'package:ui_kit/ui_kit.dart';
+
+class TabBarSection extends StatefulWidget {
+  const TabBarSection({super.key});
+
+  @override
+  State<TabBarSection> createState() => _TabBarSectionState();
+}
+
+class _TabBarSectionState extends State<TabBarSection> {
+  @override
+  Widget build(BuildContext context) {
+    return TabBarWidget();
+  }
+}

lib/colors.dart

@@ -14,3 +14,4 @@ const placeholderColor = Color.fromRGBO(191, 199, 209, 1);
 const descColor = Color.fromRGBO(135, 135, 161, 1);
 const cardColor = Color.fromRGBO(135, 135, 161, 1);
 const captionColor = Color.fromRGBO(147, 147, 150, 1);
+const iconsColor = Color.fromRGBO(184, 193, 204, 1);

lib/tabbar.dart

@@ -0,0 +1,72 @@
+import 'package:flutter/material.dart';
+import 'package:ui_kit/colors.dart';
+import 'package:ui_kit/fonts.dart';
+
+class TabBarWidget extends StatefulWidget {
+  const TabBarWidget({super.key});
+
+  @override
+  State<TabBarWidget> createState() => _TabBarWidgetState();
+}
+
+class _TabBarWidgetState extends State<TabBarWidget> {
+  int _selectedIndex = 0;
+  void _onItemTapped(int index) {
+    setState(() {
+      _selectedIndex = index;
+    });
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return BottomNavigationBar(
+      showSelectedLabels: true,
+      showUnselectedLabels: true,
+      selectedLabelStyle: caption2Regular,
+      unselectedLabelStyle: caption2Regular,
+      type: BottomNavigationBarType.fixed,
+      unselectedItemColor: iconsColor,
+      items: <BottomNavigationBarItem>[
+        BottomNavigationBarItem(
+          icon: Image.asset('assets/home.png', width: 18, height: 20),
+          label: 'Главная',
+          activeIcon: Image.asset(
+            'assets/home-active.png',
+            width: 18,
+            height: 20,
+          ),
+        ),
+        BottomNavigationBarItem(
+          icon: Image.asset('assets/results.png', width: 18, height: 20),
+          label: 'Каталог',
+          activeIcon: Image.asset(
+            'assets/results-active.png',
+            width: 18,
+            height: 20,
+          ),
+        ),
+        BottomNavigationBarItem(
+          icon: Image.asset('assets/projects.png', width: 18, height: 20),
+          label: 'Проекты',
+          activeIcon: Image.asset(
+            'assets/projects-active.png',
+            width: 18,
+            height: 20,
+          ),
+        ),
+        BottomNavigationBarItem(
+          icon: Image.asset('assets/profile.png', width: 18, height: 20),
+          label: 'Профиль',
+          activeIcon: Image.asset(
+            'assets/profile-active.png',
+            width: 18,
+            height: 20,
+          ),
+        ),
+      ],
+      currentIndex: _selectedIndex,
+      selectedItemColor: primaryColor,
+      onTap: _onItemTapped,
+    );
+  }
+}

lib/ui_kit.dart

@@ -7,3 +7,4 @@ export 'utils.dart';
 export 'input.dart';
 export "search.dart";
 export 'button.dart';
+export 'tabbar.dart';