flutter/examples/api/lib/material
Andrea Cioni 400702d1d6
Add an example for InputChip generated by user input (#130645)
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`.
2023-09-01 00:02:04 +00:00
..
about Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
action_buttons Add missing links to examples that aren't linked anywhere (#130422) 2023-07-12 20:08:05 +00:00
action_chip Enable dangling_library_doc_comments and library_annotations lints (#117365) 2022-12-20 16:03:21 -08:00
animated_icon Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
app_bar Replaces textScaleFactor with TextScaler (#128522) 2023-07-17 17:56:07 +00:00
autocomplete Fix bug in Autocomplete example (#127219) 2023-05-22 16:55:21 +00:00
banner Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
bottom_app_bar Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
bottom_navigation_bar Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
bottom_sheet Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
button_style Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
card Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
checkbox Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
checkbox_list_tile Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
chip Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
choice_chip Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
color_scheme Remove dead code (#126266) 2023-05-09 15:47:16 +00:00
context_menu Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
data_table Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
date_picker Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
dialog Adaptive alert dialog (#124336) 2023-04-18 23:00:03 +00:00
divider Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
drawer Add missing example links (#130521) 2023-07-17 18:24:49 +00:00
dropdown Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
dropdown_menu Updated DropdownMenu example and added a test (#133592) 2023-08-30 14:33:54 -07:00
elevated_button Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
expansion_panel Update ExpansionPanel example for the updated expansionCallback callback (#132837) 2023-08-21 20:13:22 +00:00
expansion_tile Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
filled_button Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
filter_chip Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
flexible_space_bar Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
floating_action_button Add FAB Additional Color Mappings example (#133453) 2023-08-29 17:31:02 +00:00
floating_action_button_location Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
icon_button Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
ink Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
ink_well Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
input_chip Add an example for InputChip generated by user input (#130645) 2023-09-01 00:02:04 +00:00
input_decorator Updated InputDecoratorExamples for M3 (#128065) 2023-06-01 15:22:03 -07:00
list_tile Fix typos in ListTile examples. (#129606) 2023-06-29 06:29:03 +00:00
material_state Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
menu_anchor Update menu examples for SafeArea (#132390) 2023-08-14 20:30:01 +00:00
navigation_bar Reland root predictive back (#132249) 2023-08-17 23:55:05 +00:00
navigation_drawer Add missing example links (#130521) 2023-07-17 18:24:49 +00:00
navigation_rail Add Badge widget to NavigationBar and NavigationRail examples (#129834) 2023-07-11 09:30:05 +00:00
outlined_button Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
page_transitions_theme Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
paginated_data_table PaginatedDataTable improvements (#131374) 2023-08-15 00:55:07 +00:00
platform_menu_bar Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
popup_menu Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
progress_indicator Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
radio Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
radio_list_tile Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
range_slider Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
refresh_indicator Refactor refresh_indicator.1.dart to not use shrinkwrap (#129377) 2023-07-11 20:04:17 +00:00
reorderable_list Add a ReorderableListView example with cards + cleanup existing tests (#126155) 2023-05-05 16:39:11 +00:00
scaffold Add missing example links (#130521) 2023-07-17 18:24:49 +00:00
scrollbar Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
search_anchor Add missing links to examples that aren't linked anywhere (#130422) 2023-07-12 20:08:05 +00:00
segmented_button Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
selectable_region Selection area right click behavior should match native (#128224) 2023-06-21 19:32:04 +00:00
selection_area Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
selection_container Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
slider Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
snack_bar Add missing links to examples that aren't linked anywhere (#130422) 2023-07-12 20:08:05 +00:00
stepper Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
switch Add missing links to examples that aren't linked anywhere (#130422) 2023-07-12 20:08:05 +00:00
switch_list_tile Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
tab_controller Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
tabs Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
text_button Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
text_field Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
text_form_field Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
theme Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00
theme_data Updated the ThemeData API example (#130954) 2023-07-20 13:12:34 -07:00
time_picker Replaces textScaleFactor with TextScaler (#128522) 2023-07-17 17:56:07 +00:00
toggle_buttons Updated TabBar and ToggleButtons examples (#128088) 2023-06-02 01:05:31 +00:00
tooltip Rename Sample classes (#124080) 2023-04-04 20:34:29 +00:00