Flutter中如何访问AppBarTextField的搜索按钮？

Question

我无法访问AppBarTextField小部件的搜索按钮；我在下面给出了小部件；

AppBarTextField(
          leading: IconButton(
              onPressed: () {
                Get.back();
              },
              icon: Icon(Icons.arrow_back_ios)),
          iconTheme: IconThemeData(color: Colors.black),
          searchButtonIcon: Icon(Icons.search),
          centerTitle: true,
          defaultHintText: "Ara",
          searchContainerColor: Colors.white,
          style: GoogleFonts.montserrat(color: Colors.black),
          backgroundColor: Colors.white,
          autofocus: false,
          controller: searchController,
          title: Text(
            "Müşteri Listesi",
            style: GoogleFonts.montserrat(color: Colors.black),
          ),
          elevation: 0,
          onBackPressed: _onRestoreAllData,
          onChanged: _onSearchChanged,
        );

这就是我的意思；

我做了什么；

searchButtonIcon: IconButton(
          onPressed: () {
            print("my value");
          },
          icon: Icon(Icons.search)),

我确实像上面那样，它有效。当我按下搜索按钮时，它会打印我的值，但它没有执行其主要功能，例如，它不会打开文本字段进行输入。

Answer 1

您需要为您的搜索创建自定义搜索委托。下面的例子可以帮助你

class CustomSearchDelegate extends SearchDelegate {
  @override
  List<Widget> buildActions(BuildContext context) {
    return [
      IconButton(
        icon: Icon(Icons.clear),
        onPressed: () {
          query = '';
        },
      ),
    ];
  }

  @override
  Widget buildLeading(BuildContext context) {
    return IconButton(
      icon: Icon(Icons.arrow_back),
      onPressed: () {
        close(context, null);
      },
    );
  }

  @override
  Widget buildResults(BuildContext context) {
    if (query.length < 3) {
      return Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          Center(
            child: Text(
              "Search term must be longer than two letters.",
            ),
          )
        ],
      );
    }
    
return ListView(
children:[
// SEARCH RESULTS HERE
]);
    
  }

  @override
  Widget buildSuggestions(BuildContext context) {
    // This method is called everytime the search term changes. 
    // If you want to add search suggestions as the user enters their search term, this is the place to do that.
    return Column();
  }
}

然后在你的 IconButton 中调用这个 customSearchDelegate

IconButton(
  icon: Icon(Icons.search),
  onPressed: () {
    showSearch(
      context: context,
      delegate: CustomSearchDelegate(),
    );
  },
),

Answer 2

这就是我如何做我想做的事；

AppBar(
      leading: isTyping
          ? IconButton(
              onPressed: () {
                isTyping = false;
                setState(() {});
              },
              icon: Icon(Icons.arrow_back))
          : IconButton(
              onPressed: () {
                Get.back();
              },
              icon: Icon(Icons.arrow_back_ios)),
      iconTheme: IconThemeData(color: Colors.black),
      centerTitle: true,
      actions: [
        isTyping
            ? IconButton(
                onPressed: () {
                  /* isTyping = true; */
                  _onRestoreAllData();
                  setState(() {});
                },
                icon: Icon(Icons.close))
            : IconButton(
                onPressed: () {
                  isTyping = true;
                  focusNode.requestFocus();
                  setState(() {});
                },
                icon: Icon(Icons.search)),
      ],
      backgroundColor: Colors.white,
      title: isTyping
          ? TextField(
              onChanged: _onSearchChanged,
              controller: searchController,
              focusNode: focusNode,
              decoration: InputDecoration(
                  hintText: "Ara",
                  enabledBorder: UnderlineInputBorder(
                    borderSide: BorderSide(color: Colors.white),
                  ),
                  focusedBorder: UnderlineInputBorder(
                    borderSide: BorderSide(color: Colors.white),
                  )))
          : Text(
              "Müşteri Listesi",
              style: GoogleFonts.montserrat(color: Colors.black),
            ),
      elevation: 0,
    );

Answer 3

bool isSearch = false;  

biçiminde öncelikle bir değişken atarsın。达哈桑拉

• appbar için aşağıdaki if kontrolünü yaparsın:

     AppBar(
            actions: [
                          isSearch == true
                              ? SizedBox(
                                  width: 350,
                                  height: 70,
                                  child: TextField(
                                    decoration: InputDecoration(
                                        prefixIcon: IconButton(
                                            onPressed: () {
                                              isSearch == false;
                                              setState(() {});
                                            },
                                            icon: const Icon(Icons.close)),
                                        border: OutlineInputBorder(
                                            borderRadius: BorderRadius.circular(20))),
                                    controller: searchController,
                                  ),
                                )
                              : IconButton(
                                  onPressed: () {
                                    getSearchFood();
                                  },
                                  icon: const Icon(Icons.fastfood_rounded))
                        ],
                        title: isSearch == false
                            ? const Text("viewPage")
                            : const SizedBox.shrink(),

yani eğer isSearch == true ise textfield'ı göster değilse mevcut Icon gözüksün.

yani küçük bir değişkenle ekranın tamamını yönetmek mümkün