dart 如何在Flutter中隐藏Android的底部导航栏

63lcw9qa  于 2023-09-28  发布在  Flutter
关注(0)|答案(9)|浏览(188)

我在flutter和Android开发方面都是新手,但是有没有可能通过编程隐藏底部导航栏(请参阅下面的项目)?

5vf7fwbs

5vf7fwbs1#

试试这个:SystemChrome.setEnabledSystemUIOverlays([SystemUiOverlay.top]);
Document

vwoqyblh

vwoqyblh2#

  • 在写这个答案的时候,这里所有其他的帖子都已经过时了,使用setEnabledSystemUIOverlays将给予一个弃用消息。
    隐藏系统导航栏或状态栏导入:
import 'package:flutter/services.dart';

并使用服务SystemChrome.setEnabledSystemUIMode

SystemChrome.setEnabledSystemUIMode(SystemUiMode.immersiveSticky);

函数setEnabledSystemUIMode接收SystemUiMode枚举,它具有以下选项:

*leanBack-全屏显示,状态和导航栏可通过点击显示屏上的任意位置显示。
*身临其境-全屏显示,状态和导航栏可通过显示器边缘的滑动手势呈现。
*身临其境-全屏显示,状态和导航栏可通过在显示屏边缘的滑动手势 * 临时**呈现。
*edgeToEdge-全屏显示,在应用程序上呈现状态和导航元素。
*manual-声明手动配置的[SystemUiOverlay] % s。(查看文档以获取更多信息)

nqwrtyyt

nqwrtyyt3#

指定在应用程序运行时可见的系统覆盖集。你可以使用下面的静态方法:

SystemChrome.setEnabledSystemUIOverlays(List<SystemUiOverlay> overlays)

示例如下:
1 -用于隐藏底部导航栏和状态栏仍然可见

SystemChrome.setEnabledSystemUIOverlays([SystemUiOverlay.top]);

2 -适用于仍显示底部导航栏和隐藏状态栏

SystemChrome.setEnabledSystemUIOverlays([SystemUiOverlay.bottom]);

3 -对于隐藏底部导航栏和状态栏

SystemChrome.setEnabledSystemUIOverlays([]);

4 -对于makeboth visible

SystemChrome.setEnabledSystemUIOverlays([SystemUiOverlay.top, SystemUiOverlay.bottom]);
k2arahey

k2arahey4#

使用SystemChrome.setEnabledSystemUIOverlays([])隐藏状态栏和导航栏。

1hdlvixo

1hdlvixo5#

我想你可以用这个

SystemChrome.setEnabledSystemUIMode(SystemUiMode.manual, overlays: [SystemUiOverlay.top]);

在您的initState()

x6yk4ghg

x6yk4ghg6#

目前这个功能在Flutter中被窃听,你可以在这里看到这个问题。
https://github.com/flutter/flutter/issues/62412
通常,您需要执行以下操作:

SystemChrome.setEnabledSystemUIOverlays([SystemUiOverlay.top]);
gcmastyq

gcmastyq7#

@Coder的答案会隐藏按钮一次,但如果用户再次召唤它们(通过向上滑动),按钮仍然可见。

如何在用户召唤 app start 和 * 按钮后隐藏它们:*

根据我的测试,每当按钮被召唤时,Flutter都会从根部件重绘所有内容。它可用于运行一个计时器,该计时器在每次重绘根小部件时隐藏按钮。

import 'dart:async';

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';

void main() {
  WidgetsFlutterBinding.ensureInitialized();

  // hide android buttons when the app starts
  SystemChrome.setEnabledSystemUIMode(SystemUiMode.immersive);
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  static const immersiveModeDelaySeconds = 4;

  @override
  Widget build(BuildContext context) {
    // every time the root widget is rebuilt, hide the buttons after n seconds.
    Timer(Duration(seconds: immersiveModeDelaySeconds), () {
      SystemChrome.setEnabledSystemUIMode(SystemUiMode.immersive);
    });

    // run the rest of the app
    return MaterialApp(home: Container());
  }
}
ahy6op9u

ahy6op9u8#

你可以按照这个方法隐藏系统导航栏
1.在你的主.dart文件中导入services.dart包

import 'package:flutter/services.dart';

1.在void main(){}中添加以下内容

void main(){

  WidgetsFlutterBinding.ensureInitialized();

  SystemChrome.setEnabledSystemUIMode(SystemUiMode.manual, overlays: 
  [SystemUiOverlay.top]);

  runApp(const <Your App Name>());

}
rfbsl7qr

rfbsl7qr9#

此方法已贬值SystemChrome.setEnabledSystemUIOverlays([SystemUiOverlay.top]);
仅显示状态栏

SystemChrome.setEnabledSystemUIMode(SystemUiMode.immersiveSticky,overlays: [SystemUiOverlay.top]);

仅显示系统导航栏

SystemChrome.setEnabledSystemUIMode(SystemUiMode.immersiveSticky,overlays: [SystemUiOverlay.bottom]);

为了掩饰

SystemChrome.setEnabledSystemUIMode(SystemUiMode.immersiveSticky,
    overlays: []);

最好像这样放在runApp方法之前

void main() {
  WidgetsFlutterBinding.ensureInitialized();
  SystemChrome.setEnabledSystemUIMode(SystemUiMode.immersiveSticky, overlays:[]).then(
        (_) => runApp(MyApp()),
  );
}

相关问题