How to set custom location for floating action button in flutter? - flutter

Question

Im trying to make a clone of sportify and I want to set a floating action button
Any help?

Answer 1

Can you put floating action button in custom location via Align Widget
Example:
Align(
alignment: Alignment.center,
child: FloatingActionButton(),
),
And you can get more specific locations through Chang center word

Answer 2

Try this ,
class PlayerScreen extends StatelessWidget {
const PlayerScreen({Key? key}) : super(key: key);
#override
Widget build(BuildContext context) {
return Scaffold(
body: CustomScrollView(
physics: const BouncingScrollPhysics(
parent: AlwaysScrollableScrollPhysics()),
slivers: <Widget>[
SliverAppBar(
stretch: true,
onStretchTrigger: () {
// Function callback for stretch
return Future<void>.value();
},
expandedHeight: 300.0,
flexibleSpace: FlexibleSpaceBar(
stretchModes: const <StretchMode>[
StretchMode.zoomBackground,
StretchMode.blurBackground,
StretchMode.fadeTitle,
],
centerTitle: true,
title: FloatingActionButton(
child: Icon(
Icons.play_arrow,
size: 30,
),
onPressed: () {},
backgroundColor: Colors.greenAccent[400],
),
background: Stack(
fit: StackFit.expand,
children: <Widget>[
Image.network(
'https://flutter.github.io/assets-for-api-docs/assets/widgets/owl-2.jpg',
fit: BoxFit.cover,
),
const DecoratedBox(
decoration: BoxDecoration(
gradient: LinearGradient(
begin: Alignment(0.0, 0.5),
end: Alignment.center,
colors: <Color>[
Color(0x60000000),
Color(0x00000000),
],
),
),
),
],
),
),
),
SliverList(
delegate: SliverChildBuilderDelegate((ctx, index) {
return ListTile(
leading: Icon(Icons.wb_sunny),
title: Text('Song $index'),
subtitle: Text("description"),
);
}, childCount: 20),
),
],
),
);
}
}