diff --git a/assets/shopping.svg b/assets/cart.svg similarity index 100% rename from assets/shopping.svg rename to assets/cart.svg diff --git a/assets/filters.png b/assets/filters.png new file mode 100644 index 0000000..8ffb343 Binary files /dev/null and b/assets/filters.png differ diff --git a/example/assets/shopping.svg b/example/assets/cart.svg similarity index 100% rename from example/assets/shopping.svg rename to example/assets/cart.svg diff --git a/example/assets/filters.png b/example/assets/filters.png new file mode 100644 index 0000000..8ffb343 Binary files /dev/null and b/example/assets/filters.png differ diff --git a/example/lib/button_section.dart b/example/lib/button_section.dart index be496cd..974d39f 100644 --- a/example/lib/button_section.dart +++ b/example/lib/button_section.dart @@ -15,7 +15,7 @@ class _ButtonSectionState extends State { Widget build(BuildContext context) { return SizedBox( width: width(context) * 100, - height: height(context) * 30, + height: height(context) * 40, child: ListView.builder( itemCount: buttonList.length, itemBuilder: (BuildContext context, int index) { diff --git a/example/lib/cart_button_section.dart b/example/lib/cart_button_section.dart new file mode 100644 index 0000000..3d4952f --- /dev/null +++ b/example/lib/cart_button_section.dart @@ -0,0 +1,22 @@ +import 'package:flutter/material.dart'; +import 'package:ui_kit/cart_button.dart'; +import 'package:ui_kit/utils.dart'; + +class CartButtonSection extends StatefulWidget { + const CartButtonSection({super.key}); + + @override + State createState() => _CartButtonSectionState(); +} + +class _CartButtonSectionState extends State { + @override + Widget build(BuildContext context) { + return Container( + padding: EdgeInsets.only(bottom: height(context) * 3), + width: width(context) * 100, + + child: CartButton(fullPrice: '500'), + ); + } +} diff --git a/example/lib/icons_section.dart b/example/lib/icons_section.dart index 83a3628..7adab40 100644 --- a/example/lib/icons_section.dart +++ b/example/lib/icons_section.dart @@ -1,4 +1,6 @@ import 'package:flutter/material.dart'; +import 'package:ui_kit/ui_kit.dart'; +import 'package:flutter_svg/flutter_svg.dart'; class IconsSection extends StatefulWidget { const IconsSection({super.key}); @@ -8,8 +10,44 @@ class IconsSection extends StatefulWidget { } class _IconsSectionState extends State { + static final iconsList = [ + 'chevron-left.svg', + 'chevron-right.svg', + 'chevron-down.svg', + 'plus.svg', + 'minus.svg', + 'message-circle.svg', + 'filter.svg', + 'download.svg', + 'map.svg', + 'more-horizontal.svg', + 'close.svg', + 'delete.svg', + 'cart.svg', + 'check.svg', + 'file-text.svg', + 'send.svg', + 'mic.svg', + 'paperclip.svg', + 'closed-eye.svg', + ]; + @override Widget build(BuildContext context) { - return Scaffold(); + return SizedBox( + width: width(context) * 100, + height: height(context) * 10, + child: ListView.builder( + itemCount: iconsList.length, + scrollDirection: Axis.horizontal, + itemBuilder: (BuildContext context, int index) { + final currentItem = iconsList[index]; + return Container( + padding: EdgeInsets.only(right: width(context) * 1), + child: SvgPicture.asset('assets/$currentItem'), + ); + }, + ), + ); } } diff --git a/example/lib/main.dart b/example/lib/main.dart index 3adfcb6..5abbd17 100644 --- a/example/lib/main.dart +++ b/example/lib/main.dart @@ -1,11 +1,13 @@ import 'package:example/bottom_sheet_section.dart'; import 'package:example/button_section.dart'; import 'package:example/card_section.dart'; +import 'package:example/cart_button_section.dart'; import 'package:example/chips_section.dart'; import 'package:example/colors_section.dart'; import 'package:example/counter_section.dart'; import 'package:example/fonts_section.dart'; import 'package:example/header_section.dart'; +import 'package:example/icons_section.dart'; import 'package:example/inputs_section.dart'; import 'package:example/log_in_section.dart'; import 'package:example/search_section.dart'; @@ -36,6 +38,7 @@ class MainApp extends StatelessWidget { children: [ ColorsSection(), FontsSection(), + IconsSection(), InputsSection(), SearchSection(), ButtonSection(), @@ -49,6 +52,7 @@ class MainApp extends StatelessWidget { SelectSection(), ChipsSection(), LogInSection(), + CartButtonSection(), ], ), ), diff --git a/lib/bubbles.dart b/lib/bubbles.dart new file mode 100644 index 0000000..e51c37d --- /dev/null +++ b/lib/bubbles.dart @@ -0,0 +1,15 @@ +import 'package:flutter/material.dart'; + +class BubbleWidget extends StatelessWidget { + const BubbleWidget({super.key, this.isback = true}); + final bool? isback; + + @override + Widget build(BuildContext context) { + return Image.asset( + isback == true ? 'assets/back.png' : 'assets/filters.png', + width: isback == true ? 32 : 48, + height: isback == true ? 32 : 48, + ); + } +} diff --git a/lib/cart_button.dart b/lib/cart_button.dart new file mode 100644 index 0000000..c71cddf --- /dev/null +++ b/lib/cart_button.dart @@ -0,0 +1,45 @@ +import 'package:flutter/material.dart'; +import 'package:flutter_svg/svg.dart'; +import 'package:ui_kit/ui_kit.dart'; + +class CartButton extends StatefulWidget { + const CartButton({super.key, required this.fullPrice}); + final String fullPrice; + + @override + State createState() => _CartButtonState(); +} + +class _CartButtonState extends State { + @override + Widget build(BuildContext context) { + return Container( + decoration: BoxDecoration( + color: primaryColor, + borderRadius: BorderRadius.circular(10), + ), + padding: EdgeInsets.symmetric(horizontal: 16, vertical: 16), + child: Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + Expanded( + child: Row( + children: [ + SvgPicture.asset('assets/cart.svg'), + SizedBox(width: 16), + Text( + 'В корзину', + style: title3Semibold.copyWith(color: whiteColor), + ), + ], + ), + ), + Text( + '${widget.fullPrice} ₽', + style: title3Semibold.copyWith(color: whiteColor), + ), + ], + ), + ); + } +} diff --git a/lib/header.dart b/lib/header.dart index 9c21f71..71fb383 100644 --- a/lib/header.dart +++ b/lib/header.dart @@ -1,6 +1,7 @@ import 'package:flutter/widgets.dart'; import 'package:flutter_svg/flutter_svg.dart'; import 'package:ui_kit/fonts.dart'; +import 'package:ui_kit/ui_kit.dart'; class HeaderWidget extends StatefulWidget { const HeaderWidget({ @@ -29,7 +30,7 @@ class _HeaderWidgetState extends State { Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ - Image.asset('assets/back.png', width: 32, height: 32), + BubbleWidget(), SvgPicture.asset('assets/delete.svg'), ], ), @@ -40,7 +41,7 @@ class _HeaderWidgetState extends State { : Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ - Image.asset('assets/back.png', width: 32, height: 32), + BubbleWidget(), Text('Корзина', style: title1ExtraBold), SvgPicture.asset('assets/delete.svg'), ], diff --git a/lib/ui_kit.dart b/lib/ui_kit.dart index d386539..2dda6b6 100644 --- a/lib/ui_kit.dart +++ b/lib/ui_kit.dart @@ -17,3 +17,5 @@ export 'cards/project_card.dart'; export 'toggle.dart'; export 'chips.dart'; export "cards/log_in_card.dart"; +export 'cart_button.dart'; +export 'bubbles.dart';