Question

更新：

该应用程序有两个有状态的窗口小部件屏幕：主页和搜索。这两个屏幕都有搜索框和底部导航。

需要解决的问题是，当用户点击主屏幕顶部的搜索框时，应用程序应将其带到搜索屏幕，而不隐藏底部导航（就像eBay应用一样）。

当用户在主屏幕上点击搜索框时，我曾尝试调用Search类。这种方法行得通。但是，新屏幕将导航栏隐藏在底部。

以下代码处理屏幕之间的导航。

class Home extends StatefulWidget {
  @override
  _HomeState createState() => _HomeState();
}
class _HomeState extends State<Home> {
  int _currentIndex = 0;
  final GlobalKey<NavigatorState> _navigatorKey = GlobalKey<NavigatorState>();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Navigator(
          key: _navigatorKey,
          onGenerateRoute: (RouteSettings settings) {
            switch (settings.name) {
              case 'Search':
                return MaterialPageRoute(builder: (context) => Search());
              default:
                return MaterialPageRoute(builder: (context) => UserHome());
            }
          }),
       bottomNavigationBar: BottomNavigationBar(
        onTap: _onTap,
        items: [
          BottomNavigationBarItem(icon: Icon(Icons.home),title: Text('Home'))
          BottomNavigationBarItem(icon: Icon(Icons.search), title: Text('Search'))
        ],
      ),
    );
  }

  void _onTap(int tappedIndex) {
    setState(() => _currentIndex = tappedIndex);
    switch (tappedIndex) {
      case 0:
        _navigatorKey.currentState.pushReplacementNamed('Home');
        break;
      case 1:
        _navigatorKey.currentState.pushReplacementNamed('Search');
        break;
    }
  }

}

Answer 1

如果您要执行此操作以进行自动化测试。您可以使用小部件测试来实现。轻拍中的小部件测试可以模拟按钮轻击并检查预期的输出

class TestPage extends StatefulWidget {
  @override
  _TestPageState createState() => _TestPageState();
}

class _TestPageState extends State<TestPage> {
  final GlobalKey<NavigatorState> _navigatorKey = GlobalKey<NavigatorState>();
  bool home;

  @override
  void initState() {
    super.initState();
    home = true;
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: home ? UserHome() : Search(),
      bottomNavigationBar: BottomNavigationBar(
        onTap: _onTap,
        items: [
          BottomNavigationBarItem(icon: Icon(Icons.home), title: Text('Home')),
          BottomNavigationBarItem(
              icon: Icon(Icons.search), title: Text('Search'))
        ],
      ),
    );
  }

  void _onTap(int tappedIndex) {
    setState(() {
      if (tappedIndex == 0) {
        home = true;
      } else {
        home = false;
      }
    });
  }
}

class UserHome extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Column(
      children: <Widget>[
        Center(
          child: Container(
            color: Colors.yellow,
            child: Text('USER HOME'),
          ),
        )
      ],
    );
  }
}

class Search extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Column(
      children: <Widget>[
        Center(
          child: Container(
            color: Colors.green,
            child: Text('SEARCH'),
          ),
        )
      ],
    );
  }
}

我知道这与您最初的解决方案并不十分相似，但是可以实现您想要的行为。

屏幕抖动

1 个答案: