🐦 Flutter

[Flutter] Statusbar color 화면마다 다르게 적용

ji-hyun 2022. 9. 26. 14:43

와이파이, 시간, 배터리가 표시되어 있는 상태바 Color 를 변경하는 방법

 

1. 안드로이드 

appBar 안에 다음 코드를 넣는다

 

systemOverlayStyle: const SystemUiOverlayStyle(
          statusBarColor: Colors.white,
          statusBarIconBrightness: Brightness.dark,
        ),

 

배경 흰색, 아이콘들은 검정색

 

 

 

2. iOS

appBar 안에 다음 코드를 추가한다

 

systemOverlayStyle: const SystemUiOverlayStyle(
          statusBarColor: Colors.white,
          statusBarIconBrightness: Brightness.dark,
          statusBarBrightness: Brightness.light, // ios
        ),

 

마지막 줄을 추가하면 되는데 배경은 하얀색, 아이콘은 검정으로 적용시킨다는 뜻이다.

 

 

 

 

단점은 일일히 화면마다 적용해줘야 한다는 점인데, 나의 경우는 상태바가 파란색일 때도 있고 하얀색일 때도 있어서 다른 방법보다 유용하게 사용했다.