Container(
child: Stack(
children: [
// Container with color blue
Container(
height: 150,
width: double.infinity,
decoration: BoxDecoration(
color: Colors.blue,
border: Border.all(width: 1, color: Colors.grey),
borderRadius: BorderRadius.all(Radius.circular(8))),
),
Positioned(
child: Card(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(20),
//set border radius more than 50% of height and width to make circle
),
elevation: 1,
color: Colors.white,
child: Container(
height: 36, width: 36, child: Icon(Icons.safety_check)),
),
),
// top right icon
Positioned(
left: MediaQuery.of(context).size.width - 70,
child: Card(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(20),
//set border radius more than 50% of height and width to make circle
),
elevation: 1,
color: Colors.white,
child: Container(
height: 36, width: 36, child: Icon(Icons.camera_alt)),
),
),
// Botton Left Icon
Positioned(
top: 100,
child: Card(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(20),
//set border radius more than 50% of height and width to make circle
),
elevation: 1,
color: Colors.white,
child:
Container(height: 36, width: 36, child: Icon(Icons.sailing)),
),
),
// bottom right icon
Positioned(
left: MediaQuery.of(context).size.width - 70,
top: 100,
child: Card(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(20),
//set border radius more than 50% of height and width to make circle
),
elevation: 1,
color: Colors.white,
child:
Container(height: 36, width: 36, child: Icon(Icons.gamepad)),
),
),
],
),
);

No comments:
Post a Comment