Commit Graph

108 Commits

Author SHA1 Message Date
Renzo Olivares
21ad7122a1
Implement SelectionArea single click/tap gestures (#132682)
This change collapses the selection at the clicked/tapped location on single click down for desktop platforms, and on single click/tap up for mobile platforms to match native.

This is a change from how `SelectionArea` previously worked. Before this change a single click down would clear the selection. From observing a native browser it looks like when tapping on static text the selection is not cleared but collapsed. A user can still attain the selection from static text using the `window.getSelection` API.

https://jsfiddle.net/juepasn3/11/ You can try this demo out here to observe this behavior yourself. When clicking on static text the selection will change.

This change also allows `Paragraph.selections` to return selections that are collapsed. This for testing purposes to confirm where the selection has been collapsed.

Partially fixes: #129583
2023-09-28 01:42:16 +00:00
huycozy
c2b1e483dd
Improve DropdownMenu sample code for requestFocusOnTap on mobile platforms (#134867)
### Description

This PR is to improve `DropdownMenu` sample code. By default, `requestFocusOnTap` is false on mobile platforms. When users run API sample code on mobile platforms, they can not edit the text field and think it is a bug. Although it is detailed at https://api.flutter.dev/flutter/material/DropdownMenu/requestFocusOnTap.html, users often do not pay attention to it.

### Related issue

Fixes https://github.com/flutter/flutter/issues/127672
2023-09-18 08:33:14 +00:00
Chinmay Kabi
4a3ab6828a
Fix DataTable example not being scrollable (#131556) 2023-09-11 18:55:53 -05:00
xubaolin
f4707c2b3d
fix a Scrollbar example crash (#127925)
Fix a scrollbar example crash.
https://api.flutter.dev/flutter/material/Scrollbar-class.html#material.Scrollbar.1
2023-09-08 09:40:49 +00:00
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
Hans Muller
336d60d29c
Updated DropdownMenu example and added a test (#133592) 2023-08-30 14:33:54 -07:00
Hans Muller
4022864c65
Added DropdownMenuEntry.labelWidget (#133491) 2023-08-29 13:01:49 -07:00
Taha Tesser
d8d7e019c1
Add FAB Additional Color Mappings example (#133453)
fixes [Additional color mappings for FAB in Material 3](https://github.com/flutter/flutter/issues/130702)

### Preview
![image](https://github.com/flutter/flutter/assets/48603081/a6f9aef6-af80-41ce-8e59-50f095db047d)
2023-08-29 17:31:02 +00:00
Taha Tesser
1bc791697c
Update default menu text styles for Material 3 (#131930)
Related https://github.com/flutter/flutter/issues/131676

## Description

#### Fix default input text style for `DropdownMenu`

![dropdown_input](https://github.com/flutter/flutter/assets/48603081/301f8243-155a-4b8f-84a8-5e6b7bebb3bc)

### Fix default text style for  `MenuAnchor`'s menu items (which `DropdownMenu` uses for menu items)

![dropdown_item](https://github.com/flutter/flutter/assets/48603081/6b5be81a-72fc-4705-a577-074c7a4cad8f)

###  Default  `DropdownMenu` Input text style 

![Screenshot 2023-08-04 at 16 48 28](https://github.com/flutter/flutter/assets/48603081/bcd9da98-e74d-491e-ae64-6268ae0b3893)

### Default `DropdownMenu` menu item text style

![Screenshot 2023-08-04 at 16 50 19](https://github.com/flutter/flutter/assets/48603081/9592ca43-2854-45b5-8648-203ab65d9745)

### Default `MenuAnchor` menu item text style

![Screenshot 2023-08-04 at 14 34 28](https://github.com/flutter/flutter/assets/48603081/e87e1073-05f8-4dc7-a435-d864e9cce6ab)

### Code sample

<details> 
<summary>expand to view the code sample</summary> 

```dart
import 'package:flutter/material.dart';

/// Flutter code sample for [DropdownMenu]s. The first dropdown menu has an outlined border.

void main() => runApp(const DropdownMenuExample());

class DropdownMenuExample extends StatefulWidget {
  const DropdownMenuExample({super.key});

  @override
  State<DropdownMenuExample> createState() => _DropdownMenuExampleState();
}

class _DropdownMenuExampleState extends State<DropdownMenuExample> {
  final TextEditingController colorController = TextEditingController();
  final TextEditingController iconController = TextEditingController();
  ColorLabel? selectedColor;
  IconLabel? selectedIcon;

  @override
  Widget build(BuildContext context) {
    final List<DropdownMenuEntry<ColorLabel>> colorEntries =
        <DropdownMenuEntry<ColorLabel>>[];
    for (final ColorLabel color in ColorLabel.values) {
      colorEntries.add(
        DropdownMenuEntry<ColorLabel>(
            value: color, label: color.label, enabled: color.label != 'Grey'),
      );
    }

    final List<DropdownMenuEntry<IconLabel>> iconEntries =
        <DropdownMenuEntry<IconLabel>>[];
    for (final IconLabel icon in IconLabel.values) {
      iconEntries
          .add(DropdownMenuEntry<IconLabel>(value: icon, label: icon.label));
    }

    return MaterialApp(
      theme: ThemeData(
        useMaterial3: true,
        colorSchemeSeed: Colors.green,
        // textTheme: const TextTheme(
        //   bodyLarge: TextStyle(
        //     fontWeight: FontWeight.bold,
        //     fontStyle: FontStyle.italic,
        //     decoration: TextDecoration.underline,
        //   ),
        // ),
      ),
      home: Scaffold(
        body: SafeArea(
          child: Column(
            children: <Widget>[
              const Text('DropdownMenus'),
              Padding(
                padding: const EdgeInsets.symmetric(vertical: 20),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: <Widget>[
                    DropdownMenu<ColorLabel>(
                      controller: colorController,
                      label: const Text('Color'),
                      dropdownMenuEntries: colorEntries,
                      onSelected: (ColorLabel? color) {
                        setState(() {
                          selectedColor = color;
                        });
                      },
                    ),
                    const SizedBox(width: 20),
                    DropdownMenu<IconLabel>(
                      controller: iconController,
                      enableFilter: true,
                      leadingIcon: const Icon(Icons.search),
                      label: const Text('Icon'),
                      dropdownMenuEntries: iconEntries,
                      inputDecorationTheme: const InputDecorationTheme(
                        filled: true,
                        contentPadding: EdgeInsets.symmetric(vertical: 5.0),
                      ),
                      onSelected: (IconLabel? icon) {
                        setState(() {
                          selectedIcon = icon;
                        });
                      },
                    ),
                  ],
                ),
              ),
              const Text('Plain TextFields'),
              Padding(
                padding: const EdgeInsets.symmetric(vertical: 20),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: <Widget>[
                    SizedBox(
                      width: 150,
                      child: TextField(
                          controller: TextEditingController(text: 'Blue'),
                          decoration: const InputDecoration(
                            suffixIcon: Icon(Icons.arrow_drop_down),
                            labelText: 'Color',
                            border: OutlineInputBorder(),
                          )),
                    ),
                    const SizedBox(width: 20),
                    SizedBox(
                      width: 150,
                      child: TextField(
                          controller: TextEditingController(text: 'Smile'),
                          decoration: const InputDecoration(
                            prefixIcon: Icon(Icons.search),
                            suffixIcon: Icon(Icons.arrow_drop_down),
                            filled: true,
                            labelText: 'Icon',
                          )),
                    ),
                  ],
                ),
              ),
              if (selectedColor != null && selectedIcon != null)
                Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: <Widget>[
                    Text(
                        'You selected a ${selectedColor?.label} ${selectedIcon?.label}'),
                    Padding(
                      padding: const EdgeInsets.symmetric(horizontal: 5),
                      child: Icon(
                        selectedIcon?.icon,
                        color: selectedColor?.color,
                      ),
                    )
                  ],
                )
              else
                const Text('Please select a color and an icon.')
            ],
          ),
        ),
      ),
    );
  }
}

enum ColorLabel {
  blue('Blue', Colors.blue),
  pink('Pink', Colors.pink),
  green('Green', Colors.green),
  yellow('Yellow', Colors.yellow),
  grey('Grey', Colors.grey);

  const ColorLabel(this.label, this.color);
  final String label;
  final Color color;
}

enum IconLabel {
  smile('Smile', Icons.sentiment_satisfied_outlined),
  cloud(
    'Cloud',
    Icons.cloud_outlined,
  ),
  brush('Brush', Icons.brush_outlined),
  heart('Heart', Icons.favorite);

  const IconLabel(this.label, this.icon);
  final String label;
  final IconData icon;
}

``` 
	
</details>
2023-08-22 22:21:00 +00:00
Taha Tesser
af79b4c7a3
Update ExpansionPanel example for the updated expansionCallback callback (#132837)
fixes [ExpansionPanelList can't expand/collapse on the latest stable/master
](https://github.com/flutter/flutter/issues/132759)

https://github.com/flutter/flutter/pull/128082 updated the `expansionCallback` and also the `ExpansionPanel` sample in the Flutter gallery but not the API example. 

This PR fixes the API example and adds tests.
2023-08-21 20:13:22 +00:00
Ian Hickson
ccdf826466
PaginatedDataTable improvements (#131374)
- slightly improved assert message when row cell counts don't match column count.
- more breadcrumbs in API documentation. more documentation in general.
- added more documentation for the direction of the "ascending" arrow.
- two samples for PaginatedDataTable.
- make PaginatedDataTable support hot reloading across changes to the number of columns.
- introduce matrix3MoreOrLessEquals. An earlier version of this PR used it in tests, but eventually it was not needed. The function seems useful to keep though.
2023-08-15 00:55:07 +00:00
Taha Tesser
5c96642fa0
Update menu examples for SafeArea (#132390)
fixes [Some of the menu examples don't contain `SafeArea`](https://github.com/flutter/flutter/issues/132388)

### Description

This fixes the menu examples for running on mobile with a safe area.

![Group 2](https://github.com/flutter/flutter/assets/48603081/0d460c00-60f5-45e0-87ee-c010ede9ee42)
2023-08-14 20:30:01 +00:00
LongCatIsLooong
3f831b694f
Making TextPainter rounding hack disabled by default (#132094)
Migrate tests in flutter/flutter. Once the tests here and in `*_customer_testing` are migrated, the default value of the migration flag will be changed from false to true, making the rounding hack disabled by default.
2023-08-10 00:30:52 +00:00
Greg Spencer
e4a39fa2ed
Add applyFocusChangeIfNeeded, have menus restore focus before activating (#130536)
## Description

This modifies the `MenuAnchor` `onPressed` activation to delay until after the current frame is built, and resolve any focus changes before it invokes the `onPressed`, so that actions that operate on the `primaryFocus` can have a chance of working on the focused item they were meant to work on.

## Related Issues
 - Fixes https://github.com/flutter/flutter/issues/118731

## Tests
 - No tests yet (hence draft still)
2023-07-20 22:11:20 +00:00
Hans Muller
93f7dc321d
Updated the ThemeData API example (#130954) 2023-07-20 13:12:34 -07:00
Greg Spencer
0df4496cdb
Add missing example links (#130521)
## Description

This adds some more missing example links.

I also wrote another PR for adding a check to make sure that examples are all linked from a source file and have tests: https://github.com/flutter/flutter/pull/130523

## Related Issues
 - https://github.com/flutter/flutter/issues/129956

## Tests
 - Documentation and refactoring only.
2023-07-17 18:24:49 +00:00
Taha Tesser
476e2d5166
Add Badge widget to NavigationBar and NavigationRail examples (#129834)
fixes [Showcase `Badge` widget in `NavigationBar` and `NavigationRail` examples
](https://github.com/flutter/flutter/issues/129832)

| Preview | Preview | Preview |
| --------------- | --------------- | --------------- |
| <img src="https://github.com/flutter/flutter/assets/48603081/808c9577-c6b4-465f-b9fe-100d422dd408" /> | <img src="https://github.com/flutter/flutter/assets/48603081/c9b3ee03-56d7-4220-94cf-06e235631714" /> | <img src="https://github.com/flutter/flutter/assets/48603081/43fab47b-25e8-4412-92d2-6d4868e43ff8"  /> |
2023-07-11 09:30:05 +00:00
Greg Spencer
36f73cf645
Disable context menu (#128365)
## Description

Changes the context menu example for `MenuAnchor` so that it uses right-click, or (on macOS and iOS only) ctrl-left-click, for the context menu. Also disables the browser context menu on web platforms.

## Tests
 - Updated test to reflect new triggers.
2023-06-07 23:40:17 +00:00
Leigha Jarett
6c8cf3a9d0
Migration guide for moving from BottomNavigationBar to NavigationBar (#128263)
Fixes https://github.com/flutter/flutter/issues/127213
2023-06-06 03:52:07 +00:00
Hans Muller
4464d09db0
Updated TabBar and ToggleButtons examples (#128088)
Updated the ToggleButtons example and test to M3.

Updated the nested tabs test to avoid warnings like:
```
Warning: A call to tap() with finder "exactly one widget with type "Tab" which is an ancestor of text "Explore": Tab(text: "Explore", icon: Icon)" derived an Offset (Offset(666.7, 92.0)) that would not hit test on the specified widget.
```
2023-06-02 01:05:31 +00:00
Hans Muller
14136ae319
Updated custom ListTile examples (#128071) 2023-06-01 16:21:42 -07:00
Hans Muller
f0e32fc6ca
Updated Menu examples (#128080) 2023-06-01 15:27:34 -07:00
Hans Muller
420f442e5c
Updated InputDecoratorExamples for M3 (#128065) 2023-06-01 15:22:03 -07:00
Hans Muller
1a098ae8eb
Revised Floating Action Button examples (#128058)
Of the original 4 examples, the first 3 mostly covered the same API features and occupied quite a bit of real-estate at the top of https://api.flutter.dev/flutter/material/FloatingActionButton-class.html.  Additionally the illustrations and the code samples didn't match in some cases.

Replaced examples 0,1,2 with one example that changes attributes of the FAB when it's pushed. 

Fixes https://github.com/flutter/flutter/issues/128048
2023-06-01 22:16:48 +00:00
Taha Tesser
9bce790162
Updated the ToggleButtons API doc to link to SegmentedButton (#127021)
fixes https://github.com/flutter/flutter/issues/124884
2023-05-27 00:27:19 +00:00
LongCatIsLooong
1b800fd496
Remove Tooltip mouse tracker listener & update hovering/MouseRegion logic & animation (#119199)
Fixes https://github.com/flutter/flutter/issues/117627

### Behavior changes:
1. If fade in/fade out animation is already in progress, hiding/showing the tooltip will immediately take effect without waiting for `waitDuration`.
2. A PointerDownEvent that doesn't become a part of a "trigger" gesture dismisses the tooltip, even for hovered ones.
3. The OverlayEntry is now updated only when the previous tooltip was completely dismissed. This can be fixed by OverlayPortal but I'm not sure what the correct behavior is.
2023-05-25 07:24:45 +00:00
Sun Jiao
7b67aa587a
make suggestionsBuilder in SearchAnchor asyncable (#127019) 2023-05-24 13:12:47 -07:00
Justin McCandless
f6f5bb9023
Fix bug in Autocomplete example (#127219)
This example was incorrectly throwing away results from a query when multiple queries were pending at once.   Thanks to @sun-jiao in https://github.com/flutter/flutter/pull/127019#issuecomment-1552347037 for pointing this out.

I also added a quick  `Text` widget explaining what to do to use the examples.  Since there are only three small possible `options`, it's easy to type into the field and not get any results and wonder what's wrong.
2023-05-22 16:55:21 +00:00
Justin McCandless
9d882983ff
Autocomplete async examples (#126283)
Added examples clarifying how to fetch Autocomplete options asynchronously.
2023-05-17 09:46:26 -07:00
Istiak Ahmed
042eaf6b90
Add sample code for SliverAppBar (#125785)
This PR adds an another example for SliverAppBar, showing the use of stretch and onStretchTrigger

https://user-images.githubusercontent.com/68919043/235420973-2bfb9871-9e05-4d87-9538-941d43178c76.mp4

Fixes #125651 

### Adds sample code for SliverAppBar [stretch, onStretchTrigger]

This PR adds an another simple and easily understandable example code for SliverAppBar.
2023-05-05 18:09:25 +00:00
Bruno Leroux
de2615462c
Add a ReorderableListView example with cards + cleanup existing tests (#126155)
## Description

This PR adds one `ReorderableListView` example to demonstrate how `proxyDecorator` can be used to animate cards elevation.

https://user-images.githubusercontent.com/840911/236468570-d2b33ab3-6b6d-4f8d-90de-778dcf1ad8ce.mp4

For motivation, see https://github.com/flutter/flutter/issues/124729#issuecomment-1521524190.

## Related Issue

Fixes https://github.com/flutter/flutter/issues/124729

## Tests

Adds 1 tests.

This PR also moves some misplaced example tests from `examples/api/test/reorderable_list` to `examples/api/test/material/reorderable_list` (and replaces two existing ones).
2023-05-05 16:39:11 +00:00
Mitchell Goodwin
bd2617ecb9
Adaptive alert dialog (#124336)
Fixes #102811. Adds an adaptive constructor to AlertDialog, along with the adaptive function showAdaptiveDialog.

<img width="357" alt="Screenshot 2023-04-06 at 10 40 18 AM" src="https://user-images.githubusercontent.com/58190796/230455412-31100922-cfc5-4252-b8c6-6f076353f29e.png">
<img width="350" alt="Screenshot 2023-04-06 at 10 42 50 AM" src="https://user-images.githubusercontent.com/58190796/230455454-363dd37e-c44e-4aca-b6a0-cfa1d959f606.png">
2023-04-18 23:00:03 +00:00
Qun Cheng
6e85113418
Add an example for SearchBar (#124992)
This PR is to: 
* Update API doc for `SearchBar`.
* Add an example to show how to use a `SearchBar` as the builder of the `SearchAnchor`.
2023-04-17 23:23:57 +00:00
chunhtai
cc9ffd3f3b
SelectionContainer's listeners can remove itself during listener call… (#124624)
When swapping out delegate of  selectioncontainer, if the newly passed in delegate doesn't have any selectable content(which is usually the case), the selectioncontainerstate will notify all of the listeners. One of the listener would be SelectionRegistrant._updateSelectionRegistrarSubscription, and since it doesn't have content, it would remove itself from the listener which causes concurrent modification
2023-04-17 23:19:11 +00:00
Greg Spencer
e3bc8efd39
Rename Sample classes (#124080)
Rename Sample classes
2023-04-04 20:34:29 +00:00
Vinny
f44064991d
Modified TextField docs - Replaced 'labelText' to 'hintText' in code snippet (#94128)
Modified TextField docs - Replaced 'labelText' to 'hintText' in code snippet
2023-03-29 20:02:33 +00:00
Simon Binder
c71f1dd76b
Treat hidden IndexedStack children as offstage for test finder (#123129)
Treat hidden `IndexedStack` children as offstage for test finder
2023-03-29 19:58:58 +00:00
Hans Muller
59c9d4e845
Added ExpansionTileController (#123298)
Added ExpansionTileController
2023-03-24 00:51:06 +00:00
Pierre-Louis
02d5c7595b
Add support for secondary tab bar (#122756)
Add support for secondary tab bar
2023-03-23 22:49:59 +00:00
Michael Goderbauer
fda9ecfef7
Remove 1745 decorative breaks (#123259)
Remove 1745 decorative breaks
2023-03-22 21:12:22 +00:00
Bruno Leroux
961df985fa
Add ZoomPageTransitionsBuilder.allowSnapshotting (#122019)
Add ZoomPageTransitionsBuilder.allowSnapshotting
2023-03-06 22:43:00 +00:00
Bruno Leroux
a4ecd3e2f1
Cleanup PageTransitionsTheme documentation and add one example (#121701)
Cleanup PageTransitionsTheme documentation and add one example
2023-03-02 20:47:53 +00:00
Taha Tesser
87679ff1c3
Update date picker examples, remove unused variables and add missing tests (#121528)
Update date picker examples, remove unused variables and add missing tests
2023-02-28 08:31:51 +00:00
Taha Tesser
219ff64574
Reland "Update ExpansionTile to support Material 3 & add an example" (#121212) 2023-02-24 06:30:33 -08:00
Lioness100
26b6c1bedd
Fix typos (#121171)
* Fix typos

* lowercase animated & opacity

* Undo typo fix

---------

Co-authored-by: Michael Goderbauer <goderbauer@google.com>
2023-02-23 19:43:21 +00:00
Mushaheed Syed
7d85a585da
Add ActionButtonIconsData for overriding action icons (#118229)
* Add ActionButtonIconsData for overriding action icons

* Fix formatting issues

* Add missing exports in material library and add copyWith method in ActionButtonIconsData

* Move all action buttons, and icons to action_buttons.dart

* Rename actionButtonIcons to actionIconTheme

* Refactor buttons in action_buttons.dart to extend a private class for common implementation

* Refactor icons in action_buttons

* Fix docs in action_buttons_theme

* Fix #107646 always use 'Icons.arrow_back' as a back_button icon in web

* Update documentation for action buttons and add style parameter to every action button

* Fix analyzer warnings

* Add missing style argument in IconButton of _ActionButton

* Add tests for action buttons, action icon theme, drawer buttons, and back buttons

* Add example (+test) for action icon button's action icon theme in examples/api

* Fix analysis errors

* Add missing license header in action_icon_theme.0.dart

* Fix deprecation notice in theme_data.dart

* Update theme data tests for actionIconTheme

* Remove iconSize parameter from ActionButtons and update docs

* Fix failing tests

* Update button color during backbutton tests to red

* Fix analytics issues

* Fix format
2023-02-22 09:22:44 -08:00
Hans Muller
42b20cf953
Added ListTile.titleAlignment, ListTileThemeData.titleAlignment (#119872)
* added ListTile.textAlignment

* changed titlesHeight to titleHeight

* fixed a typo

* Add tests and example

* Update tests

* update example test

---------

Co-authored-by: tahatesser <tessertaha@gmail.com>
2023-02-09 18:34:01 +00:00
Hans Muller
212bac80d1
Revert "Update ExpansionTile to support Material 3 & add an example (#119712)" (#120300)
This reverts commit e8eac0d047.
2023-02-08 10:53:55 -08:00
Taha Tesser
e8eac0d047
Update ExpansionTile to support Material 3 & add an example (#119712) 2023-02-07 08:21:18 -08:00
Justin McCandless
575ced6c5a
Fix context menu web examples (#120104)
The context menu examples on the docs site now work on the web.
2023-02-06 15:51:11 -08:00