apoloz/eatvio_app_old
1
0
Fork 0
Code Pull Requests Actions Activity

feat(app): Created a navbar by new design and added logic for existing screens.

Browse Source
This commit is contained in:
maxxkim
2024-04-17 18:33:30 +03:00
parent 146a1ba136
commit ca74cc80a1
7 changed files with 111 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
assets/images/img_nav_bell.svg Normal file
View File

@@ -0,0 +1,3 @@
<svg width="20" height="26" viewBox="0 0 20 26" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M9.35574 0.0773487C8.44252 0.298117 7.72096 0.966084 7.40528 1.88312C7.30944 2.1605 7.29253 2.35863 7.29253 3.16811V4.11912L7.14033 4.18138C7.05577 4.20969 6.78519 4.33988 6.53715 4.47008C4.44576 5.52864 2.90681 7.63443 2.53475 9.94968C2.48966 10.244 2.33182 11.7328 2.17961 13.2499L1.90903 16.0123L1.59898 16.1878C0.90561 16.5784 0.268609 17.4445 0.0713075 18.271C-0.0357989 18.7125 -0.0188873 19.5276 0.0994934 19.9409C0.42645 21.0504 1.22129 21.8769 2.3149 22.2448C2.67568 22.3637 2.80534 22.3693 4.68816 22.392L6.67244 22.409V22.7429C6.67244 23.5581 7.02195 24.3959 7.61949 25.0016C8.04228 25.4318 8.43688 25.6752 9.01187 25.862C9.56431 26.0488 10.4832 26.0432 11.0131 25.862C12.3942 25.3808 13.3243 24.1242 13.3243 22.7429V22.4033H15.1282C17.2252 22.4033 17.5409 22.3637 18.2512 21.9901C19.0404 21.5825 19.6323 20.8409 19.8973 19.9409C20.0495 19.4088 20.0326 18.588 19.8465 18.0162C19.5872 17.2294 19.0517 16.5558 18.3696 16.1708L18.0877 16.0123L17.8171 13.2499C17.6649 11.7328 17.5071 10.244 17.4564 9.94968C17.2703 8.80621 16.7517 7.58915 16.0527 6.65513C15.286 5.62487 14.0571 4.66255 12.941 4.21535L12.7042 4.11912V3.19075C12.7042 2.42655 12.6817 2.20012 12.5915 1.90577C12.1743 0.54719 10.7425 -0.262297 9.35574 0.0773487ZM10.2971 1.93407C10.7256 2.11521 10.8947 2.48882 10.9003 3.2417V3.63795H9.99838H9.09643V3.2417C9.10207 2.50014 9.27118 2.12087 9.68833 1.93407C9.90818 1.83784 10.0717 1.83784 10.2971 1.93407ZM10.844 5.5626C12.7324 5.8513 14.3728 7.07968 15.162 8.78922C15.5566 9.64966 15.6074 9.94402 15.9456 13.3065C16.1147 15.0274 16.2726 16.5048 16.2895 16.601C16.3797 17.0426 16.701 17.4219 17.1971 17.6709C17.7946 17.9709 18.1103 18.4408 18.1159 19.0352C18.1159 19.4767 17.9355 19.873 17.6029 20.156C17.1407 20.5579 17.5466 20.5353 9.99838 20.5353C2.24162 20.5353 2.7997 20.5692 2.29236 20.0598C1.80756 19.5729 1.71173 18.9955 2.02741 18.3785C2.17961 18.0728 2.4051 17.869 2.80534 17.6653C3.29577 17.4219 3.61709 17.0426 3.70729 16.601C3.7242 16.5048 3.88204 15.0274 4.05115 13.3065C4.38939 9.94402 4.44012 9.64966 4.83472 8.78922C5.61265 7.10232 7.27562 5.84564 9.12461 5.55694C9.73907 5.46071 10.2126 5.46071 10.844 5.5626ZM11.464 22.6467C11.464 23.2071 11.154 23.7166 10.6523 23.9713C9.69961 24.4751 8.53271 23.7449 8.53271 22.6467V22.4033H9.99838H11.464V22.6467Z" fill="#7B8794"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.4 KiB

0
assets/images/img_nav_blue_gray_400_24x25.svg → assets/images/img_nav_chat.svg
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.3 KiB

After

Width:  |  Height:  |  Size: 2.3 KiB

0
assets/images/img_nav.svg → assets/images/img_nav_diary.svg
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1016 B

After

Width:  |  Height:  |  Size: 1016 B

7
assets/images/img_nav_feed.svg Normal file
View File

@@ -0,0 +1,7 @@
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M2.20343 0.061348C1.644 0.21007 0.70593 0.868757 0.467242 1.35954C0.217366 1.87263 0.0332161 1.50954 0.0332161 9.58142C0.0332161 16.7721 -0.0414616 17.0806 0.0331284 17.3706C0.130095 17.7498 0.243422 18.4085 0.467192 18.6688C0.896085 19.167 2.04446 19.8182 2.63745 19.967C2.92835 20.0413 3.16171 19.967 10.0165 19.967C16.8714 19.967 17.1047 20.0413 17.3956 19.9669C17.556 19.9261 18.0698 19.6309 18.2637 19.5342C18.5658 19.3855 18.8111 19.4212 19.1319 19.1015C19.4526 18.7817 19.4168 18.5372 19.5659 18.236C19.9165 17.5296 20 17.8584 20 10.8796C20 4.06443 19.8345 4.47273 19.5659 3.95592C19.3795 3.60271 18.7363 3.27149 18.3969 3.1079C17.9307 2.88481 17.8673 2.87738 16.2562 2.87738H14.7905V2.60596C14.7905 1.66158 13.9986 0.306738 13.055 0.061348C12.738 -0.0204487 2.50925 -0.0204487 2.20343 0.061348ZM13.0078 1.8103C13.2465 1.92556 13.3844 2.07056 13.5001 2.31967L13.5784 2.48698L13.597 9.83012L13.6157 17.1733L13.7052 17.4335C13.7947 17.7012 13.9439 18.0098 14.0856 18.2255L14.1639 18.3482L8.67036 18.337L3.17307 18.3259L2.94184 18.2478C2.36377 18.047 1.92369 17.6008 1.7484 17.0245C1.685 16.8126 1.68127 16.4705 1.68127 9.66281C1.68127 3.89612 1.69246 2.49814 1.72976 2.38659C1.8491 2.05569 2.14746 1.79543 2.48685 1.7285C2.57635 1.70991 4.9334 1.69876 7.72307 1.69876L12.7952 1.70619L13.0078 1.8103ZM17.8297 3.95592C18.0796 4.07118 18.1481 4.1507 18.2637 4.38865V4.82138V10.8796C18.2637 16.5533 18.3271 16.7259 18.2637 16.9378C18.0251 17.7112 17.3713 18.3073 16.5844 18.3073C15.8049 18.3073 15.4864 17.6963 15.2253 16.9378V10.4469V4.45592C15.2253 4.17978 15.4492 3.95592 15.7253 3.95592H16.0934C17.4137 3.96708 17.6693 3.88156 17.8297 3.95592Z" fill="#7B8794"/>
<path d="M3.12399 2.9518C3.05686 2.9927 2.97108 3.07821 2.93006 3.14514C2.8592 3.26411 2.85547 3.33848 2.85547 5.25699C2.85547 7.1755 2.8592 7.24986 2.93006 7.36884C2.97108 7.43576 3.05686 7.52128 3.12399 7.56217C3.24334 7.63282 3.31793 7.63654 5.24235 7.63654C7.16677 7.63654 7.24136 7.63282 7.36071 7.56217C7.42784 7.52128 7.51362 7.43576 7.55464 7.36884C7.6255 7.24986 7.62923 7.1755 7.62923 5.25699C7.62923 3.33848 7.6255 3.26411 7.55464 3.14514C7.51362 3.07821 7.42784 2.9927 7.36071 2.9518C7.24136 2.88116 7.16677 2.87744 5.24235 2.87744C3.31793 2.87744 3.24334 2.88116 3.12399 2.9518ZM6.43579 5.25699V6.44676H5.24235H4.04891V5.25699V4.06721H5.24235H6.43579V5.25699Z" fill="#7B8794"/>
<path d="M3.22842 9.23893C2.99346 9.33188 2.85547 9.55497 2.85547 9.83382C2.85547 10.0755 2.95989 10.2502 3.15756 10.3506C3.29555 10.425 3.39625 10.425 7.63669 10.425H11.9741L12.1158 10.3395C12.3247 10.2131 12.403 10.0755 12.403 9.82638C12.403 9.59586 12.3209 9.43599 12.1307 9.2947C12.0263 9.21662 12.0226 9.21662 7.67398 9.20919C4.8321 9.20547 3.28809 9.21662 3.22842 9.23893Z" fill="#7B8794"/>
<path d="M3.22842 12.2134C2.99346 12.3064 2.85547 12.5295 2.85547 12.8083C2.85547 13.05 2.95989 13.2247 3.15756 13.3251C3.29555 13.3995 3.39625 13.3995 7.63669 13.3995H11.9741L12.1158 13.314C12.3247 13.1875 12.403 13.05 12.403 12.8009C12.403 12.5704 12.3209 12.4105 12.1307 12.2692C12.0263 12.1911 12.0226 12.1911 7.67398 12.1837C4.8321 12.18 3.28809 12.1911 3.22842 12.2134Z" fill="#7B8794"/>
<path d="M3.22842 15.1878C2.99346 15.2808 2.85547 15.5039 2.85547 15.7827C2.85547 16.0244 2.95989 16.1992 3.15756 16.2995C3.29555 16.3739 3.39625 16.3739 7.63669 16.3739H11.9741L12.1158 16.2884C12.3247 16.162 12.403 16.0244 12.403 15.7753C12.403 15.5448 12.3209 15.3849 12.1307 15.2436C12.0263 15.1655 12.0226 15.1655 7.67398 15.1581C4.8321 15.1544 3.28809 15.1655 3.22842 15.1878Z" fill="#7B8794"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 3.6 KiB

4
assets/images/img_nav_logo.svg Normal file
View File

@@ -0,0 +1,4 @@
<svg width="44" height="40" viewBox="0 0 44 40" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M21.8819 0C33.9607 0 43.75 5.40314 43.75 17.7173C43.75 30.0175 33.9607 40 21.8819 40C9.78925 40 0 30.0175 0 17.7173C0 5.40314 9.78925 0 21.8819 0Z" fill="#43A6F2"/>
<path fill-rule="evenodd" clip-rule="evenodd" d="M21.8083 25.9799C18.9151 25.9799 16.0764 25.4103 13.4289 24.311C10.7813 23.1984 8.39309 21.5692 6.41425 19.5295C5.49989 18.6023 5.55448 17.1189 6.50978 16.2447C7.47873 15.3573 8.99357 15.4103 9.90793 16.3374C11.4364 17.9136 13.2788 19.1719 15.3259 20.0196C17.3729 20.8805 19.5701 21.3176 21.8083 21.3176C24.0327 21.3176 26.2299 20.8805 28.277 20.0196C30.3241 19.1719 32.1665 17.9136 33.6949 16.3374C34.6093 15.4103 36.1241 15.3573 37.0931 16.2447C38.0484 17.1189 38.103 18.6023 37.1886 19.5295C35.2098 21.5692 32.8215 23.1984 30.174 24.311C27.5264 25.4103 24.6878 25.9799 21.8083 25.9799Z" fill="white"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 971 B

10
lib/core/utils/image_constant.dart
View File

@@ -79,7 +79,15 @@ class ImageConstant {
static String imgEllipse3 = '$imagePath/img_ellipse_3.png';
static String imgNav = '$imagePath/img_nav.svg';
static String imgDiary = '$imagePath/img_nav_diary.svg';
static String imgFeed = '$imagePath/img_nav_feed.svg';
static String imgChat = '$imagePath/img_nav_chat.svg';
static String imgLogo = '$imagePath/img_nav_logo.svg';
static String imgBell = '$imagePath/img_nav_bell.svg';
static String imgNavBlueGray400 = '$imagePath/img_nav_blue_gray_400.svg';

139
lib/widgets/custom_bottom_bar.dart
View File

@@ -1,5 +1,6 @@
import 'package:eatvio_app/core/app_export.dart';
import 'package:flutter/material.dart';
import 'package:eatvio_app/widgets/app_bar/appbar_title_circleimage.dart';
// ignore: must_be_immutable
class CustomBottomBar extends StatefulWidget {
@@ -16,41 +17,45 @@ class CustomBottomBarState extends State<CustomBottomBar> {
List<BottomMenuModel> bottomMenuList = [
BottomMenuModel(
icon: ImageConstant.imgNav,
activeIcon: ImageConstant.imgNav,
title: "diary".tr,
type: BottomBarEnum.tf,
),
/*BottomMenuModel(
icon: ImageConstant.imgNavBlueGray400,
activeIcon: ImageConstant.imgNavBlueGray400,
title: "my_blog".tr,
type: BottomBarEnum.tf,
),*/
icon: ImageConstant.imgLogo,
activeIcon: ImageConstant.imgLogo,
type: BottomBarEnum.tf,
image: false),
BottomMenuModel(
icon: ImageConstant.imgNavBlueGray40024x23,
activeIcon: ImageConstant.imgNavBlueGray40024x23,
title: "profile".tr,
type: BottomBarEnum.tf,
),
icon: ImageConstant.imgFeed,
activeIcon: ImageConstant.imgFeed,
title: "Лента",
type: BottomBarEnum.tf,
image: false),
BottomMenuModel(
icon: ImageConstant.imgNavPrimary,
activeIcon: ImageConstant.imgNavBlueGray40024x23,
title: "Настройки",
type: BottomBarEnum.tf,
),
icon: ImageConstant.imgDiary,
activeIcon: ImageConstant.imgDiary,
title: "diary".tr,
type: BottomBarEnum.tf,
image: false),
BottomMenuModel(
icon: ImageConstant.imgNavBlueGray40024x25,
activeIcon: ImageConstant.imgNavBlueGray40024x25,
title: "chat".tr,
icon: ImageConstant.imgChat,
activeIcon: ImageConstant.imgChat,
title: "chat".tr,
type: BottomBarEnum.tf,
image: false),
BottomMenuModel(
icon: ImageConstant.imgBell,
activeIcon: ImageConstant.imgBell,
type: BottomBarEnum.tf,
image: false),
BottomMenuModel(
icon: ImageConstant.imgEllipse1,
activeIcon: ImageConstant.imgEllipse1,
type: BottomBarEnum.tf,
)
image: true,
),
];
@override
Widget build(BuildContext context) {
return Container(
height: 80.v,
height: 83.v,
decoration: BoxDecoration(
border: Border.all(
color: appTheme.whiteA700,
@@ -78,20 +83,23 @@ class CustomBottomBarState extends State<CustomBottomBar> {
switch (index) {
case 0:
Navigator.pushNamed(context, AppRoutes.diaryEdit);
break;
/*case 1:
Navigator.pushNamed(context, '/my_blog');
break;*/
case 1:
Navigator.pushNamed(context, AppRoutes.myProfile);
break;
case 1:
//Navigator.pushNamed(context, AppRoutes.myProfile);
break;
case 2:
Navigator.pushNamed(context, AppRoutes.mySettings);
Navigator.pushNamed(context, AppRoutes.diaryEdit);
break;
case 3:
Navigator.pushNamed(context, '/chat');
break;
case 4:
//Navigator.pushNamed(context, '/chat');
break;
case 5:
Navigator.pushNamed(context, AppRoutes.mySettings);
break;
default:
}
}
@@ -99,28 +107,54 @@ class CustomBottomBarState extends State<CustomBottomBar> {
BottomNavigationBarItem bottomMenu(index) {
bool isSelected = selectedIndex == index;
double iconHeight;
double iconWidth;
if (index == 0) {
// Для логотипа
iconHeight = 52.v; // Увеличиваем высоту
iconWidth = 48.h; // Меняем ширину, чтобы сохранить пропорции
} else if (index == bottomMenuList.length - 2) {
// Для колокольчика
iconHeight = 20.v; // Уменьшаем высоту
iconWidth = 20.h; // Меняем ширину, чтобы сохранить пропорции
} else if (index == bottomMenuList.length - 1) {
// Для колокольчика
iconHeight = 40.v; // Уменьшаем высоту
iconWidth = 40.h; // Меняем ширину, чтобы сохранить пропорции
} else {
// Для остальных иконок
iconHeight = 24.v; // Стандартная высота
iconWidth = 19.h; // Стандартная ширина
}
return BottomNavigationBarItem(
icon: Column(
crossAxisAlignment: CrossAxisAlignment.center,
children: [
CustomImageView(
imagePath: bottomMenuList[index].icon,
height: 24.v,
width: 19.h,
color:
isSelected ? theme.colorScheme.primary : appTheme.blueGray400,
),
Padding(
padding: EdgeInsets.only(top: 8.v),
child: Text(
bottomMenuList[index].title ?? "",
style: CustomTextStyles.bodySmallMulishBluegray80012.copyWith(
color: isSelected
? theme.colorScheme.primary
: appTheme.blueGray800,
if (!bottomMenuList[index].image)
CustomImageView(
imagePath: bottomMenuList[index].icon,
height: iconHeight,
width: iconWidth,
color:
isSelected ? theme.colorScheme.primary : appTheme.blueGray400,
),
if (bottomMenuList[index].image)
AppbarTitleCircleimage(imagePath: ImageConstant.imgEllipse1),
if (bottomMenuList[index].title !=
null) // Проверяем, существует ли title
Padding(
padding: EdgeInsets.only(top: 8.v),
child: Text(
bottomMenuList[index].title!,
style: CustomTextStyles.bodySmallMulishBluegray80012.copyWith(
color: isSelected
? theme.colorScheme.primary
: appTheme.blueGray800,
),
),
),
),
],
),
activeIcon: Column(
@@ -128,8 +162,8 @@ class CustomBottomBarState extends State<CustomBottomBar> {
children: [
CustomImageView(
imagePath: bottomMenuList[index].activeIcon,
height: 24.adaptSize,
width: 24.adaptSize,
height: iconHeight, // Используем тот же размер для активной иконки
width: iconWidth, // Используем тот же размер для активной иконки
color: theme.colorScheme.primary,
),
Padding(
@@ -158,6 +192,7 @@ class BottomMenuModel {
required this.activeIcon,
this.title,
required this.type,
required this.image,
});
String icon;
@@ -167,4 +202,6 @@ class BottomMenuModel {
String? title;
BottomBarEnum type;
bool image;
}