Question

这将有很多解释，但我希望有人能够提供帮助。

当前，我在应用栏上有一个搜索按钮，当按下该按钮时，它会在应用栏标题上覆盖一个文本字段

正常的应用栏标题是一幅图像，我正在添加功能，当按下该功能时，它将带您进入主屏幕。这是棘手的，因为我需要使用这一行代码来实现这一点

new InkWell (
    child: Image.asset(
      'images/logoGrey.png',
      fit: BoxFit.fill,
    ),
    onTap: () {
      Navigator.push(
        context,
        MaterialPageRoute(
          builder: (context) =>
              LandingPage(),
        ),
      );
    },
  );

所以我将其设置为像这样的变量

class _ControlsPageState extends State<ControlsPage> {
  Widget appBarTitle = new InkWell (
    child: Image.asset(
      'images/logoGrey.png',
      fit: BoxFit.fill,
    ),
    onTap: () {
      Navigator.push(
        context,
        MaterialPageRoute(
          builder: (context) =>
              LandingPage(),
        ),
      );
    },
  );

我拥有此变量的原因是，当我单击搜索按钮时，我可以将appbar（title）的状态更改为文本字段，而当我关闭时，可以将其更改为图像。

但是这行不通（“ context”上的错误），似乎下面的这一行代码只能在“ Widget build（BuildContext context）”下使用，而不能在我的类中使用。...

onTap: () {
      Navigator.push(
        context,
        MaterialPageRoute(
          builder: (context) =>
              LandingPage(),
        ),
      );
    },

最重要的是，我需要我的appbar标题作为对变量“ appBarTitle”的回调，并且变量在“ context”上出现错误，无论如何我可以使这项工作吗？

如果有帮助，这里是应用程序条码

appBar: AppBar(
          iconTheme: new IconThemeData(color: Theme.CompanyColors.coolGrey),
          backgroundColor: Colors.white,
          centerTitle: true,
          title: appBarTitle ,
          actions: <Widget>[
            new IconButton(
              icon: actionIcon,
              onPressed: () {
                setState(() {
                  if (this.actionIcon.icon == Icons.search) {
                    this.actionIcon =
                        new Icon(Icons.close, color: Theme.CompanyColors.coolGrey);
                    this.appBarTitle = new TextField(
                      onSubmitted: (String str) {
                        setState(() {
                          result = str;
                        });
                        controller.text = "";
                        Navigator.push(
                          context,
                          MaterialPageRoute(
                            builder: (context) => ControlSearchPage(
                                search: result, title: "${widget.title}"),
                          ),
                        );
                      },
                      style: new TextStyle(
                        color: Colors.black,
                      ),
                      decoration: new InputDecoration(
                          prefixIcon:
                              new Icon(Icons.search, color: Theme.CompanyColors.coolGrey),
                          hintText: "Search...",
                          hintStyle: new TextStyle(color: Theme.CompanyColors.coolGrey)),
                    );
                  } else {
                    this.actionIcon =
                        new Icon(Icons.search, color: Theme.CompanyColors.coolGrey);
                    this.appBarTitle = new InkWell (
                      child: Image.asset(
                        'images/logoGrey.png',
                        fit: BoxFit.fill,
                      ),
                      onTap: () {
                        Navigator.push(
                          context,
                          MaterialPageRoute(
                            builder: (context) =>
                                LandingPage(),
                          ),
                        );
                      },
                    );
                  }
                });
              },
            ),
          ],
        ),

任何评论将不胜感激

Answer 1

您应该将appBarTitle更改为可以在状态更改时生成小部件而不是将其保存到变量的方法。这样，您可以确保仅在context可用时才生成它。

// Define a bool to hold the current search state
bool _isSearching = false;

...

// In your build method
appBar: AppBar(
  iconTheme: new IconThemeData(color: Theme.CompanyColors.coolGrey),
  backgroundColor: Colors.white,
  centerTitle: true,
  title: _buildAppBarTitle(),
  actions: <Widget>[
    new IconButton(
      icon: _isSearching
        ? new Icon(Icons.close, color: Theme.CompanyColors.coolGrey)
        : new Icon(Icons.search, color: Theme.CompanyColors.coolGrey),
      onPressed: () {
        setState(() => _isSearching = !_isSearching);
      },
    ),
  ],
),

...

// Define a separate method to build the appBarTitle
Widget _buildAppBarTitle() {
  if (_isSearching) {
    return new TextField(
      onSubmitted: (String str) {
        setState(() {
          result = str;
        });
        controller.text = "";
        Navigator.push(
          context,
          MaterialPageRoute(
            builder: (context) => ControlSearchPage(
                search: result, title: "${widget.title}"),
          ),
        );
      },
      style: new TextStyle(
        color: Colors.black,
      ),
      decoration: new InputDecoration(
          prefixIcon:
              new Icon(Icons.search, color: Theme.CompanyColors.coolGrey),
          hintText: "Search...",
          hintStyle: new TextStyle(color: Theme.CompanyColors.coolGrey)),
    );
  } else {
    return new InkWell (
      child: Image.asset(
        'images/logoGrey.png',
        fit: BoxFit.fill,
      ),
      onTap: () {
        Navigator.push(
          context,
          MaterialPageRoute(
            builder: (context) =>
                LandingPage(),
          ),
        );
      },
    );
  }

使用onTap导航器颤动创建变量

1 个答案: