Flutter 圆角（一）BoxDecoration

String imageNetwork = "http://pic41.nipic.com/20140514/5295460_234432363121_2.jpg";
return Container (
   //父视图如果不对宽高进行设置，那么默认取屏幕宽高
   decoration: BoxDecoration(
     color: Colors.red,
     shape: BoxShape.circle,
     image: DecorationImage(image: NetworkImage(imageNetwork),),
   ),
);

BoxShape_circle_1.png

//BoxDecoration不设置image时，父视图的取宽高中的较小值画圆，这时展示的是圆
//BoxDecoration设置image时，以父视图的宽高中的较大值切圆，这时展示的不是圆
return Container (
  decoration: BoxDecoration(
  color: Colors.red,
  shape: BoxShape.circle,
//  image: DecorationImage(image: NetworkImage(imageNetwork),),
),

BoxShape_circle_2.png

//Container 的 color 和 decoration 不能同时设置
//BoxShape.circle  默认切的就是圆，所以不用设置borderRadius
//BoxShape.rectangle  可以切圆角矩形
return Center(
  child: Container(width: 300, height: 300,
  decoration: BoxDecoration(
  shape: BoxShape.circle,
  image: DecorationImage(image: NetworkImage(imageNetwork),),
  ),
 ),
);

return Center(
  child: Container(width: 300, height: 300,
  decoration: BoxDecoration(
  shape: BoxShape.rectangle,
  borderRadius: BorderRadius.circular(20.0),
  image: DecorationImage(image: NetworkImage(imageNetwork),),
  ),
 ),
);

BoxShape_circle_3.png