小编EMR*_*ADE的帖子

大家好,我需要帮助使我的个人资料页面看起来像上面的图像.不是整个页面,我想要的是背景图像和轮廓图像的定位方式.

下面是我到目前为止的代码

class AccountPageState extends State<AccountPage> {    
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        height: 170.0,
        width: double.infinity,
        decoration: BoxDecoration(
            image: DecorationImage(
                image: AssetImage("assets/images/erev/background.png"),
                fit: BoxFit.cover,
            ),
            boxShadow: [new BoxShadow(color: Colors.black, blurRadius: 8.0)],
            color: Colors.green),
        child: Column(
          children: <Widget>[
            Padding(
              padding: const EdgeInsets.only(
                  top: 60.0, bottom: 18.0, right: 18.0, left: 18.0),
              child: Row(
                children: <Widget>[
                  Container(
                    height: 60.0,
                    width: 60.0,
                    decoration: BoxDecoration(
                        shape: BoxShape.circle,
                        image: DecorationImage(
                          image: new AssetImage("assets/images/erev/admin.jpeg"),
                           fit: BoxFit.cover
                      )
                    ),
                  ),
                ],
              ),
            ),
          ], …

我正在尝试创建一个具有渐变下划线的 TabBar，如下图所示。

我尝试按照之前的帖子的建议使用 BoxDecoration，但它并没有完全按照我的意愿显示。

TabBar(
        labelColor: Theme.of(context).primaryColor,
        indicator: BoxDecoration(
          gradient: LinearGradient(
  colors: const [Color(0xFF10C7E0), Color(0xFF00D5C3)],
),
        ),
        tabs: ...,
      ),

当我尝试这样做时，我得到的是

有人指出，这篇文章是10 个月前发布的how-to-give-a-gradient-line-in-tab-bar-indicator的重复。但是那里说明的方法不再有效。是的，我试过了。