dart 如何在Flutter状态栏中添加文本

r1zhe5dt  于 2023-01-15  发布在  Flutter
关注(0)|答案(2)|浏览(156)

我想把一个文本和图标在状态栏中,来自API。它可以改变的基础上,例如位置。有什么解决办法吗?
这听起来很疯狂,但它真的可行吗?我是新来的,谢谢

nlejzf6q

nlejzf6q1#

我们有statusBar和appBar,我想你的意思是appBar,因为statusBar是由操作系统设计的,你不能添加一些小部件到它.如果你想自定义一个appBar,你可以创建一个,使你的应用程序你想要的.这里是自定义应用程序栏,我在我的代码中使用:

class CustomAppBar extends StatelessWidget {
  final String? title;
  final bool? hasBackButton;
  final Color? color;
  final Widget? actionWidget;
  final double? height;

  const CustomAppBar(
      {Key? key,
        this.title,
        this.hasBackButton = true,
        this.color = primaryDark, this.actionWidget, this.height})
      : super(key: key);

  @override
  Widget build(BuildContext context) {
    var width = MediaQuery.of(context).size.width;
    return Consumer<SettingProvider>(
        builder: (context, settingProvider, child) {
          return Stack(
            alignment: AlignmentDirectional.centerStart,
            children: [
              SizedBox(
                width: width,
                height: height ?? width * 0.1333,
                child: Center(
                  child: Padding(
                    padding: EdgeInsets.symmetric(horizontal: width * 0.1333),
                    child: TextView(
                      text: title ?? '',
                      color: color ?? primaryDark,
                      size: 16,
                      textAlign: TextAlign.center,
                      overflow: TextOverflow.ellipsis,
                    ),
                  ),
                ),
              ),
              if (hasBackButton!)
                InkWell(
                  onTap: () => locator<NavigationService>().goBack(),
                  splashColor: transparent,
                  highlightColor: transparent,
                  child: Padding(
                    padding: EdgeInsets.all(width * 0.02),
                    child: RotatedBox(
                      quarterTurns: settingProvider.isRTL ? 2 : 0,
                      child: ArrowBackIcon(
                        color: color!,
                      ),
                    ),
                  ),
                ),
              if(actionWidget != null)
                Align(
                    alignment: Alignment.centerLeft,
                    child: actionWidget!)
            ],
          );
        });
  }
}

注:我有TextView(一个小部件,我将其模块化为文本)和ArrowBackIcon(一个小部件,我将其模块化为图标),
如果你的意思是你想再次改变状态,我的想法是:你可以像video这样隐藏你的状态栏,你也可以创建你自己的状态栏,但是要注意的是,它在大多数手机中都不会很好。)

idv4meu8

idv4meu82#

如果状态栏是指应用程序栏,则可以在应用程序栏中添加文本和图标,如下所示

appBar: AppBar(
    title: const Text("Geolocator"),
    leading: Icon(Icons.search),
  ),

相关问题