diff --git a/android/local.properties b/android/local.properties index bc4bf8c..2c61ca8 100644 --- a/android/local.properties +++ b/android/local.properties @@ -1,2 +1,2 @@ -sdk.dir=/Users/yashmakan/Library/Android/sdk -flutter.sdk=/Users/yashmakan/Downloads/flutter \ No newline at end of file +sdk.dir=C:\\Users\\HP\\AppData\\Local\\Android\\sdk +flutter.sdk=C:\\flutter \ No newline at end of file diff --git a/example/lib/main.dart b/example/lib/main.dart index 255bde6..91122fe 100644 --- a/example/lib/main.dart +++ b/example/lib/main.dart @@ -19,62 +19,78 @@ class MyApp extends StatelessWidget { ), home: FlutterForm( form: FlutterFormData( - name: "Survey Form", - themeColor: Colors.redAccent, - showLogo: false, - pages: [ - FlutterFormPage( - heading: "Basic Information", - imageLayout: ImageLayout.leftExpanded, - image: "https://images.unsplash.com/flagged/photo-1570612861542-284f4c12e75f?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1740&q=80", - description: "Please provide some basic details.", - answerType: AnswerType.shortText, + name: "Survey Form", + themeColor: Colors.redAccent, + showLogo: false, + pages: [ + FlutterFormPage( + heading: "Basic Information", + imageLayout: ImageLayout.leftExpanded, + image: + "https://images.unsplash.com/flagged/photo-1570612861542-284f4c12e75f?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1740&q=80", + description: "Please provide some basic details.", + answerType: AnswerType.shortText, + ), + FlutterFormPage( + heading: "Favorite Color", + description: "What's your favorite color?", + imageLayout: ImageLayout.rightExpanded, + image: + "https://images.unsplash.com/photo-1533109721025-d1ae7ee7c1e1?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1740&q=80", + answerType: AnswerType.singleChoice, + options: [ + ChoiceOption( + label: "Red", + value: "red", + image: "https://picsum.photos/300/200", ), - FlutterFormPage( - heading: "Favorite Color", - description: "What's your favorite color?", - imageLayout: ImageLayout.rightExpanded, - image: "https://images.unsplash.com/photo-1533109721025-d1ae7ee7c1e1?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1740&q=80", - answerType: AnswerType.multipleChoice, - options: ["Red", "Blue", "Green"] + ChoiceOption( + label: "Green", + value: "green", ), - FlutterFormPage( - heading: "Contact Information", - description: "Let us know how to reach you.", - answerType: AnswerType.contactInfo, - ), - FlutterFormPage( - heading: "Address", - description: "Please provide your address.", - answerType: AnswerType.address, - ), - FlutterFormPage( - heading: "Phone Number", - description: "What's your phone number?", - answerType: AnswerType.phoneNumber, - ), - FlutterFormPage( - heading: "Feedback", - description: "Share your thoughts with us.", - answerType: AnswerType.longText, - ), - FlutterFormPage( - heading: "Satisfaction", - description: "Are you satisfied with our service?", - answerType: AnswerType.yesNo, + ChoiceOption( + label: "Yellow", + value: "yellow", ), ], - onFormSubmitted: (pages) { - for (var element in pages) { - debugPrint(element.toJson().toString()); - debugPrint("text: ${element.controller.text}"); - debugPrint("selected options: ${element.selectedOptions}"); - debugPrint("form: ${element.formField}"); - debugPrint("---"); - } - }, - onPageEdited: (page) {}, - )), + ), + FlutterFormPage( + heading: "Contact Information", + description: "Let us know how to reach you.", + answerType: AnswerType.contactInfo, + ), + FlutterFormPage( + heading: "Address", + description: "Please provide your address.", + answerType: AnswerType.address, + ), + FlutterFormPage( + heading: "Phone Number", + description: "What's your phone number?", + answerType: AnswerType.phoneNumber, + ), + FlutterFormPage( + heading: "Feedback", + description: "Share your thoughts with us.", + answerType: AnswerType.longText, + ), + FlutterFormPage( + heading: "Satisfaction", + description: "Are you satisfied with our service?", + answerType: AnswerType.yesNo, + ), + ], + onFormSubmitted: (pages) { + for (var element in pages) { + debugPrint(element.toJson().toString()); + debugPrint("text: ${element.controller.text}"); + debugPrint("selected options: ${element.selectedOptions}"); + debugPrint("form: ${element.formField}"); + debugPrint("---"); + } + }, + onPageEdited: (page) {}, + )), ); } } diff --git a/example/pubspec.lock b/example/pubspec.lock index 2c4e3bf..8bf6f20 100644 --- a/example/pubspec.lock +++ b/example/pubspec.lock @@ -37,10 +37,10 @@ packages: dependency: transitive description: name: collection - sha256: "4a07be6cb69c84d677a6c3096fcf960cc3285a8330b4603e0d463d15d9bd934c" + sha256: ee67cb0715911d28db6bf4af1026078bd6f0128b07a5f66fb2ed94ec6783c09a url: "https://pub.dev" source: hosted - version: "1.17.1" + version: "1.18.0" cupertino_icons: dependency: "direct main" description: @@ -68,7 +68,7 @@ packages: path: ".." relative: true source: path - version: "0.0.1" + version: "0.0.3" flutter_lints: dependency: "direct dev" description: @@ -82,14 +82,6 @@ packages: description: flutter source: sdk version: "0.0.0" - js: - dependency: transitive - description: - name: js - sha256: f2c445dce49627136094980615a031419f7f3eb393237e4ecd97ac15dea343f3 - url: "https://pub.dev" - source: hosted - version: "0.6.7" lints: dependency: transitive description: @@ -102,26 +94,26 @@ packages: dependency: transitive description: name: matcher - sha256: "6501fbd55da300384b768785b83e5ce66991266cec21af89ab9ae7f5ce1c4cbb" + sha256: "1803e76e6653768d64ed8ff2e1e67bea3ad4b923eb5c56a295c3e634bad5960e" url: "https://pub.dev" source: hosted - version: "0.12.15" + version: "0.12.16" material_color_utilities: dependency: transitive description: name: material_color_utilities - sha256: d92141dc6fe1dad30722f9aa826c7fbc896d021d792f80678280601aff8cf724 + sha256: "9528f2f296073ff54cb9fee677df673ace1218163c3bc7628093e7eed5203d41" url: "https://pub.dev" source: hosted - version: "0.2.0" + version: "0.5.0" meta: dependency: transitive description: name: meta - sha256: "3c74dbf8763d36539f114c799d8a2d87343b5067e9d796ca22b5eb8437090ee3" + sha256: a6e590c838b18133bb482a2745ad77c5bb7715fb0451209e1a7567d416678b8e url: "https://pub.dev" source: hosted - version: "1.9.1" + version: "1.10.0" path: dependency: transitive description: @@ -147,26 +139,26 @@ packages: dependency: transitive description: name: source_span - sha256: dd904f795d4b4f3b870833847c461801f6750a9fa8e61ea5ac53f9422b31f250 + sha256: "53e943d4206a5e30df338fd4c6e7a077e02254531b138a15aec3bd143c1a8b3c" url: "https://pub.dev" source: hosted - version: "1.9.1" + version: "1.10.0" stack_trace: dependency: transitive description: name: stack_trace - sha256: c3c7d8edb15bee7f0f74debd4b9c5f3c2ea86766fe4178eb2a18eb30a0bdaed5 + sha256: "73713990125a6d93122541237550ee3352a2d84baad52d375a4cad2eb9b7ce0b" url: "https://pub.dev" source: hosted - version: "1.11.0" + version: "1.11.1" stream_channel: dependency: transitive description: name: stream_channel - sha256: "83615bee9045c1d322bbbd1ba209b7a749c2cbcdcb3fdd1df8eb488b3279c1c8" + sha256: ba2aa5d8cc609d96bbb2899c28934f9e1af5cddbd60a827822ea467161eb54e7 url: "https://pub.dev" source: hosted - version: "2.1.1" + version: "2.1.2" string_scanner: dependency: transitive description: @@ -187,10 +179,10 @@ packages: dependency: transitive description: name: test_api - sha256: eb6ac1540b26de412b3403a163d919ba86f6a973fe6cc50ae3541b80092fdcfb + sha256: "5c2f730018264d276c20e4f1503fd1308dfbbae39ec8ee63c5236311ac06954b" url: "https://pub.dev" source: hosted - version: "0.5.1" + version: "0.6.1" vector_math: dependency: transitive description: @@ -199,6 +191,14 @@ packages: url: "https://pub.dev" source: hosted version: "2.1.4" + web: + dependency: transitive + description: + name: web + sha256: afe077240a270dcfd2aafe77602b4113645af95d0ad31128cc02bce5ac5d5152 + url: "https://pub.dev" + source: hosted + version: "0.3.0" sdks: - dart: ">=3.0.6 <4.0.0" + dart: ">=3.2.0-194.0.dev <4.0.0" flutter: ">=1.17.0" diff --git a/lib/flutter_form_kit.dart b/lib/flutter_form_kit.dart index 5c68a28..3c2e297 100644 --- a/lib/flutter_form_kit.dart +++ b/lib/flutter_form_kit.dart @@ -2,4 +2,5 @@ library flutterform; export 'src/constants/enums.dart'; export 'src/models/form.dart'; export 'src/models/page.dart'; +export 'src/models/choice_option.dart'; export 'src/views/form.dart'; \ No newline at end of file diff --git a/lib/src/constants/enums.dart b/lib/src/constants/enums.dart index f898076..9b7dfc6 100644 --- a/lib/src/constants/enums.dart +++ b/lib/src/constants/enums.dart @@ -1,6 +1,7 @@ enum AnswerType { shortText, multipleChoice, + singleChoice, contactInfo, address, phoneNumber, diff --git a/lib/src/models/choice_option.dart b/lib/src/models/choice_option.dart new file mode 100644 index 0000000..a9a9e64 --- /dev/null +++ b/lib/src/models/choice_option.dart @@ -0,0 +1,11 @@ +class ChoiceOption { + final String label; + final String value; + final String? image; + + ChoiceOption({ + required this.label, + required this.value, + this.image, + }); +} diff --git a/lib/src/models/form.dart b/lib/src/models/form.dart index aa17c83..25127c3 100644 --- a/lib/src/models/form.dart +++ b/lib/src/models/form.dart @@ -7,6 +7,8 @@ class FlutterFormData { final Color? themeColor; final String? logo; final bool showLogo; + final Color backgroundColor; + final Duration pageTransitionDuration; List pages; final Function(FlutterFormPage page) onPageEdited; final Function(List pages) onFormSubmitted; @@ -16,6 +18,8 @@ class FlutterFormData { required this.pages, this.themeColor, this.logo, + this.backgroundColor = Colors.white, + this.pageTransitionDuration = const Duration(seconds: 2), this.showLogo = true, required this.onPageEdited, required this.onFormSubmitted}); diff --git a/lib/src/models/page.dart b/lib/src/models/page.dart index 8434b40..2541607 100644 --- a/lib/src/models/page.dart +++ b/lib/src/models/page.dart @@ -1,5 +1,6 @@ import 'package:flutter/material.dart'; import 'package:flutter_form_kit/src/constants/enums.dart'; +import 'package:flutter_form_kit/src/models/choice_option.dart'; class FlutterFormPage { final String heading; @@ -7,9 +8,16 @@ class FlutterFormPage { final String? image; final AnswerType answerType; final ImageLayout? imageLayout; - List? options; + /// The options for the form page. + /// Example: + /// { + /// "label": "Red", + /// "value": "red", + /// "image": "https://images.unsplash.com/photo-15795469" // Optional + /// } + List? options; TextEditingController controller = TextEditingController(); - List selectedOptions = []; + List selectedOptions = []; List formField = []; FlutterFormPage({ diff --git a/lib/src/views/form.dart b/lib/src/views/form.dart index 2b8a0ab..0d925a0 100644 --- a/lib/src/views/form.dart +++ b/lib/src/views/form.dart @@ -1,5 +1,6 @@ import 'package:flutter/material.dart'; import 'package:flutter/services.dart'; +import 'package:flutter_form_kit/src/models/choice_option.dart'; import 'package:flutter_form_kit/src/models/form.dart'; import 'package:flutter_form_kit/src/widgets/custom_button.dart'; import 'package:flutter_form_kit/src/widgets/flutter_form_details.dart'; @@ -45,7 +46,7 @@ class _FlutterFormState extends State { cursorPosition; } else if (value.runtimeType == List) { widget.form.pages[currentIndex].selectedOptions = - List.from(value); + List.from(value); } currentIndex = index; setState(() {}); @@ -66,7 +67,7 @@ class _FlutterFormState extends State { } }, child: Scaffold( - backgroundColor: Colors.white, + backgroundColor: widget.form.backgroundColor, floatingActionButton: Row( mainAxisSize: MainAxisSize.min, children: [ @@ -76,10 +77,11 @@ class _FlutterFormState extends State { pagesLength: widget.form.pages.length, onPageChanged: (index) => setState(() => currentIndex = index)), - if(widget.form.showLogo)...[ + if (widget.form.showLogo) ...[ const SizedBox(width: 12), CustomButton( - text: widget.form.logo ?? "Powered by FlutterForm", + text: + widget.form.logo ?? "Powered by FlutterForm", onTap: () {}, themeColor: widget.form.themeColor ?? const Color(0xFF0445af), @@ -106,7 +108,8 @@ class _FlutterFormState extends State { onNextPage() { controller.animateToPage(currentIndex + 1, - duration: const Duration(seconds: 2), curve: Curves.fastOutSlowIn); + duration: widget.form.pageTransitionDuration, + curve: Curves.fastOutSlowIn); widget.form.onPageEdited(widget.form.pages[currentIndex]); } } diff --git a/lib/src/widgets/answer_widget.dart b/lib/src/widgets/answer_widget.dart index ea51ed6..19c99b0 100644 --- a/lib/src/widgets/answer_widget.dart +++ b/lib/src/widgets/answer_widget.dart @@ -1,5 +1,6 @@ import 'package:flutter/material.dart'; import 'package:flutter_form_kit/src/constants/enums.dart'; +import 'package:flutter_form_kit/src/models/choice_option.dart'; import 'package:flutter_form_kit/src/widgets/form_type_widgets/address.dart'; import 'package:flutter_form_kit/src/widgets/form_type_widgets/contact_info.dart'; import 'package:flutter_form_kit/src/widgets/form_type_widgets/long_text.dart'; @@ -41,22 +42,44 @@ class _AnswerWidgetState extends State { page: page, onOptionSelected: (option) { if (page.selectedOptions.contains(option)) { - FlutterFormDetails.of(context).pages[widget.index].selectedOptions.remove(option); + FlutterFormDetails.of(context) + .pages[widget.index] + .selectedOptions + .remove(option); } else { - FlutterFormDetails.of(context).pages[widget.index].selectedOptions.add(option); + FlutterFormDetails.of(context) + .pages[widget.index] + .selectedOptions + .add(option); } setState(() {}); }); + case AnswerType.singleChoice: + return MultipleChoice( + page: page, + onOptionSelected: (option) { + FlutterFormDetails.of(context) + .pages[widget.index] + .selectedOptions + .clear(); + FlutterFormDetails.of(context) + .pages[widget.index] + .selectedOptions + .add(option); + setState(() {}); + }); case AnswerType.contactInfo: return ContactInfo( - fields: (fields){ - FlutterFormDetails.of(context).pages[widget.index].formField = fields; + fields: (fields) { + FlutterFormDetails.of(context).pages[widget.index].formField = + fields; }, ); case AnswerType.address: return Address( - fields: (fields){ - FlutterFormDetails.of(context).pages[widget.index].formField = fields; + fields: (fields) { + FlutterFormDetails.of(context).pages[widget.index].formField = + fields; }, ); case AnswerType.phoneNumber: @@ -67,8 +90,7 @@ class _AnswerWidgetState extends State { onSubmitted: (value) { FlutterFormDetails.of(context).onPageSubmitted(widget.index); }, - controller: page.controller - ); + controller: page.controller); case AnswerType.longText: return LongText( onChanged: (value) { @@ -79,14 +101,24 @@ class _AnswerWidgetState extends State { }, controller: page.controller); case AnswerType.yesNo: - page.options = ['YES', 'NO']; + page.options = [ + ChoiceOption(label: "YES", value: "yes"), + ChoiceOption(label: "NO", value: "no"), + ]; return MultipleChoice( - page: page, - onOptionSelected: (option) { - FlutterFormDetails.of(context).pages[widget.index].selectedOptions.clear(); - FlutterFormDetails.of(context).pages[widget.index].selectedOptions.add(option); - setState(() {}); - }); + page: page, + onOptionSelected: (option) { + FlutterFormDetails.of(context) + .pages[widget.index] + .selectedOptions + .clear(); + FlutterFormDetails.of(context) + .pages[widget.index] + .selectedOptions + .add(option); + setState(() {}); + }, + ); } } } diff --git a/lib/src/widgets/form_image_layouts/basic_layout.dart b/lib/src/widgets/form_image_layouts/basic_layout.dart index 4949acd..0772508 100644 --- a/lib/src/widgets/form_image_layouts/basic_layout.dart +++ b/lib/src/widgets/form_image_layouts/basic_layout.dart @@ -8,7 +8,8 @@ class BasicLayout extends StatelessWidget { final bool showInline; final int pageIndex; - const BasicLayout({super.key, this.showInline = false, required this.pageIndex}); + const BasicLayout( + {super.key, this.showInline = false, required this.pageIndex}); @override Widget build(BuildContext context) { @@ -27,8 +28,7 @@ class BasicLayout extends StatelessWidget { children: [ Text( "${index + 1}", - style: textTheme.bodyMedium - ?.copyWith(color: themeColor), + style: textTheme.bodyMedium?.copyWith(color: themeColor), ), Icon( Icons.arrow_forward, @@ -82,12 +82,13 @@ class BasicLayout extends StatelessWidget { style: textTheme.headlineSmall?.copyWith(color: Colors.white), suffixIcon: index == pagesLength - 1 ? null : Icons.check, onTap: () { - if(index == pagesLength - 1) { + if (index == pagesLength - 1) { onFormSubmitted(FlutterFormDetails.of(context).pages); - }else { + } else { onPageSubmitted(index); } - }, themeColor: themeColor, + }, + themeColor: themeColor, ), ), const SizedBox(width: 16), diff --git a/lib/src/widgets/form_image_layouts/expanded_layout.dart b/lib/src/widgets/form_image_layouts/expanded_layout.dart index 30b2585..983085c 100644 --- a/lib/src/widgets/form_image_layouts/expanded_layout.dart +++ b/lib/src/widgets/form_image_layouts/expanded_layout.dart @@ -21,7 +21,7 @@ class ExpandedLayout extends StatelessWidget { : null), child: Center( child: SizedBox( - width: 40.w, + width: Device.screenType == ScreenType.tablet ? 40.w : 90.w, child: BasicLayout(pageIndex: index), ), ), diff --git a/lib/src/widgets/form_image_layouts/in_between_layout.dart b/lib/src/widgets/form_image_layouts/in_between_layout.dart index c2471d9..8e7664c 100644 --- a/lib/src/widgets/form_image_layouts/in_between_layout.dart +++ b/lib/src/widgets/form_image_layouts/in_between_layout.dart @@ -14,7 +14,7 @@ class InBetweenLayout extends StatelessWidget { height: 100.h, child: Center( child: SizedBox( - width: 40.w, + width: Device.screenType == ScreenType.tablet ? 40.w : 90.w, child: BasicLayout(showInline: true, pageIndex: index), ), ), diff --git a/lib/src/widgets/form_image_layouts/side_expanded_layout.dart b/lib/src/widgets/form_image_layouts/side_expanded_layout.dart index 35d0243..202ab5a 100644 --- a/lib/src/widgets/form_image_layouts/side_expanded_layout.dart +++ b/lib/src/widgets/form_image_layouts/side_expanded_layout.dart @@ -7,7 +7,8 @@ class SideExpandedLayout extends StatelessWidget { final int index; final bool isRight; - const SideExpandedLayout({super.key, this.isRight = true, required this.index}); + const SideExpandedLayout( + {super.key, this.isRight = true, required this.index}); @override Widget build(BuildContext context) { @@ -18,30 +19,32 @@ class SideExpandedLayout extends StatelessWidget { child: Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ - if (!isRight) - (page.image != null) - ? Image.network( - page.image!, - width: 50.w, - height: 100.h, - fit: BoxFit.cover, - ) - : const SizedBox(), + if (Device.screenType == ScreenType.tablet) + if (!isRight) + (page.image != null) + ? Image.network( + page.image!, + width: 50.w, + height: 100.h, + fit: BoxFit.cover, + ) + : const SizedBox(), Expanded( child: Padding( padding: EdgeInsets.symmetric(horizontal: 5.w), child: BasicLayout(pageIndex: index), ), ), - if (isRight) - (page.image != null) - ? Image.network( - page.image!, - width: 50.w, - height: 100.h, - fit: BoxFit.cover, - ) - : const SizedBox(), + if (Device.screenType == ScreenType.tablet) + if (isRight) + (page.image != null) + ? Image.network( + page.image!, + width: 50.w, + height: 100.h, + fit: BoxFit.cover, + ) + : const SizedBox(), ], ), ); diff --git a/lib/src/widgets/form_image_layouts/side_layout.dart b/lib/src/widgets/form_image_layouts/side_layout.dart index 5a41ad9..bbf8d30 100644 --- a/lib/src/widgets/form_image_layouts/side_layout.dart +++ b/lib/src/widgets/form_image_layouts/side_layout.dart @@ -19,28 +19,30 @@ class SideLayout extends StatelessWidget { child: Row( mainAxisAlignment: MainAxisAlignment.spaceEvenly, children: [ - if (!isRight) - (page.image != null) - ? Image.network( - page.image!, - width: 25.w, - height: 25.h, - fit: BoxFit.cover, - ) - : const SizedBox(), + if (Device.screenType == ScreenType.tablet) + if (!isRight) + (page.image != null) + ? Image.network( + page.image!, + width: 25.w, + height: 25.h, + fit: BoxFit.cover, + ) + : const SizedBox(), SizedBox( - width: 40.w, + width: Device.screenType == ScreenType.tablet ? 40.w : 90.w, child: BasicLayout(pageIndex: index), ), - if (isRight) - (page.image != null) - ? Image.network( - page.image!, - width: 25.w, - height: 25.h, - fit: BoxFit.cover, - ) - : const SizedBox(), + if (Device.screenType == ScreenType.tablet) + if (isRight) + (page.image != null) + ? Image.network( + page.image!, + width: 25.w, + height: 25.h, + fit: BoxFit.cover, + ) + : const SizedBox(), ], ), ), diff --git a/lib/src/widgets/form_type_widgets/multiple_choice.dart b/lib/src/widgets/form_type_widgets/multiple_choice.dart index 1667453..b9e7558 100644 --- a/lib/src/widgets/form_type_widgets/multiple_choice.dart +++ b/lib/src/widgets/form_type_widgets/multiple_choice.dart @@ -1,10 +1,12 @@ import 'package:flutter/material.dart'; +import 'package:flutter_form_kit/src/models/choice_option.dart'; import 'package:flutter_form_kit/src/models/page.dart'; import 'package:flutter_form_kit/src/widgets/flutter_form_details.dart'; +import 'package:responsive_sizer/responsive_sizer.dart'; class MultipleChoice extends StatefulWidget { final FlutterFormPage page; - final Function(String) onOptionSelected; + final Function(ChoiceOption) onOptionSelected; const MultipleChoice( {super.key, required this.page, required this.onOptionSelected}); @@ -26,7 +28,7 @@ class _MultipleChoiceState extends State { ); } - optionWidget(int index, String option, context) { + optionWidget(int index, ChoiceOption option, context) { final themeColor = FlutterFormDetails.of(context).themeColor; final textTheme = Theme.of(context).textTheme; String alphabet = String.fromCharCode('A'.codeUnitAt(0) + index); @@ -50,40 +52,80 @@ class _MultipleChoiceState extends State { padding: const EdgeInsets.symmetric(vertical: 8, horizontal: 8), constraints: const BoxConstraints(minWidth: 200), decoration: BoxDecoration( - color: themeColor - .withOpacity(hoveredIndex == index ? 0.2 : 0.1), + color: themeColor.withOpacity(hoveredIndex == index ? 0.2 : 0.1), border: Border.all(color: themeColor), borderRadius: BorderRadius.circular(4)), - child: Row( + child: Column( mainAxisSize: MainAxisSize.min, + crossAxisAlignment: CrossAxisAlignment.start, children: [ - Container( - width: 22, - height: 22, - decoration: BoxDecoration( - color: Colors.white, - border: Border.all(color: themeColor), - borderRadius: BorderRadius.circular(4)), - child: Center( - child: Text( - alphabet, - style: textTheme.bodySmall?.copyWith( - color: themeColor, - fontWeight: FontWeight.bold), - )), + Row( + mainAxisSize: MainAxisSize.min, + children: [ + Container( + width: 22, + height: 22, + decoration: BoxDecoration( + color: Colors.white, + border: Border.all(color: themeColor), + borderRadius: BorderRadius.circular(4)), + child: Center( + child: Text( + alphabet, + style: textTheme.bodySmall?.copyWith( + color: themeColor, fontWeight: FontWeight.bold), + )), + ), + const SizedBox(width: 8), + Text( + option.label, + style: textTheme.titleMedium?.copyWith(color: themeColor), + ), + if (widget.page.selectedOptions.contains(option)) + Icon(Icons.check, color: themeColor) + ], ), - const SizedBox(width: 8), - Text( - option, - style: textTheme.titleMedium - ?.copyWith(color: themeColor), - ), - if (widget.page.selectedOptions.contains(option)) - Icon(Icons.check, color: themeColor) + if (option.image!= null) ...[ + SizedBox( + height: 5, + ), + option.image!.contains('http') + ? InkWell( + onTap: () => showImageDialog(option.image!), + child: Image.network( + option.image!, + height: 10.h, + width: double.infinity, + fit: BoxFit.cover, + ), + ) + : Image.asset( + option.image!, + height: 10.h, + width: double.infinity, + fit: BoxFit.cover, + ) + ] ], ), ), ), ); } + + showImageDialog(String image) { + return showDialog( + context: context, + builder: (context) { + return Dialog( + child: ClipRRect( + borderRadius: BorderRadius.circular(20), + child: image.contains('http') + ? Image.network(image) + : Image.asset(image), + ), + ); + }, + ); + } } diff --git a/pubspec.yaml b/pubspec.yaml index a2e9f1a..acf953b 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -10,7 +10,6 @@ environment: dependencies: flutter: sdk: flutter - responsive_sizer: ^3.2.0 @@ -19,39 +18,4 @@ dev_dependencies: sdk: flutter flutter_lints: ^2.0.0 -# For information on the generic Dart part of this file, see the -# following page: https://dart.dev/tools/pub/pubspec - -# The following section is specific to Flutter packages. flutter: - - # To add assets to your package, add an assets section, like this: - # assets: - # - images/a_dot_burr.jpeg - # - images/a_dot_ham.jpeg - # - # For details regarding assets in packages, see - # https://flutter.dev/assets-and-images/#from-packages - # - # An image asset can refer to one or more resolution-specific "variants", see - # https://flutter.dev/assets-and-images/#resolution-aware - - # To add custom fonts to your package, add a fonts section here, - # in this "flutter" section. Each entry in this list should have a - # "family" key with the font family name, and a "fonts" key with a - # list giving the asset and other descriptors for the font. For - # example: - # fonts: - # - family: Schyler - # fonts: - # - asset: fonts/Schyler-Regular.ttf - # - asset: fonts/Schyler-Italic.ttf - # style: italic - # - family: Trajan Pro - # fonts: - # - asset: fonts/TrajanPro.ttf - # - asset: fonts/TrajanPro_Bold.ttf - # weight: 700 - # - # For details regarding fonts in packages, see - # https://flutter.dev/custom-fonts/#from-packages