artflutter / reactive_forms_widgets

Правила сообщества ArtFlutter

Миссия

Сердце ArtFlutter - это люди. Мы ставим интересы людей на первое место и делаем все возможное, чтобы признавать, ценить и уважать всех наших участников по всему миру. Мы приветствуем вклад всех, кто разделяет наши цели и хочет способствовать здоровому и конструктивному подходу в нашем сообществе. В связи с этим, мы приняли эти правила поведения и требуем от всех участников, согласиться и придерживаться этого руководства, чтобы поддерживать атмосферу здорового общения в сообществе.

Не оскорбляйте других людей и не судите людей по их вопросам

Подробнее...

Примеры:

 - child: Visibility для чего этот виджет?
 - Ну судя по названию для рассчета факториала
 
 - Всем привет, а есть где-то примеры как проходит собеседоваение на джуна? Что должен уметь и знать джун?
 - Да, довольно много на просторах интернета.

Если вам кажется что этот вопрос слишком прост, что его можно быстро нагуглить и вообще вопросам такого уровня тут не место - вы не правы.

Начать можно хотя бы с того что практически любой вопрос можно нагуглить и вас с вашим вопросом в следующий раз могут по просить пройти туда же.

А закончить тем что спрашивают не лично "ваше высочество", можно спокойно этот вопрос проигнорировать - на него даст ответ кто-то другой.

Помните что таким поведением после себя вы оставляете таких же токсичных "учителей".

Простое проверочное правило - если в ответ на вопрос вам хочется написать что-то отличное от ответа или уточняющего вопроса - просто воздержитесь.

Не пересекайте линию между иронией и оскорблениями

Помните - участник сообщества по ту сторону не ваш закадычный друг. Он не знает вас, не знает ваш темперамент, не видит вашей мимики и не слышит интонаций. То что в живом общении может показаться невинной шуткой в переписке может быть прочитано и понятно совсем иначе.

Если вы не чувствуете границы - воздержитесь от иронии вовсе

Уважайте чужие точки зрения, даже если они кардинально не совпадают с Вашими

Подробнее...

Противополжоные точки зрения нужны и важны, они позволяют нам взглянуть на проблему под другим углом. Вполне возможно что они сформировались под влиянием не очевидных факторов.

Уважайте их. Ведите вежливую дискуссию. Черпайте информацию и вдохновение - делитесь своим мнением.

Избегайте флуда и разговоров обо всем - используйте личные сообщения

Подробнее...

Мы всячески поддерживаем комуникацию и дружеские отношения. Но есть невидимая грань между тематическим общением и разговоров обо всем. Старайтесь избегать трансляции мемасиков, тиктоков и прочего фонового шума. В купе с реакицей на фоновый шум - чат превращается в поток сознания. Ставится невозможно отфильтровать интересные обсуждения среди флуда ровно как и задать вопрос. Вопрос коллеги просто теряется в этом потоке.

Хочется поделиться мемчинским - есть личные сообщения.

Видите что разговор перетекает на отвлеченные темы - перейдите в личные сообщения.

Хотите помочь человеку но разговор разрастается большим кол-вом уточняющих вопросов и скринов кода - перейдите в личные сообщения.

У нас не банят

Подробнее...

Мы верим в то что каждый способен осознать свою ошибку и изменить свое поведение. В случае нарушений данных правил нарушителю будет ограничена возможность писать сообщения на срок от одного дня до одного месяца. Этого вполне достаточно для вдумчивого чтения правил. В случае систематического нарушения правил вы не оставляете другого варианта как ограничить возможность написания сообщений навсегда.

Эти указания направлены на поддержку сообщества, в котором все люди должны чувствовать себя в безопасности, и иметь возможность внедрять новые идеи и вдохновлять других, в независимости от:

• происхождения
• семейного статуса
• пола
• гендерной принадлежности или формы самоидентификации
• сексуальной ориентации
• родного языка
• возраста
• физических возможностей
• расы и этнической принадлежности
• национального происхождения
• социального статуса
• религии
• географического положения

Открытость, сотрудничество и участие - ключевые аспекты нашей работы. Мы становимся сильнее, благодаря разнообразию и активно привлекаем к участию тех, кто его поддерживает. Это руководство создано для того, чтобы дать возможность различным людям и группам взаимовыгодно взаимодействовать и сотрудничать. В этом документе описывается как ожидаемое, так и запрещенное поведение.

Ожидаемое поведение

Ожидается следующее поведение от всех участников проекта ArtFlutter:

Будьте вежливы

Цените идеи, стили и точки зрения друг друга. Мы не всегда можем согласиться, но несогласие не является оправданием плохих манер. Будьте открыты к разным точкам зрения и к возможности ошибаться. Оставайтесь добрыми и обходительными во всех взаимодействиях и коммуникациях, особенно при обсуждении достоинств и недостатков различных сторон.

Помните о своем воздействии и о том, как ваши слова и поступки могут затрагивать других людей. Будьте прямолинейными, конструктивными и уверенными в своих действиях. Возьмите на себя ответственность за свое влияние на других и свои ошибки, и если кто-то скажет, что они пострадали от ваших слов или действий, внимательно выслушайте, искренне принесите свои извинения и исправьте поведение в будущем.

Будьте прямолинейны, оставаясь профессионалом

Нам, вероятно, следует обсудить, когда критика уважительна, а когда нет. Важно говорить прямо, когда мы с чем-то не согласны или же когда думаем, что что-то можно сделать лучше. Любой человек не хочет отказываться от правды и фактов, которых придерживается. Поэтому вежливо дискутировать иногда сложно, особенно если другие, как нам кажется, не слушают. Даже когда один из собеседников может выслушать точку зрения другого, все еще сложно слышать неуважительные комментарии. Нам нужно быть честным и откровенными, но при этом проявлять уважение к собеседнику.

Будьте всесторонни

Ищите различные точки зрения. Разнообразие взглядов и людей в командах приносит что-то новое, даже если это доставляет неудобства при обсуждении. Поддерживайте все мнения. Помогайте людям с другими точками зрения слушать и быть услышанными. Особенно важно уметь отступить если ваше мнение приоритетно в дискуссии, чтобы дать возможность другим выслушать мнение оппонента. Не упускайте из виду, сколько времени в разговоре занимает обсуждение точки зрения доминирующего участника.

Включайте всех в коммуникацию, уважая и делая все возможное чтобы облегчить участие людям, если:

• для них язык, на котором вы общаетесь, не является родным
• принадлежат другой культуре
• используют местоимения, отличные от «он» или «она»
• живут в других временных зонах
• cталкиваются с любыми другими затруднениями при общении

Понимайте разные точки зрения

Наша цель не должна заключаться в том, чтобы «выиграть» в каждом разногласии или споре. Более продуктивная цель - быть открытыми для идей, которые делают лучше наши собственные идеи. Стремитесь быть примером разностороннего мышления. «Победа» - это когда разные точки зрения делают нашу работу лучше.

Уважайте наши сходства и различия

Сообщество ArtFlutter объединяет различные культуры и их различия могут охватывать все: от официальных религиозных обрядов до личных привычек в одежде. Будьте уважительны к людям с различными культурными практиками, позициями и убеждениями. Работайте над устранением собственных предубеждений, предрассудков и дискриминационного поведения. Используйте предпочтительный для людей способ обращения(включая местоимения) и соответствующий тон голоса. Уважайте право людей на неприкосновенность частной жизни и конфиденциальность. Будьте открыты для обучения других также как и для самообразования.

Подавайте пример

Сопоставляя свои действия с вашими словами, вы становитесь человеком на которого другие хотят быть похожими. Ваши действия влияют на поведение других людей и отражаются таким образом, что становятся очень ценным опытом для наших общих результатов. Создавайте в своем окружении условия для сплоченности. Будьте ответственны за свое поведение, а также привлекайте к этому других.

Неприемлемое поведение

Ниже перечислены виды поведения, которые считаются неприемлемыми в соответствии с нашими принципами.

Насилие и угрозы насилия

Угрозы насилия недопустимы ни в какой из форм. Это включает подстрекательство к насилию в отношении любого лица, или поощрение нанесения себе вреда человеком. А также сюда входит публикация или угроза публикации личной информации других лиц в Интернете.

Агрессия по отношению к человеку

Конфликты неизбежно возникнут, но никакое недовольство никогда не должно превращаться в личную агрессию. Нельзя оскорблять, унижать или принижать других. Нападки на кого-то за их мнение, убеждения или идеи неприемлемы. Когда мы с чем-то не согласны, или же считаем, что что-то можно сделать лучше - важно говорить об этом прямо. В таких обсуждениях необходимо сохранять профессионализм и уважение ко всем участникам, и не отходить от предмета дискуссии.

Темы для обсуждения, которых следует избегать

Неприемлемыми или оскорбительными считаются фразы, касающаяся:

• Происхождения
• Семейного статуса
• Пола
• Гендерной идентичности
• Семейного положения
• Сексуальной ориентации
• Родного языка
• Возраста
• Инвалидности
• Расы / этнической принадлежности
• Национального происхождения
• Социального статуса
• Религии
• Географического положения
• Другие оскорбительные темы

Также неприемлемым считается намеренное обращение к кому-то с неидентифицированным полом, и / или подвергание сомнению гендерную самоидентификацию личности. Если вы не уверены, что слово не оскорбительно, не используйте его. Все это также касается косвенной дискриминации; Когда вас просят прекратить подобное поведение, сразу же сделайте это.Понимайте разные точки зрения

Наша цель не должна заключаться в том, чтобы «выиграть» в каждом разногласии или споре. Более продуктивная цель - быть открытыми для идей, которые делают лучше наши собственный идеи. Стремитесь быть примером разностороннего мышления. «Победа» - это когда разные точки зрения делают нашу работу лучше.

Подстрекательство

Мы будем относиться к подстрекательству так же, как к самому нарушению, и применять те же меры.

Последствия

Неприемлемое поведение любого члена сообщества, в том числе и с полномочиями по принятию решений не будет допускаться. Преднамеренные усилия по исключению людей неприемлемы и будут рассмотрены соответствующим образом.

Жалобы о преследовании/дискриминации будут быстро и тщательно изучаться. Будут приняты соответствующие меры для решения этой проблемы. Любой, кого попросили прекратить такого рода поведение, должен сразу же сделать это. Нарушение этих рекомендаций может привести к тому, что вас попросят покинуть помещение или онлайн-пространство временно или в течении всего события, быть недопущением к участию в мероприятиях, или же исключенным на неопределенный срок.

Представители проекта ArtFlutter также несут ответственность по всем вышеперечисленным пунктам. Представители ArtFlutter, нарушающие эти правила, будут подвергаться дисциплинарным наказаниям вплоть до прекращения сотрудичества с проектом ArtFlutter.

Кроме того, любые участники, которые злоупотребляют отчетами о нарушениях будут считаться нарушающими эти руководящие принципы со всеми вытекающими последствиями. Ложные сообщения, особенно из чувства мести, или же необоснованное исключение участника из офлайн или онлайн пространства являются недопустимыми.

Вопросы

Если у вас есть вопросы по этим рекомендациям, то мы настоятельно просим их озвучить. Если вы организуете мероприятие или активность, мы будем рады если вы обратитесь к нашим советам советам при планировании вступительной речи на вашем мероприятии или активности. Ваше мнение важно для нас и вы всегда получите ответ в течении 24 часов (либо в течении следующего буднего дня, если это выходные).

Лицензия

Creative Commons Attribution-ShareAlike license

Эти рекомендации были адаптированы к изменениям из Mozilla’s original Community Participation Guidelines, the Ubuntu Code of Conduct, Mozilla’s View Source Conference Code of Conduct, и the Rust Language Code of Conduct, который базирован на Stumptown Syndicate’s Citizen Code of Conduct. Дополнительный текст из LGBTQ in Technology Code of Conduct and the WisCon code of conduct.

С кем связаться Задать вопросы об этом наборе правил можно по адресу электронной почты [email protected] или в Telegram @vasilich6107

reactive_forms_widgets's Issues

Allow nullable dates for ReactiveDateTimePicker

My form has a date field, which is optional but the type of ReactiveDateTimePicker is hard coded to DateTime.

My form:

final form = FormGroup({
      'firstMonth': FormControl<DateTime>(
        value: agreement?.firstMonth,
        validators: [Validators.required],
      ),
      'lastMonth': FormControl<DateTime?>(
        value: agreement?.lastMonth,
        validators: [],
      ),
    });

What should I do in this case?

How to format date and time in the input field of ReactiveDateTimePicker?

I'm trying to figure out how to format date and time in the input field of ReactiveDateTimePicker. Currently, it shows as 2020/09/17 21:51 in the input field. I'd like it to show in other formats probably with DateFormat. Is it possible? Please advice.

reactive_phone_form_field country code position moved to right

Hi,

After updating reactive_phone_form_field position of the country code has moved to the right but trigger to open country selector remains on the left.

I was able to change position by setting textDirection: TextDirection.ltr

Is it a bug or we need to set text directions now ?

ReactiveImagePicker - multiple image picker example

Thanks for the amazing work guys. I had a quick question - when would this package have support for flutter 2.x?

And another question related to ReactiveImagePicker - can it pic multiple images.

I am trying to figure out how to provide initial data for image/s ( could not find in the example),
On the edit form can it load an image from URL, if the user replaces/select a new image, can it provide a new path or else ignore it.

I am trying to build something like

Reactive pin put field, onDone

How would I implement an on done action when the field is filled?

type 'Null' is not a subtype of type 'String' in type cast

type 'Null' is not a subtype of type 'String' in type cast
Error in reactive_awesome_select
ReactiveSmartSelectSingle

ReactiveDateTimePicker is missing touched handling

The widget should probably set the touched field of the control when a tap occurs.

ReactiveImagePicker Pass value to Firebase

hi
I'm using ReactiveImagePicker with ReactiveFormBuilder
I have difficult to passing value from ReactiveImagePicker ReactiveFormBuilder to the Firebase

 
   FormGroup form() => fb.group({
        'ownerName': FormControl<String>(
            value: ownerName, validators: [Validators.required]),
        'ownerImage':
            FormControl<ImageFile>(validators: [Validators.required]),
      });

   var _image = data["ownerImage"]; //// data from ReactiveFormBuilder
  File file =File(_image);   ///  pass value to File (_error )

    await ref.putFile(file);   Upload file 
   var  imageurl = await ref.getDownloadURL(); // get url Image 

 
 

reactive_image_picker
reactive_forms 10.6.7
stackoverflow

Expose initialValue for ReactiveRawAutocomplete

Hi there,

great work thanks a lot!
I have a minor thing which could be fixed super quickly. It would be cool if you could expose the initialValue for the ReactiveRawAutocomplete Widget.
The background is that I might want to feed the autocomplete suggestions with a data model which is more complex than just a string. With the displayStringForOption function I can control how my data model is represented as a string. It would be great if I could have the same control for the initialValue. Right now the data model is simply parsed to string:

  @override
  void initState() {
    super.initState();

    final initialValue = value;
    _textController = TextEditingController(
        text: initialValue == null ? '' : initialValue.toString());
  }

it would be great to have something like that:

  @override
  void initState() {
    super.initState();

    final initialValue = widget.initialValue ?? value;
    _textController = TextEditingController(
        text: initialValue == null ? '' : initialValue.toString());
  }

how to disabled ReactiveDropdownSearch and ReactiveDateTimePicker

Hi I love using reactive forms widgets specially ReactiveDropdownSearch and ReactiveDateTimePicker .
I have an app where in some cases i need to disable ReactiveDropdownSearch and ReactiveDateTimePicker in my form so that the user cannot click and pick a value. however, I am not able to find out how to do it. is there an attribute like disable: true that i can use in these two widgets so that they become disabled (gray out) and nothing happens when user click on them?

thanks
ER

Compatibility issue

It is not compatible with reactive form version 9.1.0. Any update regarding that ?

Reactive datetime picker does not work with reactive_forms v^12.0.0

I get the following error when I install dependencies for my project
Because reactive_date_time_picker >=0.2.0 depends on reactive_forms ^11.0.0 and builder_app depends on reactive_forms ^12.0.0, reactive_date_time_picker >=0.2.0 is forbidden. So, because builder_app depends on reactive_date_time_picker ^0.2.2, version solving failed.

Please update the dependency of the package so that it can be used with the latest reactive form.

reactive_touch_spin doesn't display programmatic value updates

reactive_touch_spin only displays updated values from clicking the up and down arrows to change the number, not from resetting the form values or calling updateValue() or any of the other numerous ways of changing the value programmatically using reactive_forms.

ReactiveImagePicker / ReactiveFilePicker

I'd love to see a ReactiveImagePicker and/or a ReactiveFilePicker.

font size in ReactiveDropdownSearch

Hi, I would like to know how to change the font size in ReactiveDropdownSearch for the selected items and for the list of items in the popup. I tried using style like

  style: TextStyle(
          fontSize: 20,
      ),

but ReactiveDropdownSearch doesnt recognize it.

here is my code

Widget frequencyField(BuildContext context) {
    return  ReactiveDropdownSearch<String>(
      formControlName: frequencyLabel,
      mode: ReactiveDropdownSearchMode.DIALOG,
      items: ["Weekly", "Bi-Weekly", "Monthly", 'Quarterly', 'Yearly', 'One Time'],
     
      decoration: InputDecoration(
        border: new OutlineInputBorder(
            borderSide: new BorderSide(color: Colors.teal)),
        // labelText: incomeAmount,
        prefixIcon: Icon(Icons.refresh),
        contentPadding: EdgeInsets.fromLTRB(0,6.5,0,6.5),
        labelStyle: TextStyle(fontSize: text_size_18),
      ),
      label: frequencyLabel,
      showSearchBox: true,
      popupTitle: Container(
        height: margin_50dp,
        decoration: BoxDecoration(
          color: Theme.of(context).primaryColorDark,
          borderRadius: BorderRadius.only(
            topLeft: Radius.circular(10),
            topRight: Radius.circular(10),
          ),
        ),
        child: Center(
          child: Text(
            frequencyLabel,
            style: TextStyle(
              fontSize: 24,
              fontWeight: FontWeight.bold,
              color: Colors.white,
            ),
          ),
        ),
      ),
      popupShape: RoundedRectangleBorder(
        borderRadius: BorderRadius.circular(margin_10dp),
      ),
    );
  }

take a look at the pics attached at the text circled in red. I want to increase the font size of the selected item as well as the items in the popup screen

thanks in advance

ReactiveMultiImagePicker open and close when i try to pick images

ReactiveMultiImagePicker(
enableCamera: true,
maxImages: 20,
formControlName: pickerControlName,
imagePickerBuilder: (pickImage, images, onChange) {
return GestureDetector(
onTap: pickImage,
child: Container(
child: Text("Upload Images"),
),
);
},
);

No named parameter with the name 'selectorNavigator'

Looks like new update for PhoneFormField does not have selectorNavigator parameter and it's causing an error.

reactive_forms_widgets/packages/reactive_phone_form_field/lib/reactive_phone_form_field.dart

Line 177 in 22258dd

selectorNavigator: selectorNavigator,

ImagePickerWidget doesn't take "enable" property

ImagePickerWidget doesn't take "enable" property from ReactiveImagePicker

Support flutter 3.0

See this error:

../../../appdev/flutter/.pub-cache/hosted/pub.flutter-io.cn/dropdown_search-3.0.1/lib/dropdown_search.dart:519:26: Warning: Operand of null-aware operation '?.' has type 'WidgetsBinding' which excludes null.

• 'WidgetsBinding' is from 'package:flutter/src/widgets/binding.dart' ('../../../appdev/flutter/packages/flutter/lib/src/widgets/binding.dart').
  WidgetsBinding.instance?.addPostFrameCallback((_) {
  ^
  ../../../appdev/flutter/.pub-cache/hosted/pub.flutter-io.cn/dropdown_search-3.0.1/lib/dropdown_search.dart:551:26: Warning: Operand of null-aware operation '?.' has type 'WidgetsBinding' which excludes null.
• 'WidgetsBinding' is from 'package:flutter/src/widgets/binding.dart' ('../../../appdev/flutter/packages/flutter/lib/src/widgets/binding.dart').
  WidgetsBinding.instance?.addPostFrameCallback((_) {
  ^

General use

How to use with items type DropdownMenuItem in ReactiveDropdownSearch?

Unable to add reactive_forms_widget to my project

I created a new flutter project and did the following:

flutter pub add reactive_forms This command ran fine.

After that i ran the following and I am getting an error.

flutter pub add reactive_forms_widgets

Because reactive_forms >=9.1.0 depends on intl ^0.17.0 and flutter_touch_spin >=1.0.1 <2.0.0-nullsafety.0 depends on intl ^0.16.1, reactive_forms >=9.1.0 is incompatible with flutter_touch_spin >=1.0.1 <2.0.0-nullsafety.0.
And because every version of reactive_forms_widgets depends on flutter_touch_spin ^1.0.1, reactive_forms >=9.1.0 is incompatible with reactive_forms_widgets.
So, because ftest depends on both reactive_forms ^11.0.0 and reactive_forms_widgets any, version solving failed.
pub finished with exit code 65

reactive_pin_code_fields exception when popping route

This is a minimal app to reproduce the error: go to form page and then pop it, using the buttons.

import 'package:flutter/material.dart';
import 'package:reactive_forms/reactive_forms.dart';
import 'package:reactive_pin_code_fields/reactive_pin_code_fields.dart';

void main() => runApp(const MyApp());

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Material App',
      routes: {
        'form_page': (context) => const FormPage(),
      },
      home: Builder(
        builder: (context) {
          return Scaffold(
            appBar: AppBar(
              title: const Text('Material App Bar'),
            ),
            body: Center(
              child: ElevatedButton(
                onPressed: () => Navigator.of(context).pushNamed('form_page'),
                child: const Text("Go to form"),
              ),
            ),
          );
        },
      ),
    );
  }
}

class FormPage extends StatefulWidget {
  const FormPage({
    Key? key,
  }) : super(key: key);

  @override
  State<FormPage> createState() => _FormPageState();
}

class _FormPageState extends State<FormPage> {
  final formControl = FormControl<String>(value: '');

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            ReactiveCodeTextField(
              formControl: formControl,
            ),
            ElevatedButton(
              onPressed: () => Navigator.of(context).pop(),
              child: const Text("Pop"),
            )
          ],
        ),
      ),
    );
  }
}

class ReactiveCodeTextField extends StatelessWidget {
  final FormControl<dynamic>? formControl;

  const ReactiveCodeTextField({
    Key? key,
    this.formControl,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return ReactivePinCodeTextField(
      length: 5,
      formControl: formControl,
    );
  }
}

This is the exception: The following assertion was thrown while finalizing the widget tree: A FocusNode was used after being disposed.

I am using the latest version of the packages reactive_forms and reactive_pin_code_fields. Is this a bug or something I am doing wrong?

_resolveFormControl has a local var called control and there is a state variable called control

turn on more lint rules and fix your code. might be buggy.

ReactiveSegmentedControl - displays a 'line' underneath the component

hi, why is this line displaying underneath when the ReactiveSegmentedControl renders ? I could not find a way to get rid of it. Appreciate if you can let me know, thanks

ReactiveDropdownSearchMultiSelection Hint Text alignment

Info

Flutter 2.5.2
reactive_forms: ^10.6.2
reactive_dropdown_search: ^0.5.0

Problem:

ReactiveDropdownSearchMultiSelection hint Text does not vertically center align with dropDownButton the code I use is given down below.

ReactiveDropdownSearchMultiSelection<String, String>(
              formControlName: SetupFromFieldsName.cuisine,
              dropdownSearchTextAlignVertical: TextAlignVertical.top,
              decoration: InputDecoration(
                filled: true,
                fillColor: KColors.shade300,
                hintText: 'HintText ' * 10,
                hintStyle: context.textTheme.subtitle1?.copyWith(
                  textBaseline: TextBaseline.alphabetic,
                  color: KColors.textLight,
                  height: 1.9,
                ),
                contentPadding: const EdgeInsets.symmetric(vertical: 8),
                border: const OutlineInputBorder(),
              ),
              mode: Mode.BOTTOM_SHEET,
              showSelectedItems: true,
              items: const [
                "Brazil",
                "Italia",
                "Tunisia",
                'Canada',
                'France',
              ],
              showSearchBox: true,
            )

but If I select the Item it works fine

Widgets don't take disabled property into account

Widgets added by this package don't acknowledge the disabled property of FormControl.

Widget wrappers roadmap

I will be tracking here the list of widgets that I plan to implement wrappers to.
Fill free to suggest your favourite one)

https://pub.dev/packages/flutter_markdown

https://pub.dev/packages/getwidget

https://github.com/Origogi/Flutter-Credit-Card-Input-Form

https://pub.dev/packages/advance_image_picker

+ https://pub.dev/packages/textfield_tags

https://pub.dev/packages/easy_mask

https://pub.dev/packages/mask_text_input_formatter

https://pub.dev/packages/input_slider

https://api.flutter.dev/flutter/cupertino/CupertinoDatePicker-class.html

https://api.flutter.dev/flutter/cupertino/CupertinoPicker-class.html

https://api.flutter.dev/flutter/cupertino/CupertinoSearchTextField-class.html

https://api.flutter.dev/flutter/cupertino/CupertinoTimerPicker-class.html

https://github.com/henryleunghk/flutter-native-text-view

https://pub.dev/packages/intl_phone_field

https://pub.dev/packages/otp_autofill

https://pub.dev/packages/cool_dropdown

https://pub.dev/packages/syncfusion_flutter_datepicker

https://pub.dev/packages/syncfusion_flutter_gauges

https://pub.dev/packages/syncfusion_flutter_sliders

Upgrade to depend on reactive_forms 11

Never mind me, XD I just needeed to update my version of reactive_touch_spin and can't delete this issue.

how to add the dynamic validation mustMatch

I try to add validation dynamically like below

this.form.validators.addAll(
{
Validators.mustMatch('password', 'confirmPassword'),
},
);

reactive_multi_image_picker how to get file path ?

What type of reactive field do you think is missing?

This is an umbrella issue where I want to collect all requests for missing field types.

Leave here your favorite packegaes which do not have wrappers. Write several words about the reasons you need particular package. Note that packages without non-nullability support will be ignored.

If you want any custom control to be implemented - write a full description of functionality and attach the design.

There is no guarantee that your request will be fulfilled. At least we can collect and arrange community requirements for further contributors.

[Feature] Ability to customize displayed DateFormat separately

Currently there is only one date format customization field, which governs both the displayed date format shown in the UI as well that that stored in the field's value.

Can we have a separate property for customizing the displayed UI date format from the one stored in the field.

Below is an example.

I need the user to have the ability to select both a date and time, however, in my displayed date format, I just want to show the time aspect, so my date format would be something like this DateFormat('hh:mm a')

The problem with this is that the date aspect of the originally selected date is completely lost, and defaults to 1970 (Unix Epoch start).

It would be nice to have the ability to customize the displayed format, but still have the selected format in the field's value. The displayed format can use the DateTime object of the selected date to apply the formatting to.

Discontinued on pub.dev ?

Hi,

On pub.dev, this package is tagged as discontinued but seems to be active here. Is this an error on pub.dev or is this package aborted ?

ReactiveDateTimePicker 12H Time

Using the ReactiveDateTimePicker widget, how can I accomplish a 12H time format? It seems as though I can only get the 24H format. Also, it seems that no matter what, the ReactiveDateTimePicker outputs a DateTime object, even when the type is set to time.

Not able to get selected flag for Object type value in ReactiveDropdownSearch

selected flag is always false for reactive dropdown search. I want to highlight the selected item, but selected is always false.

FormControl
'businessIndustry':FormControl<StaticData>(validators: [Validators.required])

Widget

ReactiveDropdownSearch<StaticData, StaticData>(
                    popupTitle: const Center(
                      child: Padding(
                        padding: EdgeInsets.all(kDefaultPadding),
                        child: Text('Select Business Industry'),
                      ),
                    ),
                    popupSafeArea: const PopupSafeArea(),
                    popupShape: RoundedRectangleBorder(
                      borderRadius: BorderRadius.circular(kDefaultBorderRadius),
                    ),
                    popupItemBuilder: (context, item, selected) {
                      return ListTile(
                        title: selected? H5(item.name!) : Text(item.name!),
                      );
                    },
                    formControlName: 'businessIndustry',
                    mode: Mode.BOTTOM_SHEET,
                    decoration: const InputDecoration(
                      prefixIcon: Icon(Icons.apartment),
                      hintText: 'Select Business Industry',
                      contentPadding: EdgeInsets.zero,
                    ),
                    items: staticData.industries,
                    validationMessages: (control) => {
                      ValidationMessage.required: kRequiredFieldError,
                    },
                  )

Model

class StaticData {
  int? id;
  String? name;
  StaticData({
    this.id,
    this.name,
  });

  StaticData copyWith({
    int? id,
    String? name,
  }) {
    return StaticData(
      id: id ?? this.id,
      name: name ?? this.name,
    );
  }

  Map<String, dynamic> toMap() {
    return {
      'id': id,
      'name': name,
    };
  }

  factory StaticData.fromMap(Map<String, dynamic> map) {
    return StaticData(
      id: map['id'],
      name: map['name'],
    );
  }

  String toJson() => json.encode(toMap());

  factory StaticData.fromJson(String source) =>
      StaticData.fromMap(json.decode(source));

  @override
  String toString() => '$name';

  @override
  bool operator ==(Object other) {
    if (identical(this, other)) return true;

    return other is StaticData && other.id == id && other.name == name;
  }

  bool isEqual(StaticData other) {
    return id! == other.id;
  }

  @override
  int get hashCode => id.hashCode ^ name.hashCode;

}

Autocomplete add a stringToViewModel function

Hi there,

I had another idea how to improve the ReactiveRawAutocomplete Widget. Right now only values that already exist can be selected and field.didChange is only called onSelected. It would be great if we could use the same input field also for creating a new instance of T when they not yet exist. I prepared an example:

here

In the example you can select existing fruits from the autocomplete but also create new ones using the same input field.

Reactive fancy password field obscure text not working

The obscureText parameter is not being passed to the wrapped child component "FancyPasswordField".

Additionally, I'm not sure if the issue lies in my code or the wrapped library but I'm unable to get the hide/show button to show as is shown on the first demo on their page. I've tried changing all the parameters relating to hiding/showing. This is not an issue if I can implement it myself using the obscureText parameter with an icon button.

How to handle on ReactiveDateTimePicker Change

I want to count the days between going and coming back
My question is how to get the value when selecting the date ?

My code
` ReactiveDateTimePicker(
firstDate: DateTime.now(),
formControlName: 'returnDate',
type: ReactiveDatePickerFieldType.dateTime,
decoration: const InputDecoration(
labelText: 'Return Date',
border: OutlineInputBorder(),
helperText: '',
suffixIcon: Icon(Icons.calendar_today),
),
validationMessages: (control) {
return {'required': 'required'};
},
// valueAccessor: _onChange(va)

                      ),`

https://pub.dev/packages/reactive_date_time_picker/example

Add ReactiveDateRangePicker (or add it to the existing DateTimePicker)

Flutter recently came out and supported a DateTime range picker which would save me and others some fields (merging start and end dates for example).

[reactive_date_time_picker] How can I translate into other language

e.g.
January -> "一月" in Chinese

Can't pass FocusNode to ReactivePhoneFormField

I'm trying to pass a FocusNode to a ReactivePhoneFormField instance but I keep getting an exception. Here is a minimum example of a widget suffering from this issue:

class MXAReactivePhoneInput extends StatefulWidget {
  final String formControlName;
  final TitleData? title;
  final bool suggestAutofill;

  const MXAReactivePhoneInput({
    Key? key,
    required this.formControlName,
    this.title = const TitleData(
      title: 'Número de teléfono',
      icon: Icons.phone,
    ),
    this.suggestAutofill = false,
  }) : super(key: key);

  @override
  State<MXAReactivePhoneInput> createState() => _MXAReactivePhoneInputState();
}

class _MXAReactivePhoneInputState extends State<MXAReactivePhoneInput> {
  late FocusNode _focusNode;

  @override
  void initState() {
    super.initState();
    _focusNode = FocusNode();
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        FieldTitle(title: widget.title),
        SizedBox(
          height: 100,
          child: ReactivePhoneFormField(
            focusNode: _focusNode,
            formControlName: widget.formControlName,
          ),
        ),
      ],
    );
  }

  @override
  void dispose() {
    super.dispose();
    _focusNode.dispose();
  }
}

When my MXAReactivePhoneInput get rendered, I get following trace:

════════ Exception caught by widgets library ═══════════════════════════════════
The following assertion was thrown building ReactivePhoneFormField<dynamic>(dependencies: [_InheritedTheme, _LocalizationsScope-[GlobalKey#eefe0]], state: _ReactivePhoneFormFieldState<dynamic>#6ecdc):
A PhoneController was used after being disposed.

Once you have called dispose() on a PhoneController, it can no longer be used.
The relevant error-causing widget was
ReactivePhoneFormField<dynamic>
lib/…/forms/mxa_reactive_phone_input.dart:44
When the exception was thrown, this was the stack
#0      ChangeNotifier._debugAssertNotDisposed.<anonymous closure>
package:flutter/…/foundation/change_notifier.dart:114
#1      ChangeNotifier._debugAssertNotDisposed
package:flutter/…/foundation/change_notifier.dart:120
#2      ChangeNotifier.addListener
package:flutter/…/foundation/change_notifier.dart:173
#3      _PhoneFormFieldState.initState
package:phone_form_field/…/widgets/phone_form_field.dart:235
#4      StatefulElement._firstBuild
package:flutter/…/widgets/framework.dart:4893
#5      ComponentElement.mount
package:flutter/…/widgets/framework.dart:4729
...     Normal element mounting (12 frames)
#17     Element.inflateWidget
package:flutter/…/widgets/framework.dart:3790
#18     MultiChildRenderObjectElement.inflateWidget
package:flutter/…/widgets/framework.dart:6422
#19     MultiChildRenderObjectElement.mount
package:flutter/…/widgets/framework.dart:6433
...     Normal element mounting (15 frames)
#34     Element.inflateWidget
package:flutter/…/widgets/framework.dart:3790
#35     MultiChildRenderObjectElement.inflateWidget
package:flutter/…/widgets/framework.dart:6422
#36     MultiChildRenderObjectElement.mount
package:flutter/…/widgets/framework.dart:6433
#37     _ViewportElement.mount
package:flutter/…/widgets/viewport.dart:222
...     Normal element mounting (110 frames)
#147    Element.inflateWidget
package:flutter/…/widgets/framework.dart:3790
#148    Element.updateChild
package:flutter/…/widgets/framework.dart:3524
#149    ComponentElement.performRebuild
package:flutter/…/widgets/framework.dart:4780
#150    StatefulElement.performRebuild
package:flutter/…/widgets/framework.dart:4928
#151    Element.rebuild
package:flutter/…/widgets/framework.dart:4477
#152    BuildOwner.buildScope
package:flutter/…/widgets/framework.dart:2659
#153    WidgetsBinding.drawFrame
package:flutter/…/widgets/binding.dart:882
#154    RendererBinding._handlePersistentFrameCallback
package:flutter/…/rendering/binding.dart:363
#155    SchedulerBinding._invokeFrameCallback
package:flutter/…/scheduler/binding.dart:1144
#156    SchedulerBinding.handleDrawFrame
package:flutter/…/scheduler/binding.dart:1081
#157    SchedulerBinding._handleDrawFrame
package:flutter/…/scheduler/binding.dart:995
#161    _invoke (dart:ui[/hooks.dart:151:10]())
#162    PlatformDispatcher._drawFrame (dart:ui[/platform_dispatcher.dart:308:5]())
#163    _drawFrame (dart:ui[/hooks.dart:115:31]())
(elided 3 frames from dart:async)
════════════════════════════════════════════════════════════════════════════════

════════ Exception caught by widgets library ═══════════════════════════════════
A PhoneController was used after being disposed.
════════════════════════════════════════════════════════════════════════════════

Suggestions won't accept Object only String

I am attempting to have a customized suggestion box.. This works perfectly fine in the standard typeahead but not in this one because the type has been changed from T to String..

TypeAheadField(
         textFieldConfiguration: TextFieldConfiguration(
             keyboardType: TextInputType.phone,
            decoration: InputDecoration(
               labelText: 'Phone Number',
               icon: Icon(Icons.email),
            ),
            inputFormatters: [
               phoneNumberMask,
           ],
            controller: _typeAheadController1,
           ),
          suggestionsCallback: (pattern) =>
                  queryMemberPhoneData1(pattern),
           itemBuilder: (context, Member suggestion) {
                   return ListTile(
                         title: Text(suggestion.phone),
                          subtitle: Text('${suggestion.firstName}'),
                    );
           },
            onSuggestionSelected: (Member suggestion) {
                    _typeAheadController1.text = suggestion.phone;
            },
          ),

I was attempting to do this:

ReactiveTypeAhead(
     formControlName: 'phone',
       textFieldConfiguration: TextFieldConfiguration(
            keyboardType: TextInputType.phone,
            decoration: InputDecoration(
                  labelText: 'Phone Number',
                  icon: Icon(Icons.email),
            ),
            inputFormatters: [
                   phoneNumberMask,
           ],
           controller: _typeAheadController1,
       ),
     suggestionsCallback: (pattern) =>
            queryMemberPhoneData1(pattern),
      itemBuilder: (context, Member suggestion) {
            return ListTile(
              title: Text(suggestion.phone),
              subtitle: Text('${suggestion.firstName}'),
           );
      },
      onSuggestionSelected: (Member suggestion) {
             form.control('phone').value(suggestion.phone);
         },
   ),

Is there a reason these were changed? Is there a way around this?
Thanks..

[reactive_flutter_rating_bar] Could not align ReactiveRatingBar

Hi, thanks for your work on this package.

I'm facing an issue where I could not align the ReactiveRatingBar widget when it's inside a Column (the first rating bar in the image), I could align the RatingBar widget normally (the second rating bar).

I tried some other ways like wrap it with a Container with infinity width + center alignment, or set crossAxisAlignment to CrossAxisAlignment.center, ... but nothing worked.

The code I'm using in the image:

import 'package:flutter/material.dart';
import 'package:reactive_flutter_rating_bar/reactive_flutter_rating_bar.dart';
import 'package:reactive_forms/reactive_forms.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const MyHomePage(),
    );
  }
}

class MyHomePage extends StatelessWidget {
  const MyHomePage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SafeArea(
        child: ReactiveForm(
          formGroup: FormGroup(
            {
              "rating": FormControl<double>(value: 4),
            },
          ),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Align(
                alignment: Alignment.center,
                child: ReactiveRatingBar(
                  formControlName: "rating",
                  ratingWidget: RatingWidget(
                    full: const Icon(Icons.star),
                    half: const Icon(Icons.star_half),
                    empty: const Icon(Icons.star_outline),
                  ),
                ),
              ),
              Align(
                alignment: Alignment.center,
                child: RatingBar(
                  ratingWidget: RatingWidget(
                    full: const Icon(Icons.star),
                    half: const Icon(Icons.star_half),
                    empty: const Icon(Icons.star_outline),
                  ),
                  onRatingUpdate: (rating) {},
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

Please update freezed_annotation dependency version

Current reactive_file_picker (both 0.3.0 and 0.4.0) depends on freezed_annotation ^0.14.3.
My project is using freezed_annotation ^1.1.0, so version check is failing

[next_crm_app] flutter pub get
Running "flutter pub get" in next_crm_app...                    
Because reactive_file_picker 0.4.0 depends on freezed_annotation ^0.14.3 and no versions of reactive_file_picker match >0.4.0 <0.5.0, reactive_file_picker ^0.4.0 requires freezed_annotation ^0.14.3.
So, because next_crm_app depends on both freezed_annotation ^1.1.0 and reactive_file_picker ^0.4.0, version solving failed.
pub get failed (1; So, because next_crm_app depends on both freezed_annotation ^1.1.0 and reactive_file_picker ^0.4.0, version solving failed.)
exit code 1

At the moment I've fixed this by enforcing freezed_annotation ^1.1.0 in dependency_overrides

`ReactiveDirectSelect` and `ReactiveDropdownSearch` do not assign value to `FormControl` after selection.

I am trying to add some sort of dropdown selection for my application, but both of these are not assigning a value to their respective FormControl after selecting them.

ReactiveDropdownSearch will show the item selected but will not assign the value to the FormControl. It shows the required validator error message even after selection.

ReactiveDirectSelect will not show the item selected or assign the value to the FormControl. It doesn't show the error message of the required validator after selection.

The following code below are related to the problem above:

ReactiveDropdownSearch

...
        child: ReactiveDropdownSearch<CueEntity, String>(
          formControlName: 'scheduling.cue',
          valueAccessor: CueValueAccessor(),
          decoration: InputDecoration(
            border: OutlineInputBorder(),
            contentPadding: EdgeInsets.fromLTRB(12, 12, 0, 0),
            labelText: 'Cue',
            helperText: 'Select the event to remind you to workout',
            helperMaxLines: 2,
          ),
          items: items,
        ),
...

ReactiveDirectSelect

...
        child: ReactiveDirectSelect<CueEntity, String>(
          formControlName: 'scheduling.cue',
          valueAccessor: CueValueAccessor(),
          decoration: InputDecoration(
            border: OutlineInputBorder(),
            suffixIcon: const Icon(Icons.arrow_drop_down),
            labelText: 'Cue',
            helperText: 'Drag to select the event to remind you to workout',
            helperMaxLines: 2,
          ),
          itemExtent: 35.0,
          items: items,
          itemBuilder: (_, item) =>
              item == null ? const SizedBox.shrink() : Text(item),
          selectedItemBuilder: (_, item) =>
              item == null ? const SizedBox.shrink() : Text(item),
        ),

...

CueValueAccessor

class CueValueAccessor extends ControlValueAccessor<CueEntity, String> {
  @override
  String modelToViewValue(CueEntity? modelValue) =>
      modelValue?.prettyCue() ?? '';

  @override
  CueEntity? viewToModelValue(String? viewValue) {
    if (viewValue == '' || viewValue == null) {
      final parts = viewValue!.split(' ');

      // Get cue prefix and remove from parts list
      final cuePrefix = CuePrefix.values
          .firstWhere((e) => e.toString() == 'CuePrefix.' + parts.removeAt(0));

      return CueEntity(prefix: cuePrefix, title: parts.join(' '));
    } else
      return null;
  }
}

CueEntity

enum CuePrefix { After, While, Before }

/// Event that triggers the workout.
// TODO: Eventually add related variables for statistics?
class CueEntity extends Equatable {
  /// UUID of cue.
  late final String uuid;

  /// Prefix before the title to more specifically indicate when to do what is specified in the title.
  final CuePrefix prefix;

  /// Title of the event that triggers the workout.
  final String title;

  CueEntity({
    required this.prefix,ReactiveDropdownSearch
    required this.title,
  }) {
    uuid = Uuid().v4();
  }

  CueEntity.json({
    required this.uuid,
    required this.prefix,
    required this.title,
  });

  /// Returns [CueModel] of this [CueEntity].
  CueModel toModel() {
    return CueModel(
      uuid: uuid,
      prefix: prefix,
      title: title,
    );
  }

  CueEntity copyWith({
    CuePrefix? prefix,
    String? title,
  }) {
    return CueEntity.json(
      uuid: uuid,
      prefix: prefix ?? this.prefix,
      title: title ?? this.title,
    );
  }

  @override
  List<Object?> get props => [
        uuid,
        prefix,
        title,
      ];

  String prettyCue() => describeEnum(prefix) + ' ' + title;
}

FormControl

...
        'cue': FormControl<CueEntity>(
          value: workout == null ? null : workout.cue,
          validators: [Validators.required];
        ),
...

ReactiveRawAutocomplete doesn't work if I delete the text in the field to clear it

I have a state popup. I select a state and that works, but if I delete the state, it doesn't update the form data.

Support for reactive_forms: ^9.1.0

As stated, i couldn't install this library cause the targeted version is reactive_forms: ^8.0.3

ReactivePhoneFormField - Validation issue

control validation state is not reflected properly.

control.valid is true even if I enter a 2 digit mobile number. (The underlying widget does validate properly)

Also, autovalidateMode is hardcoded to disabled.

ReactiveDropdownSearch : how to know when on change item

how to know when on change item of ReactiveDropdownSearch

Update intl version

reactive_forms just updated their intl version which is causing a dependency conflict with this package. Please update the version of intl