搜尋套件、儲存庫與 APP 分類

flutter_persistent_keyboard_height 封面
套件詳情v1.0.5

flutter_persistent_keyboard_height

用於取得鍵盤高度的 Flutter 套件。可用於以正確高度顯示貼紙/表情符號模態框。

AndroidiOS
近 30 天下載
52
喜歡數
33
Pub 分數
150

安裝套件

flutter pub add flutter_persistent_keyboard_height

套件介紹

根據套件公開資料產生的選型評估,僅供參考。

一個 Flutter 套件,可持續提供螢幕鍵盤的高度,以實現精確的 UI 調整。它特別適用於將貼紙或表情符號模態框等元件相對於鍵盤進行定位。此套件可在 Android 和 iOS 平台上運作,確保行為一致。它會監聽鍵盤狀態變更,並透過串流暴露目前的高度,方便整合至響應式版面中。

適用情境

  • 鍵盤彈出時調整UI佈局
  • 將模態框置於鍵盤上方
  • 確保內容在輸入期間保持可見
  • 建立具有動態輸入區域的聊天介面
  • 使用即時鍵盤感知建構表單

主要特色

  • 即時鍵盤高度監控
  • 跨平台支援(Android 與 iOS)
  • 基於流的 API,用於反應式更新
  • 最小化設定和整合
  • 即使在動畫過程中也能準確檢測高度

適合對象

  • 聊天應用開發者
  • 表單建構器
  • 需要鍵盤感知的UI組件
  • 開發輸入密集型介面的開發者
  • 靠近鍵盤的浮動操作按鈕的應用程式

使用建議

  • 需要正確釋放串流以避免記憶體洩漏
  • 可能需要額外的邏輯來處理像分體鍵盤這樣的邊緣情況
  • 不適用於靜態鍵盤高度場景
  • 依賴於平台特定的鍵盤事件
  • 應在多個設備和作業系統版本上進行測試

原始 README

以下為關聯原始碼儲存庫的 README 原文快照,最新內容請造訪原始碼儲存庫。

flutter_persistent_keyboard_height Pub version

Flutter package to get keyboard height. The height is persisted during app sessions and keyboard states (you can use the height when keyboard is closed).

Usage

Registering the provider

First thing you need to do is wrap a widget from children of which you want to get the keyboard height with PersistentKeyboardHeightProvider. Add it to the builder of your app widget (perhaps MaterialApp) if you want to get keyboard height from all widgets.

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Persistent Keyboard Height Example',
      home: const FlutterPersistentKeyboardHeightExample(),
      builder: (context, child) => PersistentKeyboardHeightProvider(
        child: child!,
      ),
    );
  }
}
Getting the keyboard height

In order to get keyboard height use the PersistentKeyboardHeight inherited widget:

Widget build(BuildContext context) {
  final keyboardHeight = PersistentKeyboardHeight.of(context).keyboardHeight;

  return Scaffold(
    body: Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        const Padding(
          padding: EdgeInsets.all(16.0),
          child: TextField(
            decoration: InputDecoration(
              labelText: 'Flutter Persistent Keyboard Size Example',
            ),
          ),
        ),
        const SizedBox(height: 8),
        Text('Keyboard height: $keyboardHeight'),
      ],
    ),
  );
}
Using a custom storage provider

By default, the package uses shared_preferences to preserve the keyboard height but if you want to use a custom solution for preserving the height you can do that by implementing the IPersistentKeyboardHeightStorageProvider interface and passing an instance of the class to PersistentKeyboardHeightProvider:

class CustomPersistentKeyboardHeightStorageProvider
    implements IPersistentKeyboardHeightStorageProvider {
  const CustomPersistentKeyboardHeightStorageProvider();

  @override
  Future<double> getHeight() {
    // read the height from storage
  }

  @override
  Future<void> setHeight(double height) {
    // save the height to storage
  }
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Persistent Keyboard Height Example',
      home: const FlutterPersistentKeyboardHeightExample(),
      builder: (context, child) => PersistentKeyboardHeightProvider(
        child: child!,
      ),
    );
  }
}

Check out the example directory for a complete example app.

The development process

The first version of this package was developed in two livestreams. Unfortunately, my voice disappeared at the middle of the first livestream but the second livestream is okay. In case you want to check them out, here are the links: Part 1, Part 2.

Thanks to

所屬分類

依賴

依賴清單 2 項

原始碼儲存庫

使用此套件的專案

暫無相關資料。