Skip to content

[HCPP][Android] EditText magnifier does not show Flutter content behind a transparent platform view #187659

Description

@saibotma

With HCPP enabled, an Android native EditText embedded as a Flutter platform view does not appear to let the Android text magnifier sample the final Flutter-composited scene when the native EditText background is transparent.

The visual result on screen is:

  • Flutter draws a colored background behind the platform view.
  • The native EditText has a transparent background.
  • The user sees native text over the Flutter background.

However, when using the Android text magnifier, the loupe does not show that same final composed result. It appears to sample only the native platform-view surface. With a transparent native background, the loupe loses the Flutter background behind the platform view. With an opaque native background, the text itself is magnified, but at the edge of the native view the loupe still shows only the native surface instead of including the Flutter content behind or around the platform view.

I reproduced this on Flutter 3.44.1 on a Pixel 7. The repro displays and logs surfaceControlEnabled=true, so HCPP/SurfaceControl is active.

Repro

Minimal repro project: https://github.com/saibotma/hcpp_edit_text_loupe_repro

The repro embeds native Android EditText views using PlatformViewsService.initHybridAndroidView(...) and enables HCPP through Android manifest metadata:

<meta-data
    android:name="io.flutter.embedding.android.EnableHcpp"
    android:value="true" />

The app shows two native EditText platform views over the same purple Flutter background:

  1. an EditText with setBackgroundColor(Color.TRANSPARENT)
  2. an EditText with setBackgroundColor(Color.WHITE)

Both views use the same platform-view path. The transparent case visually shows the purple Flutter background behind the text, but the magnifier does not show that composed background correctly. The opaque case demonstrates the same composition issue at the native view edge: the loupe magnifies the native text and white native background, but it does not include the purple Flutter background behind or around the platform view.

Screenshots

Transparent native background Opaque native background Opaque native background at the view edge
The magnifier over the top native text field does not show the composed Flutter background correctly. The magnifier over the bottom native text field can magnify native text and native background pixels. The composition bug is visible at the top edge: the loupe shows only the native text field surface/background and does not include the Flutter background behind or around the platform view.
Image Image Image

Steps to reproduce

  1. Run the repro on an HCPP-capable Android device.

    flutter run --profile --enable-impeller --enable-hcpp
  2. Confirm that the app displays or logs:

    surfaceControlEnabled=true
    
  3. Long-press, drag the cursor, or select text inside the transparent native EditText.

  4. Observe the Android text magnifier.

  5. Repeat in the opaque native EditText.

Expected result

The Android text magnifier should show what the user sees at that screen location: native EditText text over the final Flutter-composited background. For a transparent native platform view, that should include the Flutter content behind the native view.

Actual result

The magnifier appears to sample only the native platform-view surface:

  • transparent native background: the Flutter background behind the native view is missing from the magnifier
  • opaque native background: at the native view edge, the magnifier shows only the opaque native surface and does not include the Flutter background behind or around the platform view

Why this matters

I am trying to use native Android text fields because Flutter TextField still has Android text-selection usability gaps that are important in text-heavy apps such as chat or document editing.

For example:

Native Android text fields provide native selection handles, magnifier behavior, context menu behavior, IME integration, and system gesture behavior. Some of these details seem difficult to match in Flutter without either diverging from native Android look and feel or reimplementing large parts of Android text editing behavior.

Because of that, a reliable native EditText platform-view path is still important even if Flutter TextField continues improving.

Related issues

Environment

  • Flutter 3.44.1
  • Device tested: Pixel 7
  • Android 16

Metadata

Metadata

Assignees

Labels

a: platform-viewsEmbedding Android/iOS views in Flutter appsf: selectionSelectableRegion, SelectionArea, SelectionContainer, Selectable, and related APIshas reproducible stepsThe issue has been confirmed reproducible and is ready to work onplatform-androidAndroid applications specificallyteam-androidOwned by Android platform team

Type

No type
No fields configured for issues without a type.

Projects

Status
Done

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions