Flutter-如何动态显示或隐藏页面上的应用栏 [英] Flutter - How can I dynamically show or hide App Bars on pages

问题描述

我设计了一个屏幕，当从导航抽屉以及其他屏幕进行意图操作时会出现该屏幕.

I have design one screen which is appear when intent from navigation drawer as well as from other screen.

现在我想在导航抽屉中隐藏意图时隐藏应用栏，所以请引导我，以下是我的代码

Now i want to hide app bar when intent from navigation drawer, so please guide me, below is my code

导航屏幕代码

Navigation Screen code

import 'dart:convert';

import 'package:flutter/material.dart';
import 'package:pwc/src/home/HomeScreen.dart';
import 'package:pwc/src/model/UserModel.dart';
import 'package:pwc/src/property/BuyerPropertyListScreen.dart';
import 'package:pwc/src/property/RentPropertyListScreen.dart';
import 'package:pwc/src/property/MyPropertyListScreen.dart';
import 'package:pwc/src/property/PostPropertyScreen.dart';
import 'package:pwc/src/home/FeedbackScreen.dart';
import 'package:pwc/src/utility/ColorsConstant.dart' as ColorConstant;
import 'package:pwc/src/utility/DrawableConstant.dart' as DrawableConstant;
import 'package:pwc/src/utility/StringConstant.dart' as StringConstant;
import 'package:shared_preferences/shared_preferences.dart';
import 'package:pwc/src/utility/globals.dart' as globals;
import 'package:pwc/src/utility/KeyConstant.dart' as KeyConstant;
import 'package:pwc/src/property/PropertyListScreen.dart';

class DrawerItem {
  String title;
  ImageIcon icon;

  DrawerItem(this.title, this.icon);
}

class NavigationDrawerScreen extends StatefulWidget {
  static String tag = 'navigation-page';

  @override
  _NavigationDrawerState createState() => new _NavigationDrawerState();
}

class _NavigationDrawerState extends State<NavigationDrawerScreen> {
  int selectedDrawerItem = 0;
  var appBarTitleText = StringConstant.home;

  var homeIcon = new ImageIcon(
    new AssetImage(DrawableConstant.ic_home),
    size: 30.0,
  );

  var buyPropertyIcon = new ImageIcon(
    new AssetImage(DrawableConstant.ic_buy_property),
    size: 30.0,
  );

  var rentPropertyIcon = new ImageIcon(
    new AssetImage(DrawableConstant.ic_rent_property),
    size: 30.0,
  );

  var postPropertyIcon = new ImageIcon(
    new AssetImage(DrawableConstant.ic_post_property),
    size: 30.0,
  );

  var myPropertiesIcon = new ImageIcon(
    new AssetImage(DrawableConstant.ic_my_properties),
    size: 30.0,
  );

  var feedbackIcon = new ImageIcon(
    new AssetImage(DrawableConstant.ic_feedback),
    size: 30.0,
  );

  var ratingIcon = new ImageIcon(
    new AssetImage(DrawableConstant.ic_rating),
    size: 30.0,
  );


  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    var nav_header_exact_bg =
        new ExactAssetImage(DrawableConstant.nav_header_bg);

    return new Scaffold(
      appBar: AppBar(
        backgroundColor: ColorConstant.theme_color,
        title: new Text(appBarTitleText),
        centerTitle: true,
      ),
      drawer: Drawer(
        child: new ListView(
          children: <Widget>[
            new UserAccountsDrawerHeader(
              accountName: new Text(userModel.name),
              accountEmail: new Text(userModel.email),
              decoration: new BoxDecoration(
                image: new DecorationImage(
                  image: nav_header_exact_bg,
                  fit: BoxFit.cover,
                ),
              ),
            ),
            new ListTile(
                leading: homeIcon,
                title: new Text(StringConstant.home),
                onTap: () {
                  setAPPBarTitleText(StringConstant.home);
                  Navigator.pop(context);
                  setState(() {
                    selectedDrawerItem = 0;
                  });
                }),
            new Divider(
              height: 1,
            ),
            new ListTile(
                leading: buyPropertyIcon,
                title: new Text(StringConstant.properties_for_buy),
                onTap: () {
                  setAPPBarTitleText(StringConstant.properties_for_buy);
                  Navigator.pop(context);
                  setState(() {
                    selectedDrawerItem = 1;
                  });
                }),
            new Divider(
              height: 1,
            ),
          ],
        ),
      ),
      body: getDrawerScreenBody(selectedDrawerItem),
    );
  }

  getDrawerScreenBody(int pos) {
    switch (pos) {
      case 0:
        return new HomeScreen();
      case 1:
        return new BuyerPropertyListScreen();
    }
  }

  void setAPPBarTitleText(String title) {
    setState(() {
      appBarTitleText = title;
    });
  }

}

当我打开 BuyerPropertyListScreen 时，然后还会显示内部应用程序栏，我想动态隐藏它，请在screnshot下面查看.

when i open BuyerPropertyListScreen, then inner appbar is also showing, i want to dynamically hide it, please look below screnshot.

推荐答案

您可以尝试这种方式

appBar: boolTrue ? AppBar(...) : null

这篇关于Flutter-如何动态显示或隐藏页面上的应用栏的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！