Skip to content

Android keyboard animations isn't smooth and snaps to the position when It's in an Edge to Edge SystemUI mode #131152

Closed

Description

@Kaloyanes

Is there an existing issue for this?

Steps to reproduce

  1. Create an empty page with scaffold
  2. Place a Column with Expanded Container and at the bottom BottomAppBar with a textfield inside
  3. Click on the textfield and watch it snap to position

Expected results

The keyboard pops out and the text field stays on top of it at all times

Actual results

The keyboard pops out and the textfield follows a little behind and then pops in the position. It only happens when it's in a Edge to edge systemui mode done with SystemChrome.

Code sample

Code sample
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    SystemChrome.setEnabledSystemUIMode(SystemUiMode.edgeToEdge);
    SystemChrome.setSystemUIOverlayStyle(
      const SystemUiOverlayStyle(
        systemNavigationBarColor: Colors.transparent,
        statusBarColor: Colors.transparent,
        systemStatusBarContrastEnforced: false,
        systemNavigationBarContrastEnforced: false,
      ),
    );

    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: const MyHomePage(),
    );
  }
}

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

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('HomeView'),
      ),
      body: Column(
        children: [
          Expanded(child: Container()),
          BottomAppBar(
            color: Colors.transparent,
            child: Container(
              child: const TextField(
                decoration: InputDecoration(border: OutlineInputBorder(), label: Text("Съобщение")),
              ),
            ),
          ),
        ],
      ),
    );
  }
}

Screenshots or Video

Screenshots / Video demonstration

This is the result that is happening when in Edge to edge
https://github.com/flutter/flutter/assets/51166786/11d18540-a88d-4d4a-9ce0-ac34a62aea29

This is the result that should be happening in Edge to edge but it does not
https://github.com/flutter/flutter/assets/51166786/216b25f1-3c68-48ad-b306-8f9f8fd92daf

Logs

Logs
[Paste your logs here]

Flutter Doctor output

Doctor output
[✓] Flutter (Channel stable, 3.10.0, on Microsoft Windows [Version 10.0.22631.2048], locale en-US)
    • Flutter version 3.10.0 on channel stable at D:\flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 84a1e904f4 (3 months ago), 2023-05-09 07:41:44 -0700
    • Engine revision d44b5a94c9
    • Dart version 3.0.0
    • DevTools version 2.23.1

[✓] Windows Version (Installed version of Windows is version 10 or higher)

[✓] Android toolchain - develop for Android devices (Android SDK version 33.0.1)
    • Android SDK at C:\Users\kaloy\AppData\Local\Android\Sdk
    • Platform android-34, build-tools 33.0.1
    • ANDROID_HOME = C:\Users\kaloy\AppData\Local\Android\Sdk
    • Java binary at:
      C:\Users\kaloy\AppData\Local\JetBrains\Toolbox\apps\AndroidStudio\ch-0\223.8836.35.2231.10320515\jbr\bin\java
    • Java version OpenJDK Runtime Environment (build 17.0.6+0-b2043.56-10027231)
    • All Android licenses accepted.

[✓] Chrome - develop for the web
    • Chrome at C:\Program Files\Google\Chrome\Application\chrome.exe

[✓] Visual Studio - develop for Windows (Visual Studio Community 2022 17.5.5)
    • Visual Studio at C:\Program Files\Microsoft Visual Studio\2022\Community
    • Visual Studio Community 2022 version 17.5.33627.172
    • Windows 10 SDK version 10.0.22621.0

[✓] Android Studio (version 2022.2)
    • Android Studio at C:\Users\kaloy\AppData\Local\JetBrains\Toolbox\apps\AndroidStudio\ch-0\222.4459.24.2221.10121639
    • Flutter plugin version 74.0.2
    • Dart plugin version 222.4582
    • Java version OpenJDK Runtime Environment (build 17.0.6+0-b2043.56-9586694)

[✓] Android Studio (version 2022.3)
    • Android Studio at C:\Users\kaloy\AppData\Local\JetBrains\Toolbox\apps\AndroidStudio\ch-0\223.8836.35.2231.10320515
    • Flutter plugin version 74.0.2
    • Dart plugin version 222.4582
    • Java version OpenJDK Runtime Environment (build 17.0.6+0-b2043.56-10027231)

[✓] IntelliJ IDEA Ultimate Edition (version 2023.1)
    • IntelliJ at C:\Users\kaloy\AppData\Local\JetBrains\Toolbox\apps\IDEA-U\ch-1\231.8109.175
    • Flutter plugin version 73.0.4
    • Dart plugin version 231.8109.91

[✓] VS Code (version 1.80.1)
    • VS Code at C:\Users\kaloy\AppData\Local\Programs\Microsoft VS Code
    • Flutter extension version 3.62.0

[✓] Connected device (4 available)
    • Pixel 7 Pro (mobile) • 34031FDH30014X • android-arm64  • Android 14 (API 34)
    • Windows (desktop)    • windows        • windows-x64    • Microsoft Windows [Version 10.0.22631.2048]
    • Chrome (web)         • chrome         • web-javascript • Google Chrome 113.0.5672.127
    • Edge (web)           • edge           • web-javascript • Microsoft Edge 114.0.1823.82

[✓] Network resources
    • All expected network resources are available.

• No issues found!

Activity

  1. vishnumad commented on Jul 23, 2023

    @vishnumad

    Seems to be fixed already: flutter-team-archive/engine#39391
    I think we just need to wait for 3.11 release

  2. Kaloyanes commented on Jul 23, 2023

    @Kaloyanes
    Author

    @vishnumad oh, ok then. That is nice!
    Thanks for redirecting me to this issue!

  3. github-actions commented on Aug 6, 2023

    @github-actions

    This thread has been automatically locked since there has not been any recent activity after it was closed. If you are still experiencing a similar issue, please open a new bug, including the output of flutter doctor -v and a minimal reproduction of the issue.

  4. locked as resolved and limited conversation to collaborators on Aug 6, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions