如何设置底部导航栏颜色像手机x一样透明?

时间:2020-01-08 12:28:04

标签: flutter transparent bottombar

现在我正在运行最新的稳定版1.12.13 + hotfix.5

当我在android flutter中打电话时,我需要完整的全屏显示

enter image description here

enter image description here

有可能扑扑吗? 我们可以显示很多应用程序,例如android设置应用程序,联系人等.....

enter image description here

3 个答案:

答案 0 :(得分:0)

BottomNavigationBar中有一个名为“ backgroundColor”的属性,您可以使用Colors.transparent使它像图片一样。但是,还有另外两个技巧:

  • 您必须将BottomNavigationBar类型更改为BottomNavigationBar.fixed;
  • 您必须更改高程,因为它会是一个大的“阴影”,颜色应在其中放置。​​

代码示例:

bottomNavigationBar: BottomNavigationBar(
          type: BottomNavigationBarType.fixed,
          backgroundColor: Colors.transparent,
          elevation: 0,  

如果您想对图标产生移动效果,请为每个图标声明一种颜色。

答案 1 :(得分:0)

我已经尝试过了,但是应用栏是透明的,但是问题是,一旦放置在支架中,这些小部件仍然保持其高度。我假设BotttomNavigationBar的情况相同,因此在这种情况下,您可以将其添加到Stack中(这就是我的做法),因此它确实出现在内容的顶部,并且确实反映了其透明度,如下:

RestTemplate template = new RestTemplate();
MappingJackson2HttpMessageConverter mappingJackson2HttpMessageConverter = new MappingJackson2HttpMessageConverter();


public String login() {

mappingJackson2HttpMessageConverter.setSupportedMediaTypes(Arrays.asList(MediaType.APPLICATION_JSON, MediaType.APPLICATION_OCTET_STREAM));
       template.getMessageConverters().add(mappingJackson2HttpMessageConverter);

       Map<String, Object> payload = new HashMap<>();
       payload.put("loginName", "xyz");
          payload.put("password", "abc");
Map<String, Object> resp = template.postForObject(getUrl("/abc"), payload, Map.class);
          return (String) resp.get("token");
    }

您会注意到,底部导航栏将显示红色(因为它是透明的,并且将显示父级的颜色(容器的颜色为红色)。

答案 2 :(得分:0)

您可以通过将此代码片段添加到您的构建方法中来做到这一点

SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
      systemNavigationBarColor: Colors.transparent);