I put a IconButton to SliverAppBar actions , but the output compress to oval shape
actions: [
IconButton(
splashRadius: 23,
icon: Container(
decoration: BoxDecoration(
color: Color(0xFF05122B),
borderRadius: BorderRadius.circular(100)
),
padding: EdgeInsets.all(10),
child: Center(child: Icon(OIcons.share, color: Colors.white, size: 20))
),
onPressed: (){
},
),
],
if using shape with padding , icon not align center
IconButton(
splashRadius: 23,
icon: Container(
decoration: BoxDecoration(
color: Color(0xFF05122B),
shape: BoxShape.circle
),
padding: EdgeInsets.all(10),
child: Center(child: Icon(OIcons.share, color: Colors.white, size: 20))
),
onPressed: (){
},
),
if using shape with width and height , no matter how much width and height is set, the button size still small.
IconButton(
splashRadius: 23,
icon: Container(
decoration: BoxDecoration(
color: Color(0xFF05122B),
shape: BoxShape.circle
),
height: 50,
width: 50,
child: Center(child: Icon(OIcons.share, color: Colors.white, size: 20))
),
onPressed: (){
},
),
CodePudding user response:
You can use CircleAvatar instead of Container
CircleAvatar(
backgroundColor: Color(0xFF05122B),
child: IconButton(
padding: EdgeInsets.all(0),
splashRadius: 23,
icon: Icon(Icons.share, color: Colors.white, size: 20),
onPressed: () {},
),
),
CodePudding user response:
You can use shape instead of borderRadius on BoxDecoration. To increase the icon size, you need to use iconSize:x
IconButton(
splashRadius: 24,
iconSize: 43,
icon: Container(
alignment: Alignment.center,
decoration: BoxDecoration(
shape: BoxShape.circle,
color: Color(0xFF05122B),
),
child: Center(
child: Icon(Icons.share, color: Colors.white, size: 20),
),
),
onPressed: () {},
),



