Flutter 圓形/圓角頭像
阿新 • • 發佈:2019-01-04
- 圓形頭像
① ClipOval
new ClipOval(
child: new Image.asset(Utils.getImgPath('ali_connors')),
)
② CircleAvatar
new CircleAvatar(
radius: 36.0,
backgroundImage: AssetImage(
Utils.getImgPath('ali_connors'),
),
)
③ BoxDecoration BoxShape.circle
new Container( width: 72.0, height: 72.0, decoration: BoxDecoration( shape: BoxShape.circle, image: DecorationImage( image: AssetImage( Utils.getImgPath('ali_connors'), ), ), ), )
- 圓角頭像
① ClipRRect
new ClipRRect(
borderRadius: BorderRadius.circular(6.0),
child: new Image.asset(Utils.getImgPath('ali_connors')),
)
② BoxDecoration BoxShape.rectangle
new Container( width: 88.0, height: 88.0, decoration: BoxDecoration( shape: BoxShape.rectangle, borderRadius: BorderRadius.circular(6.0), image: DecorationImage( image: AssetImage( Utils.getImgPath('ali_connors'), ), ), ),
Screenshots