首页 > 解决方案 > 如何在容器中心添加圆形图像

问题描述

我正在创建个人资料页面,我想要这样的顶部

在此处输入图像描述

这是我的代码

Widget build(BuildContext context) {
    return Scaffold(
     appBar: new MyAppBar(title: Text("My Profile")
    
     ),
      drawer:drawer(),
      body:
      SingleChildScrollView(
      child:Stack(children: <Widget>[
        Container(
         
          width: MediaQuery.of(context).size.width,
          height: 150,
          color: Colors.blue[500],
          child:  Align(
            alignment:Alignment(-1.4,4.0),
          child:Container(
            
          //margin: EdgeInsets.all(20),
          width: 400,
          height: 125,
          decoration: BoxDecoration(
            shape: BoxShape.circle,
            image: DecorationImage(
              image: NetworkImage('https://patientcaremedical.com/wp-content/uploads/2018/04/male-catheters.jpg'),
              
            ),
          ),
        ))),
        

      ])));
  }
}

这是它的输出

在此处输入图像描述

它从底部开始是圆形的,你能帮我解决我做错的地方吗?

标签: imagefluttercontainersroundingprofile

解决方案


你的意思是你的圆圈底部看起来很平?这与您的代码无关。这是因为您使用的图像底部有白色。看看你自己。如果你改变backgroundColor:你的ScaffoldtoColors.red或白色以外的东西,你会明白我在说什么。您需要做的就是使用底部没有白色的不同图像,或者裁剪您当前的图像。


推荐阅读