flutter - 如何将多个文本值添加到 appbar Flutter

Question

我是 Flutter 的新手，想创建一个具有 2 个不同文本值的应用栏，请参见下文：

到目前为止，我已经编写了以下代码：

    class HomePage extends StatelessWidget {
  final double toolbarOpacity = 2.0;
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar:
      PreferredSize(
        preferredSize: Size(double.infinity, 114),
        child: AppBar(
          centerTitle: false,
          title: Text(
            'My App',
            style: TextStyle(
                color: titleTextColor,
                fontWeight: titleTextFontWeight,
                fontFamily: titleFontFamily,
                fontSize: titleFontSize),
          ),
           backgroundColor: Color.fromRGBO(232, 232, 242, 1),
        ),
      ),
    );
  }
}

这给了我以下结果：

有人可以指导我材料或帮助我实现我想要的输出吗？

提前致谢。

标签： flutterappbarflutter-appbar

Answer 1

由于标题接受小部件，您可以像这样在其中使用列小部件

AppBar(
          centerTitle: false,
          title: Column(
            children: <Widget>[
                Text(
                'My App',
                style: TextStyle(
                    color: titleTextColor,
                    fontWeight: titleTextFontWeight,
                    fontFamily: titleFontFamily,
                    fontSize: titleFontSize),
              ),
              Text("My second text"),
            ]
           )
           backgroundColor: Color.fromRGBO(232, 232, 242, 1),
        ),

你可以使用 PreferredSize 来定义大小

appBar:
      PreferredSize(
        preferredSize: Size(double.infinity, 114),
        child: AppBar(
          centerTitle: false,
          title: Column(
            children: <Widget>[
                Text(
                'My App',
                style: TextStyle(
                    color: titleTextColor,
                    fontWeight: titleTextFontWeight,
                    fontFamily: titleFontFamily,
                    fontSize: titleFontSize),
              ),
              Text("My second text"),
            ]
           )
           backgroundColor: Color.fromRGBO(232, 232, 242, 1),
        ),
      ),