0
点赞
收藏
分享

微信扫一扫

Flutter中如何实现手机键盘右下角完成键搜索

要实现在手机键盘右下角显示“完成”键作为搜索按钮,可以使用TextInputAction属性来控制键盘的行为。将textInputAction属性设置为TextInputAction.search即可将键盘右下角的按钮改为“完成”按钮,并且点击该按钮时会触发提交(搜索)操作。

下面是一个示例代码:

import 'package:flutter/material.dart';

class SearchScreen extends StatefulWidget {
  @override
  _SearchScreenState createState() => _SearchScreenState();
}

class _SearchScreenState extends State<SearchScreen> {
  TextEditingController _searchController = TextEditingController();

  @override
  void dispose() {
    _searchController.dispose();
    super.dispose();
  }

  void _submitSearch() {
    String keyword = _searchController.text;
    // 在这里执行搜索逻辑
    print('搜索关键词:$keyword');
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('搜索页面'),
      ),
      body: Column(
        children: [
          TextField(
            controller: _searchController,
            decoration: InputDecoration(
              hintText: '输入搜索内容',
            ),
            textInputAction: TextInputAction.search, // 设置为搜索操作
            onSubmitted: (_) => _submitSearch(), // 提交(搜索)操作回调函数
          ),
        ],
      ),
    );
  }
}

void main() {
  runApp(MaterialApp(home: SearchScreen()));
}

在上述示例中,我们首先创建了一个TextEditingController对象_searchController来管理搜索框的文本。

然后,在TextField中,我们将controller属性设置为_searchController以便管理搜索框的文本。

接下来,通过设置textInputAction属性为TextInputAction.search,我们将键盘右下角的按钮改为“完成”按钮,同时点击该按钮时会触发onSubmitted回调函数。

最后,我们编写了_submitSearch()方法来处理搜索操作。在这个方法中,可以获取搜索关键词,并执行实际的搜索逻辑(这里只是简单地打印关键词)。

使用以上代码,在搜索框中输入内容后,点击键盘上的“完成”按钮即可触发搜索操作。

举报

相关推荐

0 条评论