From 2f87f45814a8ebefb3faf42a0ab1f6b70f3ddcdd Mon Sep 17 00:00:00 2001 From: Andre Rossi Date: Thu, 18 May 2023 16:02:41 -0300 Subject: [PATCH 1/2] Add country callback and text editing controller --- lib/src/services/ds_bottom_sheet.service.dart | 4 +- .../widgets/fields/ds_phone_input.widget.dart | 13 +++- .../ds_bottomsheet_countries.widget.dart | 73 ++++++++++--------- sample/lib/main.dart | 2 +- .../showcase/sample_input.showcase.dart | 10 ++- 5 files changed, 57 insertions(+), 45 deletions(-) diff --git a/lib/src/services/ds_bottom_sheet.service.dart b/lib/src/services/ds_bottom_sheet.service.dart index b25e5e41..b15563ba 100644 --- a/lib/src/services/ds_bottom_sheet.service.dart +++ b/lib/src/services/ds_bottom_sheet.service.dart @@ -1,6 +1,7 @@ -import 'package:blip_ds/blip_ds.dart'; import 'package:flutter/material.dart'; +import '../themes/colors/ds_colors.theme.dart'; + class DSBottomSheetService { final BuildContext context; final Widget Function(ScrollController?) builder; @@ -29,7 +30,6 @@ class DSBottomSheetService { Visibility( visible: !hideGrabber, replacement: Container( - height: 7.0, decoration: _border(), ), child: _grabber(), diff --git a/lib/src/widgets/fields/ds_phone_input.widget.dart b/lib/src/widgets/fields/ds_phone_input.widget.dart index a45f04e2..0c28c8a0 100644 --- a/lib/src/widgets/fields/ds_phone_input.widget.dart +++ b/lib/src/widgets/fields/ds_phone_input.widget.dart @@ -15,10 +15,14 @@ import '../utils/ds_bottomsheet_countries.widget.dart'; class DSPhoneInput extends StatelessWidget { final String? hintText; + final TextEditingController controller; + final void Function(DSCountry)? onChangeCountry; DSPhoneInput({ super.key, this.hintText, + required this.controller, + this.onChangeCountry, }); // TODO: get masks considering selected country. @@ -28,7 +32,6 @@ class DSPhoneInput extends StatelessWidget { static const _brazilCode = '+55'; final _dropdownValue = Rx(DSUtils.countriesList.first); - final _inputController = TextEditingController(); late final maskFormatter = MaskTextInputFormatter( mask: _tenDigitsMask, @@ -76,8 +79,10 @@ class DSPhoneInput extends StatelessWidget { _dropdownValue.value = await DSBottomSheetCountries.show(); updatePhoneMask( - phoneNumber: _inputController.text, + phoneNumber: controller.text, ); + + onChangeCountry?.call(_dropdownValue.value); }, ), ), @@ -93,7 +98,7 @@ class DSPhoneInput extends StatelessWidget { left: 8.0, ), child: TextFormField( - controller: _inputController, + controller: controller, onChanged: (value) => updatePhoneMask( phoneNumber: value, ), @@ -124,7 +129,7 @@ class DSPhoneInput extends StatelessWidget { void updatePhoneMask({ required String phoneNumber, }) => - _inputController.value = maskFormatter.updateMask( + controller.value = maskFormatter.updateMask( mask: _dropdownValue.value.code != _brazilCode ? _defaultMask : phoneNumber.replaceAll(RegExp('[^0-9]'), '').length <= 10 diff --git a/lib/src/widgets/utils/ds_bottomsheet_countries.widget.dart b/lib/src/widgets/utils/ds_bottomsheet_countries.widget.dart index 834ab036..935b121e 100644 --- a/lib/src/widgets/utils/ds_bottomsheet_countries.widget.dart +++ b/lib/src/widgets/utils/ds_bottomsheet_countries.widget.dart @@ -4,7 +4,6 @@ import 'package:get/get.dart'; import '../../../blip_ds.dart'; import '../../models/ds_country.model.dart'; -import '../fields/ds_search_input.widget.dart'; abstract class DSBottomSheetCountries { static final showClearButton = RxBool(false); @@ -87,43 +86,45 @@ abstract class DSBottomSheetCountries { } static Widget _builderCountries() { - return Obx( - () => ListView.builder( - itemBuilder: (_, index) { - final country = _filterCountries[index]; - return Obx( - () => Padding( - padding: const EdgeInsets.symmetric( - horizontal: 16.0, - ), - child: Column( - children: [ - DSRadioTile( - value: country, - onChanged: (value) { - selectedCountry.value = value!; - Get.back(result: selectedCountry.value); - }, - title: Row( - children: [ - SvgPicture.asset( - 'assets/svg/flags/${country.flag}.svg', - width: 22.0, - package: DSUtils.packageName, - ), - DSBodyText(' ${country.name} '), - DSBodyText(country.code), - ], + return SafeArea( + child: Obx( + () => ListView.builder( + itemBuilder: (_, index) { + final country = _filterCountries[index]; + return Obx( + () => Padding( + padding: const EdgeInsets.symmetric( + horizontal: 16.0, + ), + child: Column( + children: [ + DSRadioTile( + value: country, + onChanged: (value) { + selectedCountry.value = value!; + Get.back(result: selectedCountry.value); + }, + title: Row( + children: [ + SvgPicture.asset( + 'assets/svg/flags/${country.flag}.svg', + width: 22.0, + package: DSUtils.packageName, + ), + DSBodyText(' ${country.name} '), + DSBodyText(country.code), + ], + ), + groupValue: selectedCountry.value, ), - groupValue: selectedCountry.value, - ), - const DSDivider(), - ], + const DSDivider(), + ], + ), ), - ), - ); - }, - itemCount: _filterCountries.length, + ); + }, + itemCount: _filterCountries.length, + ), ), ); } diff --git a/sample/lib/main.dart b/sample/lib/main.dart index 7d3ff418..dede8682 100644 --- a/sample/lib/main.dart +++ b/sample/lib/main.dart @@ -81,7 +81,7 @@ class HomePage extends StatelessWidget { const Divider(color: DSColors.neutralDarkCity), const SampleWeblinkShowcase(), const Divider(color: DSColors.neutralDarkCity), - const SampleInputShowcase(), + SampleInputShowcase(), ], ), ), diff --git a/sample/lib/widgets/showcase/sample_input.showcase.dart b/sample/lib/widgets/showcase/sample_input.showcase.dart index cb5ddc23..366b2216 100644 --- a/sample/lib/widgets/showcase/sample_input.showcase.dart +++ b/sample/lib/widgets/showcase/sample_input.showcase.dart @@ -2,7 +2,9 @@ import 'package:blip_ds/blip_ds.dart'; import 'package:flutter/material.dart'; class SampleInputShowcase extends StatelessWidget { - const SampleInputShowcase({super.key}); + SampleInputShowcase({super.key}); + + final controller = TextEditingController(); @override Widget build(BuildContext context) { @@ -13,7 +15,11 @@ class SampleInputShowcase extends StatelessWidget { child: Wrap( runSpacing: 8.0, children: [ - DSPhoneInput(), + DSPhoneInput( + controller: controller, + // ignore: avoid_print + onChangeCountry: (country) => print(country.code), + ), DSSearchInput( onClear: () {}, onSearch: (_) {}, From 086ac3bb6e54fe59199d29e06323d314cdb8fbe5 Mon Sep 17 00:00:00 2001 From: Andre Rossi Date: Fri, 19 May 2023 09:20:21 -0300 Subject: [PATCH 2/2] New version --- CHANGELOG.md | 4 ++++ pubspec.yaml | 2 +- 2 files changed, 5 insertions(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index b5418ce5..b7197e9a 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,7 @@ +## 0.0.54 + +- [DSPhoneInput] Add country callback and text editing controller. + ## 0.0.53 - [DSPhoneInput] Add phone input widget with selectable country. diff --git a/pubspec.yaml b/pubspec.yaml index 6c958ce3..134e2c39 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -1,6 +1,6 @@ name: blip_ds description: Blip Design System for Flutter. -version: 0.0.53 +version: 0.0.54 homepage: https://github.com/takenet/blip-ds-flutter#readme repository: https://github.com/takenet/blip-ds-flutter