diff --git a/assets/people.png b/assets/people.png new file mode 100644 index 0000000..47ceae0 Binary files /dev/null and b/assets/people.png differ diff --git a/example/assets/people.png b/example/assets/people.png new file mode 100644 index 0000000..47ceae0 Binary files /dev/null and b/example/assets/people.png differ diff --git a/example/lib/counter.dart b/example/lib/counter_section.dart similarity index 80% rename from example/lib/counter.dart rename to example/lib/counter_section.dart index 5928031..35f20eb 100644 --- a/example/lib/counter.dart +++ b/example/lib/counter_section.dart @@ -1,4 +1,5 @@ import 'package:flutter/widgets.dart'; +import 'package:ui_kit/counter.dart'; import 'package:ui_kit/ui_kit.dart'; class CounterSection extends StatefulWidget { @@ -11,9 +12,10 @@ class CounterSection extends StatefulWidget { class _CounterSectionState extends State { @override Widget build(BuildContext context) { - return SizedBox( + return Container( + margin: EdgeInsets.only(bottom: height(context) * 5), width: 64, - height: height(context) * 30, + height: height(context) * 5, child: ListView.builder( itemCount: 2, itemBuilder: (BuildContext context, int index) { diff --git a/example/lib/main.dart b/example/lib/main.dart index cf8d94f..444f7ca 100644 --- a/example/lib/main.dart +++ b/example/lib/main.dart @@ -2,12 +2,14 @@ import 'package:example/bottom_sheet_section.dart'; import 'package:example/button_section.dart'; import 'package:example/card_section.dart'; import 'package:example/colors_section.dart'; -import 'package:example/counter.dart'; +import 'package:example/counter_section.dart'; import 'package:example/fonts_section.dart'; import 'package:example/header_section.dart'; import 'package:example/inputs_section.dart'; import 'package:example/search_section.dart'; +import 'package:example/select_section.dart'; import 'package:example/small_button_section.dart'; +import 'package:example/toggle_section.dart'; import 'package:flutter/material.dart'; import 'package:ui_kit/ui_kit.dart'; @@ -41,6 +43,8 @@ class MainApp extends StatelessWidget { HeaderSection(), CardSection(), CounterSection(), + ToggleSection(), + SelectSection(), ], ), ), diff --git a/example/lib/select_section.dart b/example/lib/select_section.dart new file mode 100644 index 0000000..725f5df --- /dev/null +++ b/example/lib/select_section.dart @@ -0,0 +1,40 @@ +import 'package:flutter/material.dart'; +import 'package:ui_kit/select.dart'; +import 'package:ui_kit/utils.dart'; + +class SelectSection extends StatefulWidget { + const SelectSection({super.key}); + + @override + State createState() => _SelectSectionState(); +} + +class _SelectSectionState extends State { + static final selectItems = [ + {'value': ''}, + {'value': 'Мужской'}, + {'value': 'Гарвард Троцкий', 'image': "assets/people.png"}, + ]; + + @override + Widget build(BuildContext context) { + return SizedBox( + width: width(context) * 100, + height: height(context) * 33, + child: ListView.builder( + itemCount: selectItems.length, + itemBuilder: (BuildContext context, int index) { + final currenItem = selectItems[index]; + return Container( + padding: EdgeInsets.only(bottom: height(context) * 2), + child: SelectWidget( + hintText: 'Пол', + selectedValue: currenItem['value'] ?? "", + image: currenItem['image'], + ), + ); + }, + ), + ); + } +} diff --git a/example/lib/toggle_section.dart b/example/lib/toggle_section.dart new file mode 100644 index 0000000..2a74886 --- /dev/null +++ b/example/lib/toggle_section.dart @@ -0,0 +1,28 @@ +import 'package:flutter/material.dart'; +import 'package:ui_kit/ui_kit.dart'; + +class ToggleSection extends StatefulWidget { + const ToggleSection({super.key}); + + @override + State createState() => _ToggleSectionState(); +} + +class _ToggleSectionState extends State { + @override + Widget build(BuildContext context) { + return SizedBox( + width: 48, + height: height(context) * 20, + child: ListView.builder( + itemCount: 2, + itemBuilder: (BuildContext context, int index) { + return Container( + margin: EdgeInsets.only(bottom: height(context) * 1.5), + child: ToggleWidget(initialValue: index != 1 ? true : false), + ); + }, + ), + ); + } +} diff --git a/example/pubspec.lock b/example/pubspec.lock index 0e8196e..3887b7b 100644 --- a/example/pubspec.lock +++ b/example/pubspec.lock @@ -49,6 +49,14 @@ packages: url: "https://pub.dev" source: hosted version: "1.19.1" + dropdown_button2: + dependency: "direct main" + description: + name: dropdown_button2 + sha256: b0fe8d49a030315e9eef6c7ac84ca964250155a6224d491c1365061bc974a9e1 + url: "https://pub.dev" + source: hosted + version: "2.3.9" fake_async: dependency: transitive description: @@ -62,6 +70,14 @@ packages: description: flutter source: sdk version: "0.0.0" + flutter_advanced_switch: + dependency: "direct main" + description: + name: flutter_advanced_switch + sha256: e1147161a3dd9b708a71c65e76174d4d1a0a5908a571b8b38b65c79b142c52a0 + url: "https://pub.dev" + source: hosted + version: "3.1.0" flutter_lints: dependency: "direct dev" description: diff --git a/example/pubspec.yaml b/example/pubspec.yaml index 9fe7f4b..a5937ef 100644 --- a/example/pubspec.yaml +++ b/example/pubspec.yaml @@ -7,8 +7,10 @@ environment: sdk: ^3.8.0 dependencies: + dropdown_button2: ^2.3.9 flutter: sdk: flutter + flutter_advanced_switch: ^3.1.0 modal_bottom_sheet: ^3.0.0 ui_kit: path: .. diff --git a/lib/select.dart b/lib/select.dart index 059cd75..e037ccc 100644 --- a/lib/select.dart +++ b/lib/select.dart @@ -1,7 +1,17 @@ import 'package:flutter/material.dart'; +import 'package:flutter_svg/flutter_svg.dart'; +import 'package:ui_kit/ui_kit.dart'; class SelectWidget extends StatefulWidget { - const SelectWidget({super.key}); + const SelectWidget({ + super.key, + this.selectedValue = '', + this.image, + required this.hintText, + }); + final String selectedValue; + final String? image; + final String hintText; @override State createState() => _SelectWidgetState(); @@ -10,6 +20,53 @@ class SelectWidget extends StatefulWidget { class _SelectWidgetState extends State { @override Widget build(BuildContext context) { - return Scaffold(); + return GestureDetector( + onTap: () { + showBottomSheetFunc(Column(), context); + }, + child: Container( + height: 48, + decoration: BoxDecoration( + borderRadius: BorderRadius.circular(10), + color: inputBgColor, + border: Border.all(color: inputStrokeColor, width: 1), + ), + padding: EdgeInsets.symmetric(horizontal: 14, vertical: 14), + child: Row( + crossAxisAlignment: CrossAxisAlignment.center, + children: [ + Expanded( + child: Row( + children: [ + widget.image != null + ? Row( + children: [ + Image.asset( + widget.image ?? '', + width: 24, + height: 24, + ), + SizedBox(width: 12), + ], + ) + : SizedBox(), + Text( + widget.selectedValue == '' + ? widget.hintText + : widget.selectedValue, + style: headlineRegular.copyWith( + color: widget.selectedValue != '' + ? blackColor + : captionColor, + ), + ), + ], + ), + ), + SvgPicture.asset('assets/chevron-down.svg'), + ], + ), + ), + ); } } diff --git a/lib/toggle.dart b/lib/toggle.dart new file mode 100644 index 0000000..2701e0f --- /dev/null +++ b/lib/toggle.dart @@ -0,0 +1,27 @@ +import 'package:flutter/material.dart'; +import 'package:flutter_advanced_switch/flutter_advanced_switch.dart'; +import 'package:ui_kit/ui_kit.dart'; + +class ToggleWidget extends StatefulWidget { + const ToggleWidget({super.key, this.initialValue = false}); + final bool initialValue; + + @override + State createState() => _ToggleWidgetState(); +} + +class _ToggleWidgetState extends State { + final controller00 = ValueNotifier(false); + @override + Widget build(BuildContext context) { + return AdvancedSwitch( + controller: controller00, + width: 48, + height: 28, + initialValue: widget.initialValue, + activeColor: primaryColor, + inactiveColor: inputBgColor, + enabled: true, + ); + } +} diff --git a/lib/ui_kit.dart b/lib/ui_kit.dart index 5c6fbe1..3d26f4b 100644 --- a/lib/ui_kit.dart +++ b/lib/ui_kit.dart @@ -14,4 +14,4 @@ export 'card.dart'; export 'cards/primary_card.dart'; export 'cards/cart_card.dart'; export 'cards/project_card.dart'; -export 'counter.dart'; +export 'toggle.dart'; diff --git a/pubspec.yaml b/pubspec.yaml index 8fd53af..5b26e21 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -8,8 +8,10 @@ environment: flutter: ">=1.17.0" dependencies: + dropdown_button2: ^2.3.9 flutter: sdk: flutter + flutter_advanced_switch: ^3.1.0 flutter_svg: ^2.1.0 modal_bottom_sheet: ^3.0.0