0

如何将名称放置在靠近“欢迎回来”文本的位置?我尝试使用 centerTitle: true 和 textAlign: TextAlign.center 来做到这一点,但到目前为止还没有运气?我错过了什么?

 return new Scaffold(
      appBar: new AppBar(
          brightness: Brightness.light,
          backgroundColor: Colors.white,
          elevation: 0,
          centerTitle: true,
          title: Text(
            "Welcome Back,",
            textAlign: TextAlign.center,
            style: TextStyle(
                color: Color.fromRGBO(49, 39, 79, 1),
                fontWeight: FontWeight.bold,
                fontSize: 20),
          ),
          actions: <Widget>[
            Row(
              children: <Widget>[
                Container(
                    child: Text(name,
                        textAlign: TextAlign.center,
                        style: TextStyle(
                            color: Color.fromRGBO(49, 39, 79, 1),
                            fontWeight: FontWeight.bold,
                            fontSize: 20))),

在此处输入图像描述

4

1 回答 1

1

只需自left:定义Padding()

actions: <Widget>[
  Row(
    children: <Widget>[
    Container(
      child: Text(name, style: TextStyle(color: Color.fromRGBO(49, 39, 79, 1), fontWeight: FontWeight.bold,fontSize: 20))
    ),
    /// Play with the parameter `left: ...`
    Padding(padding: const EdgeInsets.only(left: 30, right: 8.0, top: 8.0, bottom: 8.0),
      child: CircleAvatar(
               backgroundImage: NetworkImage(imageUrl)),
      ),
    ],
  ),
]

另一种解决方案:使用nameAppBar-Title中的变量:

title: Text("Welcome Back, $name", style: TextStyle(color: Color.fromRGBO(49, 39, 79, 1), fontWeight: FontWeight.bold,fontSize: 20),),
actions: <Widget>[
  Row(
    children: <Widget>[
    /// Play with the parameter `left: ...`
    Padding(padding: const EdgeInsets.only(left: 30, right: 8.0, top: 8.0, bottom: 8.0),
      child: CircleAvatar(
               backgroundImage: NetworkImage(imageUrl)),
      ),
    ],
  ),
]

结果:

在此处输入图像描述

于 2020-02-14T16:35:19.207 回答