Skip to content

Commit

Permalink
Merge pull request #2 from alippo-com/feat/select-card-form-field
Browse files Browse the repository at this point in the history 
Feat/select card form field
  • Loading branch information
@nileshmsd12345
nileshmsd12345 authored Apr 22, 2024
2 parents 2dc0938 + c660bad commit 9e0b0d1
Show file tree
Hide file tree
Showing 5 changed files with 710 additions and 28 deletions.
166 changes: 138 additions & 28 deletions example/lib/sources/complete_form.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,59 @@ class _CompleteFormState extends State<CompleteForm> {

@override
Widget build(BuildContext context) {
InfoModalConfig config = InfoModalConfig(
leadingIcon: const Icon(
Icons.post_add_outlined,
size: 40,
),
description: const Opacity(
opacity: 0.79,
child: Text(
'Don\'t know the skill? It\'s okay, we will teach you market-style skills too. and you can earn up to 5000 - 6000 per month.',
style: TextStyle(
color: Color(0xFF003B67),
fontSize: 14,
fontFamily: 'PP Pangram Sans',
fontWeight: FontWeight.w700,
),
),
),
shape: RoundedRectangleBorder(
side: const BorderSide(width: 1.30, color: Color(0x1915749D)),
borderRadius: BorderRadius.circular(13),
),
gradient: const LinearGradient(
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
colors: [Color(0x00FAF9F9), Color(0xFF94B8D2)],
),
);
InfoModalConfig config2 = InfoModalConfig(
leadingIcon: const Icon(
Icons.post_add_outlined,
size: 40,
),
description: const Opacity(
opacity: 0.79,
child: Text(
'Don\'t know the skill? It\'s okay, we will teach you market-style skills too. ',
style: TextStyle(
color: Color(0xFF003B67),
fontSize: 14,
fontFamily: 'PP Pangram Sans',
fontWeight: FontWeight.w700,
),
),
),
shape: RoundedRectangleBorder(
side: const BorderSide(width: 1.30, color: Color(0x1915749D)),
borderRadius: BorderRadius.circular(13),
),
gradient: const LinearGradient(
begin: Alignment.topCenter,
end: Alignment.bottomCenter,
colors: [Color(0x00EB467A), Color(0xFFFF976E)]),
);
return SingleChildScrollView(
child: Column(
children: <Widget>[
Expand All @@ -42,12 +95,28 @@ class _CompleteFormState extends State<CompleteForm> {
'best_language': 'Dart',
'age': '13',
'gender': 'Male',
'languages_filter': ['Dart']
'languages_filter': ['Dart'],
'languages_choice': '5000 - 6000',
},
skipDisabled: true,
child: Column(
children: <Widget>[
const SizedBox(height: 15),
FormBuilderTextField(
autovalidateMode: AutovalidateMode.onUserInteraction,
name: 'text_field',
decoration: const InputDecoration(
//labelText: 'Text Field',
hintText: 'Hint Text',
filled: true,
),
onChanged: _onChanged,
// valueTransformer: (text) => num.tryParse(text),
keyboardType: TextInputType.multiline,
textInputAction: TextInputAction.next,
minLines: 1,
maxLines: null,
),
FormBuilderDateTimePicker(
name: 'date',
initialEntryMode: DatePickerEntryMode.calendar,
Expand Down Expand Up @@ -286,37 +355,78 @@ class _CompleteFormState extends State<CompleteForm> {
FormBuilderValidators.maxLength(3),
]),
),
FormBuilderChoiceChip<String>(
autovalidateMode: AutovalidateMode.onUserInteraction,
decoration: const InputDecoration(
labelText:
'Ok, if I had to choose one language, it would be:'),
name: 'languages_choice',
initialValue: 'Dart',
options: const [
FormBuilderChipOption(
value: 'Dart',
avatar: CircleAvatar(child: Text('D')),
),
FormBuilderChipOption(
value: 'Kotlin',
avatar: CircleAvatar(child: Text('K')),
Builder(builder: (context) {
return AlippoSelectionCardGroups<String>(
autovalidateMode: AutovalidateMode.onUserInteraction,
name: 'languages_choice',
// initialValue: 'Java',
padding:
const EdgeInsets.only(top: 20, bottom: 20, left: 50),
expanded: true,
spacing: 20,
selectedLabelStyle: const TextStyle(
color: Color(0xFFFAF9F9),
fontSize: 18,
fontFamily: 'PP Pangram Sans Rounded',
fontWeight: FontWeight.w700,
letterSpacing: -0.36,
),
FormBuilderChipOption(
value: 'Java',
avatar: CircleAvatar(child: Text('J')),
unselectedLabelStyle: const TextStyle(
color: Color(0xFF1A4F76),
fontSize: 18,
fontFamily: 'PP Pangram Sans Rounded',
fontWeight: FontWeight.w400,
letterSpacing: -0.36,
),
FormBuilderChipOption(
value: 'Swift',
avatar: CircleAvatar(child: Text('S')),
selectedCardColor: const Color(0xFF1A4F76),
defaultCardColor: const Color(0xFFFAF9F9),
selectedShape: RoundedRectangleBorder(
side: BorderSide(
width: 2,
color: Colors.black.withOpacity(0.36000001430511475),
),
borderRadius: BorderRadius.circular(17),
),
FormBuilderChipOption(
value: 'Objective-C',
avatar: CircleAvatar(child: Text('O')),
unselectedShape: RoundedRectangleBorder(
side: BorderSide(
width: 2,
color: Colors.black.withOpacity(0.07000000029802322),
),
borderRadius: BorderRadius.circular(17),
),
],
onChanged: _onChanged,
),
options: [
SelectionCardOption(
value: '5000 - 6000',
avatar: const Icon(Icons.monetization_on_outlined),
infoModalConfig: config,
),
SelectionCardOption(
value: 'Kotlin',
avatar: const Icon(Icons.monetization_on_outlined),
infoModalConfig: config2,
),
SelectionCardOption(
value: 'Java',
avatar: const Icon(Icons.monetization_on_outlined),
infoModalConfig: config,
),
SelectionCardOption(
value: 'Swift',
avatar: const Icon(Icons.monetization_on_outlined),
infoModalConfig: config2,
),
SelectionCardOption(
value: 'Objective-C',
avatar: const Icon(Icons.monetization_on_outlined),
infoModalConfig: config,
),
],
onChanged: _onChanged,
validator: FormBuilderValidators.compose([
FormBuilderValidators.minLength(1),
]),
);
}),
],
),
),
Expand Down
2 changes: 2 additions & 0 deletions lib/flutter_form_builder.dart
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,3 +20,5 @@ export 'src/widgets/grouped_checkbox.dart';
export 'src/widgets/grouped_radio.dart';
export 'src/options/form_builder_chip_option.dart';
export 'src/options/display_values_enum.dart';
export 'src/alippo_custom_form_components/fields/alippo_selection_card_group/alippo_selection_card_group.dart';
export 'src/alippo_custom_form_components/fields/alippo_selection_card_group/comp/selection_card_options.dart';
Loading

0 comments on commit 9e0b0d1

Please sign in to comment.