You cannot select more than 25 topics
			Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
		
		
		
		
		
			
		
			
				
	
	
		
			155 lines
		
	
	
		
			5.1 KiB
		
	
	
	
		
			Dart
		
	
			
		
		
	
	
			155 lines
		
	
	
		
			5.1 KiB
		
	
	
	
		
			Dart
		
	
| import 'package:flutter/cupertino.dart';
 | |
| import 'package:flutter/material.dart' show Icons, PopupMenuItem, showMenu, Colors;
 | |
| import 'package:hmg_patient_app_new/core/utils/size_utils.dart';
 | |
| import 'package:hmg_patient_app_new/core/utils/utils.dart';
 | |
| import 'package:hmg_patient_app_new/extensions/widget_extensions.dart';
 | |
| import 'package:hmg_patient_app_new/theme/colors.dart';
 | |
| 
 | |
| class DropdownWidget extends StatelessWidget {
 | |
|   final String labelText;
 | |
|   final String hintText;
 | |
|   final List<String> dropdownItems;
 | |
|   final String? selectedValue;
 | |
|   final Function(String?)? onChange;
 | |
|   final bool isEnable;
 | |
|   final bool isBorderAllowed;
 | |
|   final bool isAllowRadius;
 | |
|   final EdgeInsetsGeometry? padding;
 | |
|   final bool hasSelectionCustomIcon;
 | |
|   final String? selectionCustomIcon;
 | |
|   final String? leadingIcon;
 | |
| 
 | |
|   const DropdownWidget({
 | |
|     Key? key,
 | |
|     required this.labelText,
 | |
|     required this.hintText,
 | |
|     required this.dropdownItems,
 | |
|     this.selectedValue,
 | |
|     this.onChange,
 | |
|     this.isEnable = true,
 | |
|     this.isBorderAllowed = true,
 | |
|     this.isAllowRadius = true,
 | |
|     this.padding,
 | |
|     this.hasSelectionCustomIcon = false,
 | |
|     this.selectionCustomIcon,
 | |
|     this.leadingIcon,
 | |
|   }) : super(key: key);
 | |
| 
 | |
|   @override
 | |
|   Widget build(BuildContext context) {
 | |
|     Widget content = Column(
 | |
|       mainAxisSize: MainAxisSize.min,
 | |
|       crossAxisAlignment: CrossAxisAlignment.start,
 | |
|       children: [_buildLabelText(), _buildDropdown(context)],
 | |
|     );
 | |
| 
 | |
|     return Container(
 | |
|       padding: padding,
 | |
|       alignment: Alignment.center, // This might need adjustment based on layout
 | |
|       decoration: RoundedRectangleBorder().toSmoothCornerDecoration(
 | |
|         color: Colors.white,
 | |
|         borderRadius: isAllowRadius ? 15.h : null,
 | |
|         side: isBorderAllowed ? BorderSide(color: const Color(0xffefefef), width: 1) : null,
 | |
|       ),
 | |
|       child: Row(
 | |
|         // Wrap with a Row
 | |
|         crossAxisAlignment: CrossAxisAlignment.center, // Align items vertically in the center
 | |
|         children: [
 | |
|           if (leadingIcon != null) ...[
 | |
|             _buildLeadingIcon(),
 | |
|             SizedBox(width: 3.h),
 | |
|           ],
 | |
|           Expanded(child: content),
 | |
|         ],
 | |
|       ),
 | |
|     );
 | |
|   }
 | |
| 
 | |
|   Widget _buildLeadingIcon() {
 | |
|     return Container(
 | |
|         height: 40.h,
 | |
|         width: 40.h,
 | |
|         margin: EdgeInsets.only(right: 10.h),
 | |
|         padding: EdgeInsets.all(8.h),
 | |
|         decoration: RoundedRectangleBorder().toSmoothCornerDecoration(borderRadius: 10.h, color: AppColors.greyColor),
 | |
|         child: Utils.buildSvgWithAssets(icon: leadingIcon!));
 | |
|   }
 | |
| 
 | |
|   Widget _buildLabelText() {
 | |
|     return Text(
 | |
|       labelText,
 | |
|       style: TextStyle(
 | |
|         fontSize: 12.fSize,
 | |
|         fontWeight: FontWeight.w500,
 | |
|         color: Color(0xff898A8D),
 | |
|         letterSpacing: -0.2,
 | |
|         height: 18 / 12,
 | |
|       ),
 | |
|     );
 | |
|   }
 | |
| 
 | |
|   Widget _buildDropdown(BuildContext context) {
 | |
|     return GestureDetector(
 | |
|       onTap: isEnable
 | |
|           ? () async {
 | |
|               final renderBox = context.findRenderObject() as RenderBox;
 | |
|               final offset = renderBox.localToGlobal(Offset.zero);
 | |
|               final selected = await showMenu<String>(
 | |
|                 context: context,
 | |
|                 position: RelativeRect.fromLTRB(
 | |
|                   offset.dx,
 | |
|                   offset.dy + renderBox.size.height,
 | |
|                   offset.dx + renderBox.size.width,
 | |
|                   0,
 | |
|                 ),
 | |
|                 items: dropdownItems
 | |
|                     .map(
 | |
|                       (e) => PopupMenuItem<String>(
 | |
|                         value: e,
 | |
|                         child: Text(
 | |
|                           e,
 | |
|                           style: TextStyle(
 | |
|                             fontSize: 14.fSize,
 | |
|                             height: 21 / 14,
 | |
|                             fontWeight: FontWeight.w500,
 | |
|                             letterSpacing: -0.2,
 | |
|                           ),
 | |
|                         ),
 | |
|                       ),
 | |
|                     )
 | |
|                     .toList(),
 | |
|                 shape: RoundedRectangleBorder(
 | |
|                   borderRadius: BorderRadius.circular(12),
 | |
|                 ),
 | |
|               );
 | |
| 
 | |
|               if (selected != null && onChange != null) {
 | |
|                 onChange!(selected);
 | |
|               }
 | |
|             }
 | |
|           : null,
 | |
|       child: Row(
 | |
|         mainAxisAlignment: MainAxisAlignment.spaceBetween,
 | |
|         crossAxisAlignment: CrossAxisAlignment.center,
 | |
|         children: [
 | |
|           Expanded(
 | |
|             child: Text(
 | |
|               (selectedValue == null || selectedValue!.isEmpty) ? hintText : selectedValue!,
 | |
|               textAlign: TextAlign.left,
 | |
|               textDirection: TextDirection.ltr,
 | |
|               style: TextStyle(
 | |
|                 fontSize: 14.fSize,
 | |
|                 height: 21 / 14,
 | |
|                 fontWeight: FontWeight.w500,
 | |
|                 color: (selectedValue != null && selectedValue!.isNotEmpty) ? const Color(0xff2E3039) : const Color(0xffB0B0B0),
 | |
|                 letterSpacing: -0.2,
 | |
|               ),
 | |
|             ),
 | |
|           ),
 | |
|           if (hasSelectionCustomIcon && selectionCustomIcon != null) Utils.buildSvgWithAssets(icon: selectionCustomIcon!) else const Icon(Icons.keyboard_arrow_down_outlined),
 | |
|         ],
 | |
|       ),
 | |
|     );
 | |
|   }
 | |
| }
 |