Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/ibrahimalsabr/intelligentsia_forms
https://github.com/ibrahimalsabr/intelligentsia_forms
Last synced: 26 days ago
JSON representation
- Host: GitHub
- URL: https://github.com/ibrahimalsabr/intelligentsia_forms
- Owner: IbrahimAlsabr
- License: mit
- Created: 2024-11-11T16:54:42.000Z (about 2 months ago)
- Default Branch: main
- Last Pushed: 2024-11-11T17:24:15.000Z (about 2 months ago)
- Last Synced: 2024-11-11T18:25:13.504Z (about 2 months ago)
- Language: Dart
- Size: 813 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# `intelligentsia_forms` Package
The `intelligentsia_forms` package for Flutter provides a robust toolkit to create customizable sign-in and sign-up
forms. It includes components for various form fields such as Email, Name, Password, About Me, Country, Birth Date, and
Gender. Each component supports extensive customization options, including color, font, icon, and layout styling, to
give users a tailored experience.
## Key Features
- Highly customizable components for creating user-friendly forms.
- Flexible styling options to fit any design theme.
- Easy handling of user-input data, including validation and data processing.
- Pre-built components for standard form fields to simplify development.
---
# Component Documentation
### `SmartTextFormField`
The `SmartTextFormField` widget is a versatile text field component designed for fields like email, password, username,
and "About Me." Each field type comes with specialized settings to enhance usability.
#### Features
1. **Form Type-Specific Customization**
- Placeholder text, icons, validation, and keyboard types adapt based on the selected `formType` (`email`
, `password`, `aboutMe`, or `userName`).
- Form-specific settings, like toggling password visibility.
2. **Field Label Customization**
- Customize the label's color, font size, and font weight for distinct appearances.
3. **Hint Text Styling**
- Set custom hint text color, font size, and font weight.
4. **Icon Options**
- Configurable prefix and suffix icons with options for outlined icons.
- Control icon color and size for consistent design.
5. **Border Styling**
- Adjustable border radius and color settings for various states (enabled, focused, error).
6. **Error Message Styling**
- Customizable error message styling for clear user feedback.
7. **Flexible Padding Options**
- Separate padding options inside and outside the field.
8. **Data Control**
- Supports custom `TextEditingController` and `onChanged` handlers.
- Limits on maximum and minimum lines for fields like “About Me.”
9. **Global Styling**
- Options to set background fill color and primary color.
10. **Password Toggle**
- For `password` fields, a suffix icon toggles password visibility.
### Standard Style
---
### `CountrySelector`
The `CountrySelector` widget lets users pick a country, displaying the selected country’s name and flag.
#### Features
1. **Country Selection Callback**
- Calls a function (`onCountrySelected`) with the selected country’s name, code, and flag.
2. **Customizable Field Label**
- Customize the label displayed above the field (text color, font size, and weight).
3. **Hint Text Styling**
- Adjust the hint text's color, font size, and weight.
4. **Icon Customization**
- Configurable prefix and suffix icons (e.g., flag and info icons).
- Option to enable or disable an `info` suffix icon.
5. **Flush Bar Notifications**
- Optional `Flushbar` message displayed when the info icon is tapped, with customizable content, duration, and
position.
6. **Global and Border Styling**
- Set the primary color, fill color, border radius, and border style.
7. **Padding Control**
- Separate options for inside and outside padding.
8. **Country Display**
- Displays the selected country name and flag in the field, with styling for unselected and selected states.
9. **Country Picker Integration**
- Allows browsing and selecting a country via a modal picker.
### Standard Style
---
### `DateSelector`
The `DateSelector` widget provides a date picker for selecting and displaying dates.
#### Features
1. **Date Selection Callback**
- Calls a function (`selectedDate`) with the selected date’s year, month, and day.
2. **Field Label Customization**
- Adjustable label color, font size, and font weight.
3. **Hint Text Styling**
- Custom hint text styling displayed inside the field when no date is selected.
4. **Icon Customization**
- Configurable prefix icon (calendar icon) with color, size, and outlined style.
5. **Padding and Border Styling**
- Inside and outside padding options and customizable border style.
6. **Date Constraints**
- Minimum and maximum date settings to restrict selection range.
7. **Selected Date Display**
- Displays the chosen date in a formatted style.
8. **Date Picker Integration**
- Opens a date picker modal with custom primary and fill colors.
### Standard Style
---
### `GenderSelector`
The `GenderSelector` widget lets users select gender from customizable options.
#### Features
1. **Gender Selection Callback**
- Calls `onGenderSelected` function with the chosen gender.
2. **Customizable Field Label**
- Adjustable label color, font size, and weight.
3. **Flexible Gender Options**
- Customizable list of gender choices (default is `['Male', 'Female']`).
4. **Text Styling for Options**
- Customizable font size and dynamic color based on selection state.
5. **Color and Border Styling**
- Configurable primary color, font color, background fill, and border radius.
6. **Interactive Gender Selection**
- Gender options behave as interactive buttons, with distinct styling for selected options.
---
### `SocialAuthButton
The `SocialAuthButto`n widget provides a customizable button for social media authentication. It supports various social
media providers, including Google, Facebook, Apple, Twitter, Pinterest, and LinkedIn, and allows for either outlined or
solid logos.`
#### Features
1. **Social Media Provider Support**
- Includes icons for Google, Facebook, Apple, Twitter, Pinterest, and LinkedIn.
- Automatically selects the appropriate logo based on the chosen provider.
2. **Outlined or Solid Logo**
- Choose between an outlined or filled logo style by setting the `outlinedLogo` property.
3. **Customizable Background and Padding**
- Set background colors and padding for both outlined and solid logo styles.
4. **Configurable Button Size**
- Customize the width and height of the button to fit your design.
5. **Border Radius and Box Shadow**
- Customize the button's border radius and add a box shadow for added depth.
6. **On-Tap Callback**
- Easily handle user interactions with an `onTap` callback.
### Standard Style
## Installation
Add `intelligentsia_forms` to your `pubspec.yaml`:
```yaml
dependencies:
intelligentsia_forms: ^latest_version
```
## Note
The `CountrySelector` widget uses the `Flushbar` package for displaying notifications. Ensure the `another_flushbar`
dependency is added to your project.
`ThemeColors` is a custom color class. Replace it with your app's color theme as needed.
## Dependencies
```yaml
dependencies:
flutter:
sdk: flutter
another_flushbar: ^1.10.0
country_picker: ^2.0.9
```