![]() New example for `InputChip` that demonstrate how to create/delete them based on user text inputs. The sample application shows a custom text area where user can enter text. After the user has typed and hits _Enter_ the text will be replaced with an `InputChip` that contains that text. Is it possible to continue typing and add more chips in this way. All of them will be placed in a scrollable horizontal row. Also is it possible to have suggestion displayed below the text input field in case the typed text match some of the available suggestions. Issue I'm trying to solve: - https://github.com/flutter/flutter/issues/128247 **Code structure:** The example app is composed of 2 main components that find places inside `MainScreen`: - `ChipsInput` - `ListView` `ChipsInput` emulates a `TextField` where you can enter text. This text field accepts also a list of values of generic type T (`Topping` in my example), that gets rendered as `InputChip` inside the text field, before the text inserted by the user. This widgets is basically an `InputDecorator` widget that implements `TextInputClient` to get `TextEditingValue` events from the user keyboard. At the end of the input field there is another component, the `TextCursor`, that is displayed just when the user give the focus to the field and emulates the carrets that `TextField` has. There are also some available callbacks that the user can use to capture events in the `ChipsInput` field like: `onChanged`, `onChipTapped`, `onSubmitted` and `onTextChanged`. This last callback is used to build a list of suggestion that will be placed just below the `ChipsInput` field inside the `ListView`. |
||
---|---|---|
.. | ||
api | ||
flutter_view | ||
hello_world | ||
image_list | ||
layers | ||
platform_channel | ||
platform_channel_swift | ||
platform_view | ||
splash | ||
texture | ||
.clang-format | ||
flutter_gallery.readme | ||
README.md |
Flutter Examples
This directory contains several examples of using Flutter. To run an example,
use flutter run
inside that example's directory. See the getting started
guide to install the flutter
tool.
For additional samples, see the
flutter/samples
repo.
Available examples include:
-
Hello, world The hello world app is a minimal Flutter app that shows the text "Hello, world!"
-
Flutter gallery The flutter gallery app no longer lives in this repo. Please see the gallery repo.
-
Layers The layers vignettes show how to use the various layers in the Flutter framework. For details, see the layers README.
-
Platform Channel The platform channel app demonstrates how to connect a Flutter app to platform-specific APIs. For documentation, see https://flutter.dev/platform-channels/.
-
Platform Channel Swift The platform channel swift app is the same as platform channel but the iOS version is in Swift and there is no Android version.
Notes
Note on Gradle wrapper files in .gitignore
:
Gradle wrapper files should normally be checked into source control. The example projects don't do that to avoid having several copies of the wrapper binary in the Flutter repo. Instead, the Gradle wrapper is injected by Flutter tooling, and the wrapper files are .gitignore'd to avoid making the Flutter repository dirty as a side effect of running the examples.