我设计了一个屏幕,当从导航抽屉以及其他屏幕进行意图操作时会出现该屏幕。
现在我想在导航抽屉中隐藏意图时隐藏应用栏,所以请引导我,以下是我的代码
导航屏幕代码
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下面查看。
答案 0 :(得分:6)
创建这个类。
class SlidingAppBar extends PreferredSize {
SlidingAppBar({
@required this.child,
@required this.controller,
@required this.visible,
});
@override
final PreferredSizeWidget child;
@override
Size get preferredSize => child.preferredSize;
final AnimationController controller;
final bool visible;
@override
Widget build(BuildContext context) {
visible ? controller.reverse() : controller.forward();
return SlideTransition(
position: Tween<Offset>(begin: Offset.zero, end: Offset(0, -1)).animate(
CurvedAnimation(parent: controller, curve: Curves.fastOutSlowIn),
),
child: child,
);
}
}
用法:
class _MyPageState extends State<MyPage> with SingleTickerProviderStateMixin {
bool _visible = true;
AnimationController _controller;
@override
void initState() {
super.initState();
_controller = AnimationController(
vsync: this,
duration: Duration(milliseconds: 400),
);
}
@override
Widget build(BuildContext context) {
return Scaffold(
// extendBodyBehindAppBar: !_visible, // Uses entire screen after hiding AppBar
floatingActionButton: FloatingActionButton.extended(
label: Text(_visible ? 'Hide' : 'Show'),
onPressed: () => setState(() => _visible = !_visible),
),
appBar: SlidingAppBar(
controller: _controller,
visible: _visible,
child: AppBar(title: Text('AppBar')),
),
);
}
}
答案 1 :(得分:4)
您可以尝试这种方式
appBar: boolTrue ? AppBar(...) : null
答案 2 :(得分:2)
您可以像这样使用preferredSize小部件:
true ? Appbar() : PreferredSize(preferredSize: Size(0.0, 0.0),child: Container(),)
如果条件为假,这将隐藏应用栏。
答案 3 :(得分:1)
下面也可以隐藏 AppBar。 kToolbarHeight 定义为 here。
toolbarHeight: boolTrue ? kToolbarHeight : 0.0
答案 4 :(得分:0)
试试这个
bool myBool = false;
//...
appBar: isEditable == true
? AppBar( .. ):null
完整代码
appBar: isEditable == true
? AppBar(
title: Text("Teacher Profile"),
leading: IconButton(
icon: Icon(Icons.arrow_back_ios),
onPressed: () {
Util().navigateToBack(context);
},
),
centerTitle: true,
)
: null,