# Exploring Flutter 3.3

# **Global Selection**

Until now, when trying to select the text, Flutter web apps didn’t behave as expected.

Now, everything is different!

Any child of the SelectableArea widget now has selection enabled at no additional cost thanks to the release of the [`SelectableArea`](https://api.flutter.dev/flutter/material/SelectionArea-class.html) widget!

Let’s test it out by launching the command below to create a new project.

```plaintext
flutter create --sample=material.SelectionArea.1 example_selection_area
```

Wrap your route body (such as the `Scaffold`) with the `SelectionArea` to take advantage of this powerful new feature, sit back and let Flutter take care of the rest.

![](https://miro.medium.com/v2/resize:fit:700/1*oJK-MU0rjfV0TJDMHMSVNw.gif align="left")

# **Trackpad input**

Trackpad input is better supported by Flutter 3.3. This not only offers a more profound and smoother level of control, but in some circumstances, it also lessens misinterpretation. Because Flutter is delivering the “scrolling” action, which isn’t recognized by the cards but is by the scroll view, scrolling on a trackpad correctly scrolls the list after upgrading to Flutter 3.3.

For more information, see the [Flutter Trackpad Gesture](https://docs.google.com/document/d/1oRvebwjpsC3KlxN1gOYnEdxtNpQDYpPtUFAkmTUe-K8/edit?resourcekey=0-pt4_T7uggSTrsq2gWeGsYQ)

# **Scribble**

On [supported iPad models](https://support.apple.com/en-in/guide/ipad/aside/ipad47ee2e98/15.0/ipados/15.0), you can use Apple Pencil and [Scribble](https://support.apple.com/en-in/guide/ipad/ipad355ab2a7/ipados) to enter text. Without opening or using the onscreen keyboard, you can quickly reply to a message, write yourself a reminder, and more. Scribble converts your handwriting to text directly on your iPad, so your writing stays private.

The incredible contributions of community member [fbcouch](https://github.com/fbcouch) have enabled Flutter to support Scribble handwriting input on iPadOS using the Apple Pencil.

Let’s give it a shot. Just use Flutter 3.3 to rebuild any of your current projects.

![](https://miro.medium.com/v2/resize:fit:600/1*8SD6GgqXHhnoKtqe8tTfhw.gif align="left")

It works :)

# **Text input**

This release adds the capability to get precise text updates from the platform’s `TextInputPlugin`, which will help support rich text editing. TextEditingDeltas and `DeltaTextInputClient` bridge the information gap left by the `TextInputClient`, which previously just returned the new editing state with no delta between the old and new. You can create an input field with stylistic ranges that enlarge and decrease as you type if you have access to these deltas.

To learn more, check out the [Rich Text Editor demo](https://flutter.github.io/samples/rich_text_editor.html).

# **Material Design 3**

More Material Design 3 components are being migrated to Flutter by the Flutter team. Updates to `IconButton`, `Chips`, and the large and medium `AppBar` versions are all included in this release.

Now in your `main.dart` file set `useMaterial3: true` inside `ThemeData`

```plaintext
...
@override
Widget build(BuildContext context) {
  return MaterialApp(
    title: _title,
    theme: ThemeData(
      useMaterial3: true,
    ),
    home: SelectionArea(
      child: Scaffold(
...
```

Checkout [*demo app*](https://flutter.github.io/samples/web/material_3_demo/#/)

## **IconButton**

![](https://miro.medium.com/v2/resize:fit:700/0*DGom-dGAgSuqNXzb align="left")

# **Chip**

![](https://miro.medium.com/v2/resize:fit:700/0*XS17s9h_YhqxIlNp align="left")

# **Medium and large AppBar**

We have to use`CustomScrollView` for `SliverAppBar.medium` and set `useMaterial3: true` inside `ThemeData`

![](https://miro.medium.com/v2/resize:fit:600/1*5BfSOtdqZ7GInfqSMPlQ_g.gif align="left")

For large `AppBar` just change `SliverAppBar.medium` to `SliverAppBar.large`

![](https://miro.medium.com/v2/resize:fit:600/1*m0Uv9qxxH2prJBix0TDJ_w.gif align="left")

# **Windows**

Previously, a file related to the Windows program was used to set the version of the Windows desktop application. The way other systems established their versions was different from this behavior.

\`Versions of Windows desktop applications can now be changed using the build parameters and `pubspec.yaml` file in your project.

This makes it simpler to enable automatic updates so that your end users can receive the most recent version of an application when a new version is pushed.

# **Summary**

There are tons of more features, performance improvements, DevTools updates, cache improvements, Stability, API improvements, Changes to supported platforms, and more. You can read about it all in the official article [here](https://medium.com/flutter/whats-new-in-flutter-3-3-893c7b9af1ff).

Checkout a quick video for Global Selection & Scribble in Flutter 3.3