0

我制作bottomNavigationBar如下

  List<Widget> pages = [
    Dashboard(),
    AllServices(),
    InformationPage(),
  ];


  int _selectedIndex = 0;

  Widget _bottomNavigationBar(int selectedIndex)  {
    return BottomNavigationBar(
      onTap: (int index) => setState(() => _selectedIndex = index),
      currentIndex: selectedIndex,
      type: BottomNavigationBarType.fixed,
      items: <BottomNavigationBarItem>[
        BottomNavigationBarItem(
          icon: new Icon(Icons.home),
          title:  new Text("Dashboard"),
        ),
        BottomNavigationBarItem(
          icon: new Icon(Icons.location_on),
          title: new Text("AllServices"),
        ),
        BottomNavigationBarItem(
          icon: new Icon(Icons.person),
          title:new Text("InformationPage"),
      ],
    );

  }

  @override
  Widget build(BuildContext context) {

    return Scaffold(
      bottomNavigationBar: _bottomNavigationBar(_selectedIndex),
      body: pages[_selectedIndex],
    );
  }

如果用户在页面之间导航,每件事都是正确的,但是 AllServices 类有两个条件来呈现两个不同的小部件,我想要如果用户在 AllServices 页面中再次 ontap AllServices 底部导航 AllServices 页面再次重建但 ontap 不适用于同一页面再次重建它我怎么解决这个问题?

4

1 回答 1

1

只需检查我制作的以下代码:


import 'package:flutter/material.dart';
import 'package:wrap_text/dashboard.dart';


void main() => runApp(MyApp());

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Dashboard(),
      ),
    );
  }
}

以下是我制作 bootomAppbar 的 helper_widget 文件:

import 'package:flutter/material.dart';
import 'package:wrap_text/dashboard.dart';


Widget bottomAppBar(context) {
  return BottomAppBar(
    color: Colors.black,
    child: Container(
      child: Row(
        mainAxisSize: MainAxisSize.max,
        mainAxisAlignment: MainAxisAlignment.spaceAround,
        children: <Widget>[
          IconButton(
            iconSize: 30.0,
            icon: Icon(Icons.home,color: Colors.white,),
            onPressed: () {
              Navigator.push(
                context,
                MaterialPageRoute(builder: (context) => Dashboard()),
              );
            },
          ),
          IconButton(
            iconSize: 30.0,
            icon: Icon(Icons.location_on,color: Colors.white,),
            onPressed: () {
              Navigator.push(
                context,
                MaterialPageRoute(builder: (context) => AllServices()),
              );
            },
          ),
          IconButton(
            iconSize: 30.0,
            icon: Icon(Icons.settings,color: Colors.white,),
            onPressed: () {
              Navigator.push(
                context,
                MaterialPageRoute(builder: (context) => InformationPage()),
              );
            },
          ),
        ],
      ),
    ),
  );
}



// this are the different pages for just a sample.
 class AllServices extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     return Container(

     );
   }
 }



class InformationPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      child: Center(child: Text('Information PAge')),
    );
  }
}

这是仪表板页面:

import 'package:flutter/material.dart';
import 'package:wrap_text/helper_widget.dart';

class Dashboard extends StatefulWidget {
  @override
  _DashBoardState createState() => _DashBoardState();
}

class _DashBoardState extends State<Dashboard> {

  @override
  Widget build(BuildContext context) {
     print('fguyhg');
    return Scaffold(
      appBar: AppBar(title: Text('sample'),),
      bottomNavigationBar: bottomAppBar(context),
          body: Container(
        child: Center(child: Text('Dashboard Page')),
      ),
    );
  }
}
于 2020-03-22T14:16:11.227 回答