Блог

Я разрабатываю приложение, в котором есть несколько экранов, на которых будет строка состояния со специальным стилем. Однако на заставке, которая является первым экраном приложения. Я проектирую его так, чтобы в нем не было строки состояния. Но это также применимо ко всем другим экранам, даже если у них есть строки состояния с уникальным дизайном стилей, в частности, экран с цифрами, который я предоставляю в примере кода ниже.

я имею в виду строку состояния

заставка. Я использую приведенный ниже код, чтобы скрыть строку состояния systemChrome.setEnabledSystemUIOverlays([SystemUiOverlay.bottom]);

// ignore_for_file: предпочтительные_конструкторы

 import 'dart:async';

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:online_croceries/constants/assets.dart';
import 'package:online_croceries/data/sharedpref/constants/preferences.dart';
import 'package:online_croceries/utils/routes/routes.dart';
import 'package:shared_preferences/shared_preferences.dart';

class SplashScreen extends StatefulWidget {
SplashScreen({Key? key}) : super(key: key);

@override
_SplashScreenState createState() => _SplashScreenState();
}

class _SplashScreenState extends State<SplashScreen> {

@override
Widget build(BuildContext context) {
return Scaffold(
  body: Container(
    decoration: BoxDecoration(
      color: Color.fromRGBO(83, 177, 117, 1),
    ),
    child: Center(
      child: Container(
        width: 350,
        decoration: BoxDecoration(
          image: DecorationImage(
            image: AssetImage(Assets.iconLogo),
          ),
        ),
      ),
    ),
  ),
);
}

@override
void initState() {
SystemChrome.setEnabledSystemUIOverlays([SystemUiOverlay.bottom]);
super.initState();
starTimer();
}

starTimer() {
var _duration = Duration(milliseconds: 2000);
return Timer(_duration, navigate);
}

navigate() async {
SharedPreferences preferences = await SharedPreferences.getInstance();

if (preferences.getBool(Preferences.is_logged_in) ?? false) {
  Navigator.of(context).pushReplacementNamed(Routes.welcome);
} else {
  Navigator.of(context).pushReplacementNamed(Routes.welcome);
}
}
}
 

главный экран, я использую его для корневого маршрутизатора

 child: Observer(
    builder: (context) {
      return 
        
        MaterialApp(
          title: 'Flutter Demo',
          home: SplashScreen(),
          routes: Routes.routes,
          locale: Locale(_languageStore.locale),
          supportedLocales: _languageStore.supportedLanguages.map((e) => 
          Locale(e.locale!, e.code)).toList(),
          localizationsDelegates: [AppLocalizations.delegate]
          // home: APIUsing(),
          );
    },
    name: "global-observer",
  ),
 

Экран с цифрами для входа. TransparentAppBar-это пользовательский виджет, который я использую для создания строки состояния со специальным стилем

 Widget build(BuildContext context) {
int backDropBlur = 30;
return Scaffold(
    appBar: TransparentAppBar(
      transTitle: "",
      leadingIcon: IconButton(
        onPressed: () {
          Navigator.of(context).pop();
        },
        icon: Icon(
          Icons.chevron_left,
        ),
      ),
    ),
 

в моем проекте я использую следующее (использование яркости устарело) Без панели приложений:

 return AnnotatedRegion<SystemUiOverlayStyle>(
            //Set status bar icon color
            value: your_condition
                ? SystemUiOverlayStyle.dark.copyWith(
                    statusBarColor: your_color,
                    //statusBarIconBrightness: Brightness.light,
                  )
                : SystemUiOverlayStyle.light.copyWith(
                    statusBarColor: your_color,
                    //statusBarIconBrightness: Brightness.light,
                  ),
            child: your_widget);
 

С помощью панели приложений:

 return AppBar(
    elevation: 0.0,
    systemOverlayStyle: your_condition ? SystemUiOverlayStyle.dark : SystemUiOverlayStyle.light,
    backgroundColor: your_color,
);
 

Вы можете использовать комбинацию двух вышеперечисленных методов для достижения своей цели

systemChrome.setEnabledSystemUIOverlays([SystemUiOverlay.bottom]);

Приведенная выше строка кода находится внутри функции initState SplashScreen, вы можете легко увидеть ее в коде, который я предоставил выше. Это помогает нам отключить строку состояния, и на это стоит обратить внимание. Как только вы отключите панель состояния, она больше не появится, независимо от того, используете вы ее на другом экране или нет.

Таким образом, для того, чтобы на следующих экранах отображалась строка состояния, следующий экран сразу после заставки должен снова включить строку состояния. В моем проекте следующий экран-заставка-это экран приветствия. Я включаю его с помощью простой строки кода ниже, место, где я пишу код ниже, совпадает со строкой, где я выключаю его на экране.

systemChrome.setEnabledSystemUIOverlays(SystemUiOverlay.значения)

Или, если вы хотите более аккуратный способ, пусть строка кода, отображающая строку состояния, вернется прямо на экране заставки, но вместо initState() она будет в функции dispose() ,