Flutter 实现控件圆角的方式

实现控件圆角的方式

• 使用Card的shape属性
• 使用Container的decoration
• 使用ClipRRect

//第一种Container(margin: const EdgeInsets.only(left: 10, right: 10, top: 100, bottom: 100),decoration: ShapeDecoration(image: const DecorationImage(image: NetworkImage('https://th.bing.com/th/id/OIP.1_lUKm-qhDMmh_zz3fw7EwHaE7?w=284&h=189&c=7&r=0&o=5&dpr=2&pid=1.7'),fit: BoxFit.cover),shape: RoundedRectangleBorder(borderRadius:BorderRadiusDirectional.circular(20))),width: double.maxFinite,child: const Align(child: Padding(padding: EdgeInsets.all(8.0),child: Text("Container decoration实现圆角(radius = 20)",style: TextStyle(color: Colors.blueAccent),),),alignment: Alignment.bottomCenter,),),//第二种
Card(shape: RoundedRectangleBorder(borderRadius: BorderRadiusDirectional.circular(20)),clipBehavior: Clip.antiAlias,child:AssetImage('images/pic_1.jpg', width: double.maxFinite,),
)
//第三种
ClipRRect( borderRadius: BorderRadius.circular(20),child:AssetImage("images/pic_2.jpeg"),
)