Выполните функцию поиска внутри панели приложений и измените состояние страницы под ней - PullRequest
1 голос
/ 09 июля 2020

Я реализовал панель поиска внутри appBar, в которой приложение использует пакет Curved_navigation_bar.

Я хочу передать функцию поиска внутри searchTab; // (NaviagtionSearchTab)

import 'package:curved_navigation_bar/curved_navigation_bar.dart';
import 'package:flutter/material.dart';

class HomeScreen extends StatefulWidget {
  @override
  _HomeScreenState createState() => _HomeScreenState();
}

class _HomeScreenState extends State<HomeScreen> {
  bool cartTab = false;
  int _page = 0;
  GlobalKey _bottomNavigationKey = GlobalKey();

  static TextEditingController controller1 = TextEditingController();

  final NavigationTabHome tab1 = NavigationTabHome();
  final NavigationTabCategory tab2 = NavigationTabCategory();
  final NavigationTabSearch tab3 = NavigationTabSearch();
  final NavigationTabOffer tab4 = NavigationTabOffer();
  final NavigationTabCart tab5 = NavigationTabCart();

  // ignore: missing_return
  Widget pageChooser(int page) {
    switch (page) {
      case 0:
        return tab1;
      case 1:
        return tab2;
      case 2:
        return tab3;
      case 3:
        return tab4;
      case 4:
        return tab5;
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Color(0xffF4F4F4),
      appBar: AppBar(
        bottom: PreferredSize(
          preferredSize: Size.fromHeight(50),
          child: Padding(
            padding: const EdgeInsets.symmetric(vertical: 8.0),
            child: Container(
              width: 360,
              height: 45,
              child: TextField(
                controller: controller1,
                onTap: () {
                  final CurvedNavigationBarState navBarState =
                      _bottomNavigationKey.currentState;
                  navBarState.setPage(2);
                },
                onSubmitted: (value) {
                  setState(() {
                  //From here i want to pass the value to the searchTab... ie NaviagtionSearchtab
                    });
                },
                decoration: InputDecoration(
                    hintText: "What are you looking for!!",
                    suffixIcon: Icon(
                      Icons.search,
                      size: 20,
                      color: Colors.black,
                    ),
                    contentPadding: const EdgeInsets.all(0.0),
                    border: OutlineInputBorder(
                        borderSide: BorderSide(color: Colors.black))),
              ),
            ),
          ),
        ),
        title: Text("Search Bar"),
        actions: [
          Icon(Icons.person_pin)
        ],
      ),
      bottomNavigationBar: CurvedNavigationBar(
        key: _bottomNavigationKey,
        index: 0,
        height: 50.0,
        items: <Widget>[
          Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Container(
                width: 20,
                height: 20,
                child: Image.asset("assets/images/home.png",
                    fit: BoxFit.fill,
                    color: _page == 0 ? const Color(0xffFF6200) : Colors.black),
              ),
              Text(
                "Home",
                style: TextStyle(fontSize: 10),
              )
            ],
          ),
          Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Container(
                width: 20,
                height: 20,
                child: Image.asset("assets/images/category.png",
                    fit: BoxFit.fill,
                    color: _page == 1 ? const Color(0xffFF6200) : Colors.black),
              ),
              Text(
                "Category",
                style: TextStyle(fontSize: 10),
              )
            ],
          ),
          Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Icon(Icons.search,
                  size: 20,
                  color: _page == 2 ? const Color(0xffFF6200) : Colors.black),
              Text(
                "Search",
                style: TextStyle(fontSize: 10),
              )
            ],
          ),
          Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Container(
                width: 20,
                height: 20,
                child: Image.asset(
                  "assets/images/discount.png",
                  color: _page == 3 ? const Color(0xffFF6200) : Colors.black,
                  fit: BoxFit.fill,
                ),
              ),
              Text(
                "Offer",
                style: TextStyle(fontSize: 10),
              )
            ],
          ),
          Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              Container(
                width: 20,
                height: 20,
                child: Image.asset(
                  "assets/images/cart.png",
                  color: _page == 4 ? const Color(0xffFF6200) : Colors.black,
                  fit: BoxFit.fill,
                ),
              ),
              Text(
                "Cart",
                style: TextStyle(fontSize: 10),
              )
            ],
          ),
        ],
        color: Colors.white,
        buttonBackgroundColor: Colors.white,
        backgroundColor: Color(0xff4d4d4d).withOpacity(0),
        animationCurve: Curves.easeInOut,
        animationDuration: Duration(milliseconds: 600),
        onTap: (index) {
          setState(() {
            _page = index;
            index == 4 ? cartTab = true : cartTab = false;
          });
        },
      ),
      body: pageChooser(_page),
    );
  }
}

Из вышеуказанного текстового контроллера я хочу передать текст на вкладку ниже и изменить состояние при каждом onSubmit Всякий раз, когда я выполняю onSubmit, следующая вкладка должна работать с результатами поиска. . в настоящее время initstate работает с getItems ("soap") ... что дает результат, связанный с soap ...

import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:flutter/material.dart';
import 'package:grocb/ItemView.dart';

class NavigationTabSearch extends StatefulWidget {
  @override
  _NavigationTabSearchState createState() => _NavigationTabSearchState();
}

class _NavigationTabSearchState extends State<NavigationTabSearch> {
  final _fireStore = Firestore.instance;
  Future future;

  Future getItems(value) async {
    List<DocumentSnapshot> documentList = (await _fireStore
            .collection("Product")
            .where("caseSearch",
                arrayContains: value[0].toUpperCase() + value.substring(1))
            .getDocuments())
        .documents;
    return documentList;
  }

  @override
  void initState() {
    // TODO: implement initState
    future = getItems("soap");
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return ListView(
      children: [
        Container(
          height: 400,
          child: FutureBuilder(
              future: future,
              builder: (_, snapshot) {
                if (snapshot.connectionState == ConnectionState.waiting) {
                  return Center(
                    child: CircularProgressIndicator(
                      backgroundColor: Colors.amber,
                    ),
                  );
                } else {
                  return ListView.builder(
                      itemCount: snapshot.data.length,
                      itemBuilder: (context, index) {
                        return SearchResults(
                          category: snapshot.data[index]["category"],
                          image: snapshot.data[index]['stock'],
                          name: snapshot.data[index]['ProductName'],
                          quantity: snapshot.data[index]['quantity'],
                          rate: snapshot.data[index]['Price'],
                        );
                      });
                }
              }),
        ),
      ],
    );
  }
} 
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...