perfect_text_field 1.0.0 perfect_text_field: ^1.0.0 copied to clipboard
`PerfectTextField` builds on `TextFormField` and integrates additional features like auto-complete and a custom text controller for advanced text editing scenarios.
Perfect TextField #
A Flutter package providing a versatile and customizable text field with extended functionalities. PerfectTextField
builds on TextFormField
and integrates additional features like auto-complete and a custom text controller for advanced text editing scenarios.
Features #
PerfectTextField #
- Custom Text Controller: Integrates
PerfectTextController
for extended control over text editing and state management. - Auto-complete: Supports auto-complete functionality with
PerfectAutoCompleteTextField
. - Flexible Text Input: Allows customization of the text field with numerous parameters such as
cursorColor
,cursorRadius
, and more for better UI integration. - Event Handling: Custom event handling for taps outside the text field, allowing for more interactive forms.
- Styling Options: Extensive styling options with default and customizable text styles and decorations.
PerfectTextController #
- Custom Text Controller: Uses
PerfectTextController
to enhance control over text editing, focus management, and state updates with support for reactive programming viaget
. - Reactive State Management: Leverages Rx variables to reactively manage and observe changes to the text field's content and focus state.
- Advanced Focus Control: Offers methods like
selectAll
,unfocus
, andrequestFocus
to programmatically control focus and text selection. - Auto-complete: Supports auto-complete functionality, seamlessly integrated into the
PerfectTextField
. - Event Handling: Enhanced event handling capabilities for changes in text and focus, along with custom actions on external taps.
PerfectRawAutocomplete #
- Customizable Options: Fully customizable autocomplete options that can be styled and handled according to your application's needs.
- Reactive User Input Handling: Dynamically generates suggestions based on user input.
- Keyboard Navigation: Supports keyboard actions for navigating through suggestions.
- Selection Callbacks: Provides callbacks for handling the selection of suggestions.
- Advanced Text Handling: Integrates with custom
PerfectTextController
for more refined control over text input and focus management.
DecimalNumberFormatter #
- Value Constraints: Allows setting minimum and maximum values for the input.
- Decimal Precision: Controls the number of digits allowed after the decimal point.
- Smart Correction: Optionally replaces the last digit if input exceeds the maximum decimal length, ensuring continuous input flow without the need to delete characters manually.
- Flexible Input Handling: Prevents undesired inputs like leading zeros and improperly placed decimal points.
Getting Started #
To use this package, add perfect_text_field
as a dependency in your pubspec.yaml
file.
dependencies:
flutter:
sdk: flutter
perfect_text_field: 1.0.0
PerfectTextField Usage #
Here is a simple example of how to use PerfectTextField
in your Flutter application:
import 'package:flutter/material.dart';
import 'package:perfect_text_field/perfect_text_field.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(title: Text('Perfect TextField Example')),
body: Center(
child: PerfectTextField(
controller: PerfectTextController(
onTextChange: (text) {
print("Text changed: $text");
},
onFocusChange: (hasFocus) {
print("Field has focus: $hasFocus");
},
),
inputFormatters: [
DecimalNumberFormatter(
min: 1.0,
max: 100.0,
decimalLength: 2,
)
],
keyboardType: TextInputType.numberWithOptions(decimal: true),
),
),
),
);
}
}
PerfectRawAutocomplete Usage #
import 'package:flutter/material.dart';
import 'package:perfect_raw_autocomplete/perfect_raw_autocomplete.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(title: Text('Perfect Raw Autocomplete Example')),
body: PerfectRawAutocomplete<String>(
optionsBuilder: (TextEditingValue textEditingValue) {
// Assume your logic to suggest autocomplete options
return ['Apple', 'Banana', 'Cherry'].where((String option) {
return option.contains(textEditingValue.text.toLowerCase());
});
},
fieldViewBuilder: (BuildContext context, PerfectTextController textController, VoidCallback onFieldSubmitted) {
return TextFormField(
controller: textController.textController,
onFieldSubmitted: (String value) => onFieldSubmitted(),
);
},
optionsViewBuilder: (BuildContext context, PerfectAutocompleteOnSelected<String> onSelected, Iterable<String> options, void Function(Size?) onSizeChange) {
return Material(
elevation: 4.0,
child: ListView(
children: options.map((String option) {
return GestureDetector(
onTap: () {
onSelected(option);
},
child: ListTile(
title: Text(option),
),
);
}).toList(),
),
);
},
onSelected: (String selection) {
print('You just selected $selection');
},
),
),
);
}
}
Parameters #
PerfectTextField #
PerfectTextField
supports all the parameters of TextFormField
plus additional ones specific to its functionality:
onTapOutside
: Callback fired when a tap is detected outside the text field.prefixText
: Optional text to display as a prefix within the text field.hintText
: Text that suggests what sort of input the field accepts.- Additional customization parameters such as
cursorColor
,cursorRadius
, etc.
PerfectTextController #
optionsBuilder
: Define how suggestions are generated based on user input.fieldViewBuilder
: Build the text field widget for input.optionsViewBuilder
: Build the widget that displays the suggestions.onSelected
: A callback that fires when an option is selected, allowing for custom action.
PerfectRawAutocomplete #
PerfectRawAutocomplete
is a robust Flutter package designed for implementing customized autocomplete functionality within your Flutter applications. It leverages the fundamental architecture of Flutter's RawAutocomplete
to allow for greater flexibility and customization.
DecimalNumberFormatter #
DecimalNumberFormatter
provides a TextInputFormatter
for handling decimal inputs within text fields. This formatter not only enforces numeric constraints but also manages decimal precision, making it ideal for financial and other precision-required inputs.
min: The minimum value allowed. max: The maximum value allowed. decimalLength: Maximum number of decimal digits. replaceLastIfExceeds: Whether to replace the last digit when exceeding the decimal length (default is true).
Contributions #
Contributions are welcome! If you have suggestions or issues, please feel free to open an issue or submit a pull request.
License #
This project is licensed under the MIT License - see the LICENSE file for details.