搜索插件、代码仓与 APP 分类

插件详情v2.0.0

flutter_statusbar_manager

Flutter 状态栏管理器,可让您在 iOS 和 Android 上控制状态栏的颜色、样式(主题)、可见性以及透明度属性。

近 30 天下载
100
喜欢数
123
Pub 分数
40

安装插件

flutter pub add flutter_statusbar_manager

插件介绍

基于插件公开信息、社区数据与项目使用情况整理的选型参考。

Flutter Statusbar Manager 是一个跨平台包,可在 iOS 和 Android 设备上自定义状态栏。它允许控制状态栏的颜色、外观(浅色或深色主题)、可见性以及透明度。通过简单的 API,确保跨平台的一致 UI 行为,非常适合需要沉浸式或品牌化状态栏设计的应用程序。该包可通过 pub.dev 轻松集成到 Flutter 项目中,并得到活跃的社区支持。

适合场景

  • 自定义状态栏颜色以进行品牌化
  • 创建沉浸式的全屏体验
  • 根据主题调整状态栏样式
  • 管理全屏模式下的状态栏可见性
  • 确保 iOS 和 Android 上的用户界面一致
  • 启用半透明状态栏以实现现代设计

主要特点

  • 跨平台兼容性(iOS 和 Android)
  • 状态栏颜色控制
  • 切换状态栏可见性
  • 支持浅色/深色状态栏主题
  • 半透明状态栏配置
  • 简单、直观的 API

适合对象

  • 寻求状态栏自定义的App开发者
  • 设计实现沉浸式用户界面的设计师
  • 需要平台特定状态栏调整的项目
  • 具有动态主题需求的应用程序
  • 同时针对 iOS 和 Android 开发的开发者

使用建议

  • 某些设备需要平台特定的权限
  • 仅限状态栏属性
  • 可能与其他状态栏插件冲突
  • 不适用于复杂的导航叠加层
  • 最好在仔细考虑用户体验的情况下使用

原始 README

以下为关联源码仓库的 README 原文快照,最新内容请访问源码仓库。

flutter_statusbar_manager

Now compatible with AndroidX thanks to https://github.com/lorenzOliveto

Flutter Statusbar Manager, lets you control the status bar color, style (theme), visibility, and translucent properties across iOS and Android. With some added bonus for Android to control the Navigation Bar.

This plugin is based on React Native's StatusBar component.

The Navigation Bar code was taken from the awesome flutter-screen-theme-plugin.

Demo App Android Status Bar

Demo App Android Status Bar hide

Demo App Android Nav Bar

Demo App Iphone 8

Demo App Iphone X

Installation

flutter_statusbar_manager : ^lastest_version

to your pubspec.yaml ,and run

flutter packages get

in your project's root directory.

Basic Usage

Create a new project with command

flutter create myapp

On iOS add the following in your Info.plist:

<key>UIViewControllerBasedStatusBarAppearance</key>
<false/>

Import the plugin in lib/main.dart like this:

import 'package:flutter_statusbar_manager/flutter_statusbar_manager.dart';

Methods

setColor
Platforms: Android

The setColor method will set the status bar background color. On iOS the method will always return a successful Future.

Parameter Type Default Required Description
color Color none Yes The color to be set as background, can use colors with opacity.
animated bool false No Whether or not to animate the color change.
await FlutterStatusbarManager.setColor(Colors.green, animated:true);
setTranslucent
Platforms: Android

The setTranslucent method will set the status bar translucent status. On iOS the methods will always return a successful Future.

Parameter Type Default Required Description
translucent bool none Yes Whether or not the status bar will be translucent.
await FlutterStatusbarManager.setTranslucent(true);
setHidden
Platforms: Android, iOS

The setHidden will hide the status bar.

Parameter Type Default Required Description
hidden bool none Yes Whether or not to hide the status bar.
animation StatusBarAnimation StatusBarAnimation.NONE No The hiding animation to use (iOS only).
await FlutterStatusbarManager.setHidden(true, animation:StatusBarAnimation.SLIDE);
setStyle
Platforms: Android, iOS

The setStyle method will set the status bar theme.

Parameter Type Default Required Description
style StatusBarStyle none Yes The status bar theme to use for styling, can either be light, dark, default.
await FlutterStatusbarManager.setStyle(StatusBarStyle.DARK_CONTENT);
setNetworkActivityIndicatorVisible
Platforms: iOS

The setNetworkActivityIndicatorVisible method will show or hide the activity indicator, On Android the method will always return a successful Future.

Parameter Type Default Required Description
visible bool none Yes Whether or not to show the activity indicator.
await FlutterStatusbarManager.setNetworkActivityIndicatorVisible(true);
getHeight
Platforms: Android, iOS

The getHeight getter method will return the height of the status bar.

double height = await FlutterStatusbarManager.getHeight

Bonus Methods

setNavigationBarColor
Platforms: Android

The setNavigationBarColor method will set the navigation bar background color. On iOS the method will always return a successful Future.

Parameter Type Default Required Description
color Color none Yes The color to be set as background.
animated bool false No Whether or not to animate the color change.
await FlutterStatusbarManager.setNavigationBarColor(Colors.green, animated:true);
setNavigationBarStyle
Platforms: Android

The setNavigationBarStyle method will set the navigation bar theme.

Parameter Type Default Required Description
style NavigationBarStyle none Yes The navigation bar theme to use for styling, can either be light, dark, default.
await FlutterStatusbarManager.setNavigationBarStyle(NavigationBarStyle.DARK);
setFullscreen
Platforms: Android, iOS

The setFullscreen method will set the app in fullscreen mode.

Parameter Type Default Required Description
fullscreen bool none Yes Whether or not to set the app on fullscreen mode.
await FlutterStatusbarManager.setNavigationBarStyle(NavigationBarStyle.DARK);

Enums

StatusBarStyle
  • StatusBarStyle.DEFAULT
  • StatusBarStyle.LIGHT_CONTENT
  • StatusBarStyle.DARK_CONTENT
StatusBarAnimation
  • StatusBarAnimation.NONE
  • StatusBarAnimation.FADE
  • StatusBarAnimation.SLIDE
NavigationBarStyle
  • NavigationBarStyle.DEFAULT
  • NavigationBarStyle.DARK
  • NavigationBarStyle.LIGHT

Status bar

Compatibility: Android (6.0+) & iOS

On Android, it will only work with Android 6.0 (Marshmallow) and above devices.

Navigation bar

Compatibility: Android only

Android 5.0 (Lollipop) and above: color

Android 8.0 (Oreo) and above: style (dark/light)

所属分类

源码仓库

使用此插件的项目

暂无相关数据。