Android 4.4.2 中的 Flutter、全屏模式无法正常工作
Flutter, Full screen mode in Android 4.4.2 does not work correctly
当我使用全屏模式时:
SystemChrome.setEnabledSystemUIMode(SystemUiMode.immersiveSticky);
这是我的代码:
return Scaffold(
body: Container(
height: height,
decoration: BoxDecoration(
color: Colors.black,
),
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.end,
children: [
IconButton(
onPressed: () {},
padding: const EdgeInsets.all(25),
iconSize: 80.sp,
icon: const Icon(
Icons.miscellaneous_services_outlined,
),
)
],
),
Row(
mainAxisAlignment: MainAxisAlignment.end,
children: [
Padding(
padding: const EdgeInsets.all(18.0),
child: Consumer(
builder: (context, watch, child) {
final state = watch(loginNotifierProvider);
return Text(
state.appVersion,
style: Theme.of(context).textTheme.headline6,
);
},
),
),
],
)
],
),
),
);
尽管看不到导航栏,但屏幕底部有一个白条:
但是当我将容器包装在列中时:
return Scaffold(
body: Column(
children: [
Container(
height: height,
decoration: BoxDecoration(
color: Colors.black,
),
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.end,
children: [
IconButton(
onPressed: () {},
padding: const EdgeInsets.all(25),
iconSize: 80.sp,
icon: const Icon(
Icons.miscellaneous_services_outlined,
),
)
],
),
Row(
mainAxisAlignment: MainAxisAlignment.end,
children: [
Padding(
padding: const EdgeInsets.all(18.0),
child: Consumer(
builder: (context, watch, child) {
final state = watch(loginNotifierProvider);
return Text(
state.appVersion,
style: Theme.of(context).textTheme.headline6,
);
},
),
),
],
)
],
),
),
],
),
);
容器占满全屏,但是会报错:
如何去掉这个条带?
如何让应用全屏显示?
这是android4.4api19.
换行 SingleChildScrollView
而不是 Column
return Scaffold(
body: SingleChildScrollView(
Container(
height: height,
decoration: BoxDecoration(
color: Colors.black,
),
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.end,
children: [
IconButton(
onPressed: () {},
padding: const EdgeInsets.all(25),
iconSize: 80.sp,
icon: const Icon(
Icons.miscellaneous_services_outlined,
),
)
],
),
Row(
mainAxisAlignment: MainAxisAlignment.end,
children: [
Padding(
padding: const EdgeInsets.all(18.0),
child: Consumer(
builder: (context, watch, child) {
final state = watch(loginNotifierProvider);
return Text(
state.appVersion,
style: Theme.of(context).textTheme.headline6,
);
},
),
),
],
)
],
),
),
),
);
我现在已经解决了这个问题如下:
SystemChrome.setEnabledSystemUIMode(
Platform.isAndroid && androidInfo.version.sdkInt == 19
? SystemUiMode.manual
: SystemUiMode.immersiveSticky,
overlays: [SystemUiOverlay.bottom]);
当android的api版本为19时,我显示下导航
当我使用全屏模式时:
SystemChrome.setEnabledSystemUIMode(SystemUiMode.immersiveSticky);
这是我的代码:
return Scaffold(
body: Container(
height: height,
decoration: BoxDecoration(
color: Colors.black,
),
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.end,
children: [
IconButton(
onPressed: () {},
padding: const EdgeInsets.all(25),
iconSize: 80.sp,
icon: const Icon(
Icons.miscellaneous_services_outlined,
),
)
],
),
Row(
mainAxisAlignment: MainAxisAlignment.end,
children: [
Padding(
padding: const EdgeInsets.all(18.0),
child: Consumer(
builder: (context, watch, child) {
final state = watch(loginNotifierProvider);
return Text(
state.appVersion,
style: Theme.of(context).textTheme.headline6,
);
},
),
),
],
)
],
),
),
);
尽管看不到导航栏,但屏幕底部有一个白条:
但是当我将容器包装在列中时:
return Scaffold(
body: Column(
children: [
Container(
height: height,
decoration: BoxDecoration(
color: Colors.black,
),
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.end,
children: [
IconButton(
onPressed: () {},
padding: const EdgeInsets.all(25),
iconSize: 80.sp,
icon: const Icon(
Icons.miscellaneous_services_outlined,
),
)
],
),
Row(
mainAxisAlignment: MainAxisAlignment.end,
children: [
Padding(
padding: const EdgeInsets.all(18.0),
child: Consumer(
builder: (context, watch, child) {
final state = watch(loginNotifierProvider);
return Text(
state.appVersion,
style: Theme.of(context).textTheme.headline6,
);
},
),
),
],
)
],
),
),
],
),
);
容器占满全屏,但是会报错:
如何去掉这个条带?
如何让应用全屏显示?
这是android4.4api19.
换行 SingleChildScrollView
而不是 Column
return Scaffold(
body: SingleChildScrollView(
Container(
height: height,
decoration: BoxDecoration(
color: Colors.black,
),
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.end,
children: [
IconButton(
onPressed: () {},
padding: const EdgeInsets.all(25),
iconSize: 80.sp,
icon: const Icon(
Icons.miscellaneous_services_outlined,
),
)
],
),
Row(
mainAxisAlignment: MainAxisAlignment.end,
children: [
Padding(
padding: const EdgeInsets.all(18.0),
child: Consumer(
builder: (context, watch, child) {
final state = watch(loginNotifierProvider);
return Text(
state.appVersion,
style: Theme.of(context).textTheme.headline6,
);
},
),
),
],
)
],
),
),
),
);
我现在已经解决了这个问题如下:
SystemChrome.setEnabledSystemUIMode(
Platform.isAndroid && androidInfo.version.sdkInt == 19
? SystemUiMode.manual
: SystemUiMode.immersiveSticky,
overlays: [SystemUiOverlay.bottom]);
当android的api版本为19时,我显示下导航