Изменить только цвет строки состояния во Flutter

У меня такой макет, и я хочу изменить цвет только строки состояния, так как я не использовал панель приложений.

Макет

Вот код, который я использовал для этого:

class Home extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SafeArea(
        child: Column(children: [
          Container(
              color: Colors.green,
              padding: EdgeInsets.all(15),
              child: TextFormField(
                cursorColor: Colors.green,
                decoration: InputDecoration(
                  contentPadding:
                      EdgeInsets.symmetric(vertical: 0.0, horizontal: 10.0),
                  hintText: 'Search a product',
                  fillColor: Colors.white,
                  filled: true,
                  prefixIcon: Visibility(
                    visible: true,
                    child: Icon(
                      Icons.search,
                      color: Colors.grey.shade900,
                    ),
                  ),
                  enabledBorder: OutlineInputBorder(
                      borderRadius: BorderRadius.circular(6),
                      borderSide: BorderSide(
                          color: Colors.grey.shade200, width: 1.5
                    )
                  ),
                )
              ),
            ),

            //AND OTHER ELEMENTS

        ],),
      ),
    );
  }
}

Я хочу изменить цвет строки состояния на более темный оттенок зеленого


flutter flutter-layout flutter-appbar
person Saya    schedule 09.05.2021    source источник

Ответы (3)


arrow_upward
0
arrow_downward

В нашем main.dart мы можем использовать класс SystemChrome:

SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
  statusBarColor: Colors.green
));
person Stefano Amorelli    schedule 09.05.2021
comment
На самом деле я добавил это внутри build в Home Widget, и это сработало. Спасибо - person Saya; 09.05.2021

arrow_upward
0
arrow_downward

Попробуй это:

AppBar(
  backwardsCompatibility: false,
  systemOverlayStyle: SystemUiOverlayStyle(statusBarColor: Colors.orange),
)
person Totally Not Hardik    schedule 09.05.2021
comment
Это создает панель приложений вверху, которую я не хочу - person Saya; 09.05.2021

arrow_upward
0
arrow_downward

Вы можете указать его в теме панели MaterialApp непосредственно внутри вашей панели приложений.

Глобальная тема в приложении Material

MaterialApp(
        
          theme: ThemeData(
            appBarTheme: AppBarTheme(
              brightness: Brightness.dark,

              backwardsCompatibility: false,
              systemOverlayStyle:
                  SystemUiOverlayStyle(statusBarColor: Colors.orange),
)

statusBarColor — это цвет верхней панели, который вы хотите изменить. Важно установить backwardsCompatibility: false, потому что это не сработает.

person Dhananjay Gavali    schedule 09.05.2021
comment
Я просто хочу изменить цвет строки состояния. Я не хочу добавлять дополнительную панель приложений. Ваш код добавляет панель приложений под строку состояния. Спасибо - person Saya; 09.05.2021
comment
добавьте только тему панели приложений в материал, после чего вы сможете изменить цвет строки состояния, не добавляя панель приложений. - person Dhananjay Gavali; 10.05.2021