代码之家  ›  专栏  ›  技术社区  ›  Septian Dika

如何在flutter中更改AppBar标题(在图像资源和文本之间)?

  •  0
  • Septian Dika  · 技术社区  · 4 年前

    import 'package:flutter/material.dart';
    import 'package:teld/page/homepage/homePage.dart';
    import 'package:teld/page/listpage/listPage.dart';
    import 'package:teld/page/settingPage.dart';
    
    
    
    void main() => runApp(MyApp());
    
    class MyApp extends StatelessWidget {
      @override
      Widget build(BuildContext context) {
        return MaterialApp(
          theme: ThemeData(fontFamily: 'Roboto'),
          home: NavStructure(),
          );
      }
    }
    
    class NavStructure extends StatefulWidget {
      @override
      _NavStructureState createState() => _NavStructureState();
    }
    
    class _NavStructureState extends State<NavStructure>{
      final GlobalKey<ScaffoldState> _scaffoldKey = new GlobalKey<ScaffoldState>();
      int _currentIndex = 0;
      var _title;
    
      final _page = [
        HomePage(),
        ListPage(),
        SettingPage(),
      ];
    
      void onTapBar(int index) {
        setState(() {
          _currentIndex = index;
          switch(index){
            case 0:{
              _title = Image.asset('assets/TDLogoNB.png', height: 38.0,);
            }break;
            case 1:{
              _title = Text("List Page");
            }break;
            case 2:{
              _title = Text("Setting Page");
            }break;
          }
        });
      }
    
      @override
      Widget build(BuildContext context) {
        return Scaffold(
          key: _scaffoldKey,
          appBar: AppBar(
            elevation: 0,
            centerTitle: true,
            backgroundColor: Colors.white,
            title: _title    //this
            ),
          body: _page[_currentIndex],
          bottomNavigationBar: BottomNavigationBar(
            onTap: onTapBar,
            currentIndex: _currentIndex,
            items: [
             BottomNavigationBarItem(
               icon: Icon(Icons.home),
               title: Text('Home'),
             ),
             BottomNavigationBarItem(
               icon: Icon(Icons.list_view),
               title: Text('List Page'),
             ),
             BottomNavigationBarItem(
               icon: Icon(Icons.settings),
               title: Text('Setting Page'),
             ),
           ],
         ),
    
        );
      }
    }
    

    我想做的是

    • 主页中带有图像资产的appbar标题

    从我的代码。 ListPage中的appbar标题(作为文本)根本没有出现。 主页上的“图像资产”也没有出现,直到我第二次打开时,“图像资产”才出现

    如何解决这个问题?

    1 回复  |  直到 4 年前
        1
  •  0
  •   dm_tr    4 年前

    也许你可以试试这个

    AppBar(
        title: 0 == _currentIndex ? Image.asset("/assets/....") : Text("..."),
        // ....
    ),
    

    在这种情况下 _title