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),
 | 
						|
        ],
 | 
						|
      ),
 | 
						|
    );
 | 
						|
  }
 | 
						|
}
 |