From 1d4be99b060420faa293c40074ba2d3f93379c2c Mon Sep 17 00:00:00 2001 From: Sachin S P <52343650+SachinPremkumar@users.noreply.github.com> Date: Thu, 6 Feb 2025 09:03:17 +0530 Subject: [PATCH] RCF-1132 DropDown value not selected properly (#510) Signed-off-by: sachin.sp Co-authored-by: sachin.sp --- .../custom_dropdown_cupertino_picker.dart | 129 ++++++++++++++++++ .../widgets/document_upload_control.dart | 84 ++++++------ 2 files changed, 169 insertions(+), 44 deletions(-) create mode 100644 lib/ui/process_ui/widgets/custom_dropdown_cupertino_picker.dart diff --git a/lib/ui/process_ui/widgets/custom_dropdown_cupertino_picker.dart b/lib/ui/process_ui/widgets/custom_dropdown_cupertino_picker.dart new file mode 100644 index 00000000..cc8c7341 --- /dev/null +++ b/lib/ui/process_ui/widgets/custom_dropdown_cupertino_picker.dart @@ -0,0 +1,129 @@ +/* + * Copyright (c) Modular Open Source Identity Platform + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + * +*/ + +import 'package:flutter/cupertino.dart'; +import 'package:flutter/material.dart'; +import 'package:registration_client/utils/app_config.dart'; + +class CustomCupertinoDropDownPicker extends StatefulWidget { + final AsyncSnapshot snapshot; + final double itemExtent; + final Widget selectionOverlay; + final double diameterRatio; + final Color? backgroundColor; + final double offAxisFraction; + final bool useMagnifier; + final double magnification; + final double squeeze; + final String? initialValue; + final void Function(String) onSelectedItemChanged; + final TextStyle? selectedStyle; + final TextStyle? unselectedStyle; + + const CustomCupertinoDropDownPicker({ + Key? key, + required this.snapshot, + required this.itemExtent, + required this.onSelectedItemChanged, + this.selectedStyle, + this.unselectedStyle, + this.backgroundColor, + this.squeeze = 1.45, + this.diameterRatio = 1.1, + this.magnification = 1.0, + this.offAxisFraction = 0.0, + this.useMagnifier = false, + this.selectionOverlay = const CupertinoPickerDefaultSelectionOverlay(), + this.initialValue, + }) : super(key: key); + + @override + State createState() => + _CustomCupertinoDropDownPickerState(); +} + +class _CustomCupertinoDropDownPickerState + extends State { + late int _selectedIndex; + late final FixedExtentScrollController _scrollController; + + @override + void initState() { + super.initState(); + _selectedIndex = _getInitialSelectedIndex(); + _scrollController = + FixedExtentScrollController(initialItem: _selectedIndex); + WidgetsBinding.instance.addPostFrameCallback((_) { + _scrollController.jumpToItem(_selectedIndex); + }); + } + + int _getInitialSelectedIndex() { + if (widget.initialValue != null && widget.snapshot.hasData) { + List items = + (widget.snapshot.data as List).whereType().toList(); + return items.indexOf(widget.initialValue!); + } + return 0; + } + + @override + void dispose() { + _scrollController.dispose(); + super.dispose(); + } + + @override + Widget build(BuildContext context) { + if (widget.snapshot.connectionState == ConnectionState.waiting) { + return const Center(child: CupertinoActivityIndicator()); + } + + if (!widget.snapshot.hasData || + widget.snapshot.data == null || + (widget.snapshot.data is List && + (widget.snapshot.data as List).isEmpty)) { + return const Center(child: Text("No data available")); + } + + // Convert data to List to avoid type mismatch + List items = + (widget.snapshot.data as List).whereType().toList(); + + return CupertinoPicker.builder( + childCount: items.length, + squeeze: widget.squeeze, + itemExtent: widget.itemExtent, + scrollController: _scrollController, + useMagnifier: widget.useMagnifier, + diameterRatio: widget.diameterRatio, + magnification: widget.magnification, + backgroundColor: widget.backgroundColor, + offAxisFraction: widget.offAxisFraction, + selectionOverlay: widget.selectionOverlay, + onSelectedItemChanged: (index) { + setState(() => _selectedIndex = index); + widget.onSelectedItemChanged(items[index]); + }, + itemBuilder: (context, index) => ListTile( + title: Center( + child: Text( + items[index], + style: index == _selectedIndex + ? widget.selectedStyle + : widget.unselectedStyle, + ), + ), + trailing: Icon( + Icons.check, + size: 28, + color: index == _selectedIndex ? dropDownSelector : Colors.white, + ), + ), + ); + } +} diff --git a/lib/ui/process_ui/widgets/document_upload_control.dart b/lib/ui/process_ui/widgets/document_upload_control.dart index 79e59b4a..ebbd744f 100644 --- a/lib/ui/process_ui/widgets/document_upload_control.dart +++ b/lib/ui/process_ui/widgets/document_upload_control.dart @@ -7,7 +7,6 @@ import 'dart:io'; -import 'package:flutter/cupertino.dart'; import 'package:flutter/foundation.dart'; import 'package:flutter/material.dart'; import 'package:flutter_screenutil/flutter_screenutil.dart'; @@ -16,6 +15,7 @@ import 'package:provider/provider.dart'; import 'package:registration_client/model/upload_document_data.dart'; import 'package:registration_client/pigeon/document_pigeon.dart'; import 'package:registration_client/provider/registration_task_provider.dart'; +import 'package:registration_client/ui/process_ui/widgets/custom_dropdown_cupertino_picker.dart'; import 'package:registration_client/ui/scanner/custom_scanner.dart'; import 'package:flutter_gen/gen_l10n/app_localizations.dart'; import 'package:registration_client/ui/scanner/preview_screen.dart'; @@ -77,12 +77,12 @@ class _DocumentUploadControlState extends State { _getListOfReferenceNumber(); } - _getPreRegData(Field e){ + _getPreRegData(Field e) { Map value = registrationTaskProvider.preRegistrationData; - if(value.isNotEmpty){ - for(String? key in value.keys) { + if (value.isNotEmpty) { + for (String? key in value.keys) { Object? values = value[key]; - if(e.id == key) { + if (e.id == key) { if (values is Map) { doc.title = values["value"]; globalProvider.fieldInputValue[e.id!] = doc; @@ -283,9 +283,9 @@ class _DocumentUploadControlState extends State { } } - _getListOfReferenceNumber(){ + _getListOfReferenceNumber() { List langList = context.read().languages; - for(var element in langList){ + for (var element in langList) { setState(() { transliterationLangMapper[element.toString()] = AppLocalizations.of(context)!.referenceNumber(element.toString()); @@ -404,8 +404,11 @@ class _DocumentUploadControlState extends State { child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ - CustomLabel(field: Field(label: transliterationLangMapper,required: false)), - SizedBox( + CustomLabel( + field: Field( + label: transliterationLangMapper, + required: false)), + SizedBox( height: 10.h, ), TextFormField( @@ -669,7 +672,10 @@ class _DocumentUploadControlState extends State { child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ - CustomLabel(field: Field(label: transliterationLangMapper,required: false)), + CustomLabel( + field: Field( + label: transliterationLangMapper, + required: false)), SizedBox( height: 10.h, ), @@ -818,10 +824,7 @@ class _DocumentUploadControlState extends State { void _showDropdownBottomSheet( AsyncSnapshot? snapshot, Field field, BuildContext context) { - setState(() { - documentController.text = snapshot!.data[0]; - doc.title = snapshot.data[0]; - }); + showModalBottomSheet( context: context, shape: const RoundedRectangleBorder( @@ -898,41 +901,34 @@ class _DocumentUploadControlState extends State { ), Expanded( flex: 3, - child: CupertinoPicker( + child: CustomCupertinoDropDownPicker( + snapshot: snapshot, itemExtent: 50, - scrollController: FixedExtentScrollController( - initialItem: 0, + squeeze: 1, + diameterRatio: 20, + selectionOverlay: Container( + width: double.infinity, + decoration: BoxDecoration( + color: solidPrimary.withOpacity(0.075), + ), + ), + selectedStyle: TextStyle( + color: solidPrimary, + fontWeight: FontWeight.w600, + fontSize: 22, + ), + unselectedStyle: TextStyle( + color: Colors.grey[800], + fontSize: 21, ), - onSelectedItemChanged: (int index) { - saveData(snapshot.data[index]); + initialValue: documentController.text, + onSelectedItemChanged: (selectedItem) { + saveData(selectedItem); setState(() { - documentController.text = snapshot.data[index]; - doc.title = snapshot.data[index]; + documentController.text = selectedItem; + doc.title = selectedItem; }); }, - looping: false, - backgroundColor: Colors.white, - children: [ - for (var i = 0; i < snapshot.data.length; i++) ...[ - ListTile( - title: Center( - child: Text( - snapshot.data[i], - style: const TextStyle( - fontSize: 22, - color: dropDownSelector, - fontWeight: FontWeight.w500), - ), - ), - trailing: Icon( - Icons.check, - size: 30, - color: (snapshot.data[i] == documentController.text) - ? dropDownSelector - : Colors.white, - )), - ], - ], ), ), ],