enter image description here This is the image of the button that I want to create pls help me how to create a button like this
enter image description here This is the image of the button that I want to create pls help me how to create a button like this
Try this:
import 'package:flutter/material.dart';
void main() => runApp(const MyApp());
class MyApp extends StatelessWidget {
const MyApp({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Material App',
home: Scaffold(
appBar: AppBar(
title: const Text('Material App Bar'),
),
body: const Center(
child: CustomButton(),
),
),
);
}
}
class CustomButton extends StatelessWidget {
const CustomButton({
Key? key,
}) : super(key: key);
@override
Widget build(BuildContext context) {
return Stack(
children: [
Stack(
alignment: Alignment.center,
children: [
ElevatedButton(
onPressed: () => print("Hello"),
child: Text(
"Hello",
style: TextStyle(
color: Colors.black54,
),
),
style: ElevatedButton.styleFrom(
fixedSize: Size(150, 30),
elevation: 10,
primary: Colors.white,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(15)
),
padding: EdgeInsets.only(left: 30),
),
),
Transform.translate(
offset: Offset(-75,0),
child: Material(
elevation: 10,
shape: CircleBorder(),
child: Container(
width: 50,
height: 50,
child: FittedBox(
child: Icon(
Icons.play_arrow,
color: Colors.black54,
)
),
decoration: BoxDecoration(
color: Colors.white,
shape: BoxShape.circle,
),
),
)
)
],
)
],
);
}
}