Flutter中的圆角和圆形效果

第一种：以图片为容器背景，设置容器四角的圆角角度

Container(
	margin: EdgeInsets.only(right: 10.0),
    width: 60.0,
    height: 60.0,
    decoration: BoxDecoration(
    	shape: BoxShape.rectangle, //可以设置角度，BoxShape.circle直接圆形
        borderRadius: BorderRadius.circular(5.0),
        image: DecorationImage(
        	fit: BoxFit.fill,
            image: AssetImage(
            	"image/a001.jpg",
            ),
   		 )
    ),
),

第二种 ClipRRect 裁剪矩形四角 可自定义圆角度数

Container(
  alignment: Alignment.center,
  child: ClipRRect(
    borderRadius:BorderRadius.circular(6.0),
    child: Image.asset(
      "image/a001.jpg",
    ),
  ),
);

第三种 ClipOval 直接就是圆形

Container(
  alignment: Alignment.center,
  child: ClipOval(
    child: Image.asset(
      "image/a001.jpg",
    ),
  ),
);

第四种 CircleAvatar

Container(
  alignment: Alignment.center,
  child: CircleAvatar(
    radius:6.0,
    backgroundImage: AssetImage( //背景图 child可以添加内容
      "image/a001.jpg",
    ),
  ),
);

拓展 自定义裁剪样式 ClipPath 路径裁剪