lyrics widget menu options

HemantKArya · Nov 1, 2024 · bc8b7b0 · bc8b7b0
1 parent 2ee6067
commit bc8b7b0
Show file tree

Hide file tree

Showing 2 changed files with 136 additions and 23 deletions.
diff --git a/lib/screens/screen/player_views/lyrics_menu.dart b/lib/screens/screen/player_views/lyrics_menu.dart
@@ -0,0 +1,96 @@
+import 'package:Bloomee/theme_data/default.dart';
+import 'package:flutter/material.dart';
+import 'package:icons_plus/icons_plus.dart';
+
+class LyricsMenu extends StatefulWidget {
+  const LyricsMenu({super.key});
+
+  @override
+  State<LyricsMenu> createState() => _LyricsMenuState();
+}
+
+class _LyricsMenuState extends State<LyricsMenu> {
+  final FocusNode _buttonFocusNode = FocusNode(debugLabel: 'LyricsMenu');
+
+  @override
+  void dispose() {
+    _buttonFocusNode.dispose();
+    super.dispose();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return MenuAnchor(
+      childFocusNode: _buttonFocusNode,
+      style: const MenuStyle(
+        backgroundColor: WidgetStatePropertyAll<Color>(
+          Color.fromARGB(255, 27, 27, 27),
+        ),
+      ),
+      menuChildren: <Widget>[
+        MenuItemButton(
+          onPressed: () {},
+          child: const Row(
+            children: <Widget>[
+              Icon(
+                MingCute.search_2_fill,
+                color: Colors.white,
+                size: 18,
+              ),
+              SizedBox(width: 8),
+              Text('Search Lyrics',
+                  style: TextStyle(color: Colors.white, fontSize: 13)),
+            ],
+          ),
+        ),
+        MenuItemButton(
+          onPressed: () {},
+          child: const Row(
+            children: <Widget>[
+              Icon(
+                MingCute.search_fill,
+                color: Colors.white,
+                size: 18,
+              ),
+              SizedBox(width: 8),
+              Text('Research Lyrics Auto',
+                  style: TextStyle(color: Colors.white, fontSize: 13)),
+            ],
+          ),
+        ),
+        MenuItemButton(
+          onPressed: () {},
+          child: const Row(
+            children: <Widget>[
+              Icon(
+                MingCute.time_line,
+                color: Colors.white,
+                size: 18,
+              ),
+              SizedBox(width: 8),
+              Text('Offset Lyrics',
+                  style: TextStyle(color: Colors.white, fontSize: 13)),
+            ],
+          ),
+        ),
+      ],
+      builder: (_, MenuController controller, Widget? child) {
+        return IconButton(
+          focusNode: _buttonFocusNode,
+          onPressed: () {
+            if (controller.isOpen) {
+              controller.close();
+            } else {
+              controller.open();
+            }
+          },
+          icon: const Icon(
+            MingCute.more_1_fill,
+            color: Default_Theme.primaryColor1,
+            size: 20,
+          ),
+        );
+      },
+    );
+  }
+}
diff --git a/lib/screens/screen/player_views/lyrics_widget.dart b/lib/screens/screen/player_views/lyrics_widget.dart
@@ -1,6 +1,8 @@
 import 'dart:async';
+import 'dart:developer';
 import 'package:Bloomee/blocs/lyrics/lyrics_cubit.dart';
 import 'package:Bloomee/blocs/mediaPlayer/bloomee_player_cubit.dart';
+import 'package:Bloomee/screens/screen/player_views/lyrics_menu.dart';
 import 'package:Bloomee/screens/widgets/sign_board_widget.dart';
 import 'package:Bloomee/theme_data/default.dart';
 import 'package:flutter/material.dart';
@@ -15,30 +17,45 @@ class LyricsWidget extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return BlocBuilder<LyricsCubit, LyricsState>(
-      builder: (context, state) {
-        return AnimatedSwitcher(
-          duration: const Duration(milliseconds: 300),
-          child: switch (state) {
-            LyricsInitial() => const Center(
-                child: CircularProgressIndicator(),
-              ),
+    return Stack(
+      children: [
+        BlocBuilder<LyricsCubit, LyricsState>(
+          builder: (context, state) {
+            return AnimatedSwitcher(
+              duration: const Duration(milliseconds: 300),
+              child: switch (state) {
+                LyricsInitial() => const Center(
+                    child: CircularProgressIndicator(),
+                  ),
 
-            // return condtional widget
-            LyricsLoaded() => LoadedLyricsWidget(state: state),
-            LyricsError() => const SignBoardWidget(
-                icon: MingCute.music_2_line,
-                message: "No Lyrics Found",
-              ),
-            LyricsLoading() => const Center(
-                child: CircularProgressIndicator(),
-              ),
-            LyricsState() => const Center(
-                child: CircularProgressIndicator(),
-              ),
+                // return condtional widget
+                LyricsLoaded() => LoadedLyricsWidget(state: state),
+                LyricsError() => const SignBoardWidget(
+                    icon: MingCute.music_2_line,
+                    message: "No Lyrics Found",
+                  ),
+                LyricsLoading() => const Center(
+                    child: CircularProgressIndicator(),
+                  ),
+                LyricsState() => const Center(
+                    child: CircularProgressIndicator(),
+                  ),
+              },
+            );
           },
-        );
-      },
+        ),
+        Positioned(
+          right: 3,
+          bottom: 0,
+          child: Container(
+            decoration: BoxDecoration(
+              color: Colors.black.withOpacity(0.3),
+              borderRadius: BorderRadius.circular(20),
+            ),
+            child: LyricsMenu(),
+          ),
+        ),
+      ],
     );
   }
 }
@@ -62,7 +79,7 @@ class LoadedLyricsWidget extends StatelessWidget {
     }
     return const Center(
       child: SignBoardWidget(
-          message: "No Lyrics found", icon: MingCute.music_2_line),
+          message: "No Lyrics found!", icon: MingCute.music_2_line),
     );
   }
 }