This library will support the Flutter version

[vera-byte]

Is your feature request related to a problem? Please describe. A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]

Describe the solution you'd like A clear and concise description of what you want to happen.

Describe alternatives you've considered A clear and concise description of any alternative solutions or features you've considered.

Additional context Add any other context or screenshots about the feature request here.

[kirillzyusko]

Hello @vera-byte

I don't think I'm going to add support for Flutter anytime soon (though if I receive more requests I will think about it).

From what I've seen Flutter has a support for tracking keyboard frames, and there are some packages as https://pub.dev/packages/keyboard_actions that provides a part of functionality of this library.

Is there anything else in this package that Flutter can not implement at the moment?

[vera-byte]

https://github.com/kirillzyusko/react-native-keyboard-controller/assets/42960387/679a8915-ebbd-4c85-9cf8-3a7c97ed1b6a

https://github.com/kirillzyusko/react-native-keyboard-controller/assets/42960387/a99bdf48-5ca3-40e7-8d55-f016a85b3fb3

Video 1 was developed by Flutter App. When the keyboard is raised, there is always a certain delay in the input box. In video 2, react-native-keyboard-controller is used, which is comparable to native

The above is the problem I encountered

[vera-byte]

I found many plug-ins on Flutter Pub but failed to solve this problem. However, with the help of netizens, react-native-keyboard-controller was provided.

[kirillzyusko]

@vera-byte are you referring to delay between input box and actual keyboard position (like input box is always ahead of keyboard, right)?

For a keyboard-controller - which hook did you use for implementation? Can you share a small code sample that you used in your implementation? Asking because of this depends my further answer 👀

[kirillzyusko]

@vera-byte But basically - useKeyboardAnimation/useReanimatedKeyboardAnimation depends on default iOS implementation, and since RN renders truly native views -> animations are also managed by OS and because of that everything runs super smooth and synchronized.

From the other side Flutter renders everything on a pixel level (via Skia engine) and it has to perform animations on its own. And for that you have to synchronize keyboard animation and flutter animation and it's pretty challenging task 😔

Do you use latest version of Flutter? I remember they recently (I think a year ago 😅) made a lot of improvements.

[vera-byte]

@vera-byte但基本上 - useKeyboardAnimation/useReanimatedKeyboardAnimation取决于默认的 iOS 实现，并且由于 RN 渲染真正的原生视图 -> 动画也由 OS 管理，因此一切都运行得非常流畅和同步。

另一方面，Flutter 在像素级别渲染所有内容（通过 Skia 引擎），并且必须自行执行动画。为此，您必须同步键盘动画和 Flutter 动画，这是一项非常具有挑战性的任务 😔

你使用最新版本的 Flutter 吗？我记得他们最近（我想是一年前 😅）做了很多改进。

This is the version of FLutter I am currently using

[vera-byte]

@vera-byte您指的是输入框和实际键盘位置之间的延迟吗（比如输入框总是在键盘前面，对吗）？

对于keyboard-controller- 您使用了哪个钩子来实现？您可以分享一下您在实现中使用的小代码示例吗？因为这个而问的问题取决于我的进一步回答👀

Example Code

import 'package:flutter/material.dart';

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

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

@override Widget build(BuildContext context) { return MaterialApp( title: 'Flutter Demo', theme: ThemeData( colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple), useMaterial3: true, ), home: const MyHomePage(title: 'Flutter Demo Home Page'), ); } }

class MyHomePage extends StatefulWidget { const MyHomePage({super.key, required this.title});

final String title;

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

class _MyHomePageState extends State { final FocusNode _focusNode = FocusNode(); bool visible = false;

void _visible() { setState(() { print("之行"); visible = !visible; _focusNode.unfocus(); }); }

@override void initState() { super.initState(); _focusNode.addListener(_onFocusChange); }

void _onFocusChange() { if (_focusNode.hasFocus) { setState(() { visible = false; }); } }

@override void dispose() { _focusNode.removeListener(_onFocusChange); _focusNode.dispose(); super.dispose(); }

@override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( backgroundColor: Theme.of(context).colorScheme.inversePrimary, title: Text(widget.title), ), body: Column( children: [ Expanded( child: ListView( children: List.generate(40, (index) => const Text("data")), ), ), SafeArea( child: Column( children: [ Row( children: [ IconButton( onPressed: _visible, icon: const Icon(Icons.image), ), Expanded( child: TextField( focusNode: _focusNode, ), ), ], ), Row( mainAxisAlignment: MainAxisAlignment.spaceEvenly, children: List.generate( 6, (index) => TextButton( onPressed: () {}, child: Text("按钮$index"), ), ), ), // ClipRect( // child: AnimatedContainer( // curve: Curves.bounceIn, // duration: const Duration(milliseconds: 300), // height: visible ? 200.0 : 0.0, // color: Colors.green, // // 在这里添加你的额外内容或子 Widget // ), // ), AnimatedContainer( curve: Curves.easeOutQuint, duration: const Duration(milliseconds: 500), height: visible ? 300.0 : 0, color: Colors.green, // 添加你的子 Widget ), ], ), ), ], ), ); } }

[kirillzyusko]

import 'package:flutter/material.dart';

@vera-byte I was asking about react-native-keyboard-controller code (for the second video) 🙈

[kirillzyusko]

@vera-byte I'm going to close that issue, because the answer on the original question - "No, I'm not planning to add a support for Flutter in a near future".

However feel free to share additional code samples from keyboard-controller project - I'll be happy to answer on your questions and difference between flutter/react-native 🙌 😊